Skip to content

Instantly share code, notes, and snippets.

@mistergraphx
mistergraphx / _sass-test.scss
Last active August 29, 2015 14:20
Sass test & usage
// ----
// libsass (v3.1.0)
// ----
$version: '1.2.4';
// This comment 'll exit in compressed mode
/*! Framework #{$version} */
/* # Nested properties
@mistergraphx
mistergraphx / _component-starter.scss
Last active August 29, 2015 14:20
Component starter, somme test about a component structure
// ----
// libsass (v3.1.0)
// ----
@import "bourbon/bourbon";
@import "neat/neat";
// Breakpoints
// Tweakpoints
@mistergraphx
mistergraphx / _starburst.scss
Last active August 29, 2015 14:21
Animated cSS3 StarBurst
// ----
// libsass (v3.2.2)
// ----
/* # Starburst 1
Markup:
<a href="#" class="starburst1"><span><br />NEW<br />CSS3<br />Starbursts!</span></a>
Styleguide fragments.components.starburst
@mistergraphx
mistergraphx / _google-web-font.scss
Last active November 29, 2016 06:32
Google-web-font loading
// ----
// libsass (v3.2.2)
// ----
/* # Dynamically import only used Google Webfonts
@see <http://advancedsass.com/articles/dynamically-import-only-used-google-webfonts.html>
*/
// ----
// libsass (v3.2.2)
// ----
/*# Theme generator
@see - Source : <http://www.developwithpurpose.com/creating-a-sass-theme-engine/>
Styleguide theming
*/
@mistergraphx
mistergraphx / _vertical-align.scss
Last active August 29, 2015 14:21
Vertical alignement
// ----
// libsass (v3.2.2)
// ----
/* # @mixin vertical-align
@mixin vertical-align
@param $axis (x,y, both !default)
@param $position (absolute, relative !default)
@see - <http://caniuse.com/#feat=transforms2d>
// ----
// libsass (v3.2.4)
// ----
$media-stack:
(group: tablet, id: general, rule: "only screen and (min-device-width: 700px)"),
(group: small, id: general, rule: "only screen and(min-device-width: 1100px)"),
(group: small, id: inbetween, rule: "only screen and(min-device-width: 1100px) and (max-device-width: 1400px)"),
(group: large, id: general, rule: "only screen and(min-device-width: 1400px)"),
(group: print, id: general, rule: "only print"),
@mistergraphx
mistergraphx / SassMeister-output.css
Last active August 29, 2015 14:21
A sass converting function
@charset "UTF-8";
html {
box-sizing: border-box;
}
*,
*::after,
*::before {
box-sizing: inherit;
}
@mistergraphx
mistergraphx / SassMeister-output.css
Last active August 29, 2015 14:21
Modified version of the bourbon linear-gradient mixin ... Generated by SassMeister.com.
html {
box-sizing: border-box;
}
*,
*::after,
*::before {
box-sizing: inherit;
}