bogdansoare

// Group: Font & Baseline Sizes
$base-font-size: (13/16)*100%;
$baseline-unitless: 23 / (16*($base-font-size/100%));
$baseline: $baseline-unitless * 1rem;

bogdansoare

// Involves some hacky manually-coded pixel values, but a lifesaver for debugging grids
@if $debug {
  .debug--cols {
    @each $group in $col-groups {
        .grid--debug-#{$group}-cols:before {
          content: '';
          position: absolute;
          margin: 0 auto;
          top: 0;
          right: 0;

bogdansoare

/*-----------------------------------*\

  Grid (derived from Toast: http://daneden.github.io/Toast)

  An insane grid.
  You'd be mad to use it.

  Usage
  =====

bogdansoare

// Not shown here is the Grunt task that takes source SVGs, creates PNGs (later optimised by imageoptim) and minified SVGs

@mixin bg-image($image, $size: 16px, $repeat: no-repeat, $position: center) {
  // SVG backgrounds with PNG fallback
  // All browsers that support multiple backgrounds also support SVGs. Woohoo!
  background-image: image-url("#{$image}.png");
  // inline-image requires Compass
  background-image: inline-image("#{$image}.min.svg"), none;

  background-size: $size;

bogdansoare

// config
$_color-base-grey: rgb(229,231,234);
$palettes: (
    purple: (
        base:   rgb(42,40,80),
        light:  rgb(51,46,140),
        dark:   rgb(40,38,65)
    ),
    grey: (
        base:  $_color-base-grey,

bogdansoare

// In your mixin file
=retina
  @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx), (min-resolution: 192dpi)
    @content
    
// Call this mixin
.something
  +retina
    something: something

bogdansoare

//Set Variables
$button-white:          #ffffff;
$button-green:          #44ca00;
$button-green-dark:     #369a12;
$button-blue:           #a6d1f9;
$button-blue-dark:      #14283e;
$button-gray:           #eeeeee;
$button-red:            #9e0b0f;

//Create Array

bogdansoare

$z-index: (
  modal              : 200,
  navigation         : 100,
  footer             : 90,
  triangle           : 60,
  navigation-rainbow : 50,
  share-type         : 41,
  share              : 40,
);

bogdansoare

$social-colors: (
  dribbble: #ea4c89,
  facebook: #3b5998,
  github: #171515,
  google: #db4437,
  twitter: #55acee
);

.social-link {
  color: white;

bogdansoare

@mixin font-smoothing($value: on) {
    @if $value == on {
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }
    @else {
        -webkit-font-smoothing: subpixel-antialiased;
        -moz-osx-font-smoothing: auto;
    }
}