KittyGiraudel

// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// ----

// A clean way to deal with z-index layers in Sass
// Based on http://css-tricks.com/handling-z-index/
// ---

// A map of z layers

KittyGiraudel

// ----
// Sass (v3.3.5)
// Compass (v1.0.0.alpha.18)
// ----

// Because of the way floats work in any language
// You cannot expect a float to be precise.
// ---
// While one could expect 0.12 to equal 0.10 + 0.02
// Unfortunately, it is not. 

KittyGiraudel

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

// Helper mixin for offset positioning
// About: http://hugogiraudel.com/2013/08/05/offsets-sass-mixin/
// ---
// Here is an improved version adding some extra features
// ---

KittyGiraudel

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

// Fifty Shades of Grey in Sass
// For your pleasure boys and girls.

/// Computing 50 shades of Grey
/// @param {Color} $color (grey) - Base color

KittyGiraudel

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

$breakpoints: (
  'small'  : ( min-width:  767px ),
  'medium' : ( min-width:  992px ),
  'large'  : ( min-width: 1200px )
);

KittyGiraudel

<div class="rating rating-1">
  <i class="star-1">★</i>
  <i class="star-2">★</i>
  <i class="star-3">★</i>
  <i class="star-4">★</i>
  <i class="star-5">★</i>
</div>
<div class="rating rating-1">
  <i class="star-1">★</i>
  <i class="star-2 is-half">★</i>

KittyGiraudel

// ----
// Sass (v3.3.7)
// Compass (v1.0.0.alpha.18)
// ----

// _mixins.scss
@mixin module($color, $duration: 0s, $border: null) {
  background: $color;
  transition: $duration;
  border: $border;

KittyGiraudel

// ----
// Sass (v3.3.14)
// Compass (v1.0.1)
// ----

/// jQuery-style extend function
/// About `map-merge()`:
/// * only takes 2 arguments
/// * is not recursive
/// @param {Map} $object - first map

KittyGiraudel

// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// ----

// Placeholder using &
// ---
%C {
  Z & {
    property: value;

KittyGiraudel

// ----
// Sass (v3.3.8)
// Compass (v1.0.0.alpha.19)
// ----

// One thing I do like in programming languages
// is the ability to "type" variables,
// especially in functions signatures. 
// 
// Unfortunately, Sass does not allow this. So