kaelig

source "http://rubygems.org"
group :development do
  gem 'rake'
  gem 'guard'
  gem 'coffee-script'
  gem 'rb-fsevent'
  gem 'rb-inotify'
  gem 'compass'
  gem 'sass'
  gem 'guard-compass'

kaelig

/**
 * Speech Bubble
 */

.speech-bubble {
    position: relative;
    display: inline-block;
    background: #F5644F;
    padding: .1em .3em;
    border-radius: 4px;

kaelig

// ----
// Sass (v3.3.10)
// Compass (v1.0.0.alpha.20)
// ----

// To enable support for browsers that do not support @media queries,
// (IE <= 8, Firefox <= 3, Opera <= 9) set $mq-responsive to false
// Create a separate stylesheet served exclusively to these browsers,
// meaning @media queries will be rasterized, relying on the cascade itself
$mq-responsive: true !default;

kaelig

// ----
// Sass (v3.3.0.rc.3)
// Compass (v1.0.0.alpha.18)
// ----

$guss-rem-baseline: 10px !default;

// Transform a value into rem
// Assuming baseline is set to 10px on :root/html
@function rem($value, $baseline: $guss-rem-baseline) {

kaelig

// Clamps a block of text to a certain number of lines,
// followed by an ellipsis in Webkit and Blink based browsers
// Reference: http://dropshado.ws/post/1015351370/webkit-line-clamp
@mixin text-clamp($lines: 2, $line-height: false) {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: $lines;

    // Fallback for non-Webkit browsers

kaelig

<h1>Row test</h1>
<!--[if (lte IE 9) & (!IEMobile)]>
<div class="old-ie">
<![endif]-->

    <!-- items: 2 -->
    <div class="l-row l-row--items-2">
        <div class="l-row__item l-row__item--boost-1">1+</div>
        <div class="l-row__item">2</div>
    </div>

kaelig

 <h1>Columns test</h1>
<!--[if (lte IE 9) & (!IEMobile)]>
<div class="old-ie">
<![endif]-->

<div class="l-columns">
    <div class="l-columns__item">1</div>
    <div class="l-columns__item">2</div>
    <div class="l-columns__item">3</div>
    <div class="l-columns__item">4</div>

kaelig

 <h1>Columns test</h1>
<!--[if (lte IE 9) & (!IEMobile)]>
<div class="old-ie">
<![endif]-->

<div class="l-columns">
    <div class="l-columns__item">1</div>
    <div class="l-columns__item">2</div>
    <div class="l-columns__item">3</div>
    <div class="l-columns__item">4</div>

kaelig

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

// Accessible font-size and line-height with a pixel fallback
// Usage:
// @include font-size(18, 24);
@mixin font-size($size, $line-height: $size) {
    @include rem((

kaelig

// ----
// Sass (v3.3.0.rc.2)
// Compass (v1.0.0.alpha.17)
// ----

$Memo: () !default;

// To enable support for browsers that do not support @media queries,
// (IE <= 8, Firefox <= 3, Opera <= 9) set $mq-responsive to false
// Create a separate stylesheet served exclusively to these browsers,