sled 4.5.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/LICENSE +13 -0
 - data/README.md +24 -0
 - data/lib/generators/inuit/install/USAGE +9 -0
 - data/lib/generators/inuit/install/install_generator.rb +10 -0
 - data/lib/generators/inuit/install/templates/inuit_and_override.css.scss +3 -0
 - data/lib/sled.rb +8 -0
 - data/lib/sled/version.rb +3 -0
 - data/vendor/assets/stylesheets/_vars.scss +124 -0
 - data/vendor/assets/stylesheets/assets/batch/batch.eot +0 -0
 - data/vendor/assets/stylesheets/assets/batch/batch.svg +360 -0
 - data/vendor/assets/stylesheets/assets/batch/batch.ttf +0 -0
 - data/vendor/assets/stylesheets/assets/batch/batch.woff +0 -0
 - data/vendor/assets/stylesheets/assets/batch/batch_webfont_reference.pdf +0 -0
 - data/vendor/assets/stylesheets/inuit.css/_inuit.scss +210 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_code.scss +63 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_forms.scss +174 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_headings.scss +60 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_images.scss +67 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_links.scss +37 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_lists.scss +19 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_main.scss +8 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_paragraphs.scss +11 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_quotes.scss +96 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_smallprint.scss +13 -0
 - data/vendor/assets/stylesheets/inuit.css/base/_tables.scss +163 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_brand.scss +18 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_clearfix.scss +15 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_debug.scss +168 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_helper.scss +112 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_mixins.scss +299 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_normalize.scss +396 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_pull.scss +123 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_push.scss +123 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_reset.scss +80 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_shared.scss +61 -0
 - data/vendor/assets/stylesheets/inuit.css/generic/_widths.scss +154 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_arrows.scss +143 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_batch.scss +15 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_block-list.scss +40 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_breadcrumb.scss +59 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_buttons.scss +44 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_columns.scss +18 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_flexbox.scss +51 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_flyout.scss +59 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_greybox.scss +54 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_grids.scss +99 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_icon-text.scss +36 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_island.scss +34 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_link-complex.scss +28 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_lozenges.scss +42 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_marginalia.scss +48 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_matrix.scss +98 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_media.scss +56 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_nav.scss +151 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_options.scss +41 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_pagination.scss +46 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_rules.scss +61 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_split.scss +35 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_sprite.scss +92 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_stats.scss +48 -0
 - data/vendor/assets/stylesheets/inuit.css/objects/_this-or-this.scss +34 -0
 - data/vendor/assets/stylesheets/style.scss +23 -0
 - metadata +126 -0
 
| 
         @@ -0,0 +1,60 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $HEADINGS
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * As per: csswizardry.com/2012/02/pragmatic-practical-font-sizing-in-css
         
     | 
| 
      
 6 
     | 
    
         
            +
             *
         
     | 
| 
      
 7 
     | 
    
         
            +
             * When we define a heading we also define a corresponding class to go with it.
         
     | 
| 
      
 8 
     | 
    
         
            +
             * This allows us to apply, say, `class=alpha` to a `h3`; a double-stranded
         
     | 
| 
      
 9 
     | 
    
         
            +
             * heading hierarchy.
         
     | 
| 
      
 10 
     | 
    
         
            +
             */
         
     | 
| 
      
 11 
     | 
    
         
            +
            h1,.alpha{
         
     | 
| 
      
 12 
     | 
    
         
            +
                @include font-size($h1-size);
         
     | 
| 
      
 13 
     | 
    
         
            +
            }
         
     | 
| 
      
 14 
     | 
    
         
            +
            h2,.beta{
         
     | 
| 
      
 15 
     | 
    
         
            +
                @include font-size($h2-size);
         
     | 
| 
      
 16 
     | 
    
         
            +
            }
         
     | 
| 
      
 17 
     | 
    
         
            +
            h3,.gamma{
         
     | 
| 
      
 18 
     | 
    
         
            +
                @include font-size($h3-size);
         
     | 
| 
      
 19 
     | 
    
         
            +
            }
         
     | 
| 
      
 20 
     | 
    
         
            +
            h4,.delta{
         
     | 
| 
      
 21 
     | 
    
         
            +
                @include font-size($h4-size);
         
     | 
| 
      
 22 
     | 
    
         
            +
            }
         
     | 
| 
      
 23 
     | 
    
         
            +
            h5,.epsilon{
         
     | 
| 
      
 24 
     | 
    
         
            +
                @include font-size($h5-size);
         
     | 
| 
      
 25 
     | 
    
         
            +
            }
         
     | 
| 
      
 26 
     | 
    
         
            +
            h6,.zeta{
         
     | 
| 
      
 27 
     | 
    
         
            +
                @include font-size($h6-size);
         
     | 
| 
      
 28 
     | 
    
         
            +
            }
         
     | 
| 
      
 29 
     | 
    
         
            +
             
     | 
| 
      
 30 
     | 
    
         
            +
             
     | 
| 
      
 31 
     | 
    
         
            +
            /**
         
     | 
| 
      
 32 
     | 
    
         
            +
             * Heading groups and generic any-heading class.
         
     | 
| 
      
 33 
     | 
    
         
            +
             * To target any heading of any level simply apply a class of `.hN`, e.g.:
         
     | 
| 
      
 34 
     | 
    
         
            +
             *
         
     | 
| 
      
 35 
     | 
    
         
            +
               <hgroup>
         
     | 
| 
      
 36 
     | 
    
         
            +
                   <h1 class=hN>inuit.css</h1>
         
     | 
| 
      
 37 
     | 
    
         
            +
                   <h2 class=hN>Best. Framework. Ever!</h2>
         
     | 
| 
      
 38 
     | 
    
         
            +
               </hgroup>
         
     | 
| 
      
 39 
     | 
    
         
            +
             *
         
     | 
| 
      
 40 
     | 
    
         
            +
             */
         
     | 
| 
      
 41 
     | 
    
         
            +
            .hN{
         
     | 
| 
      
 42 
     | 
    
         
            +
            }
         
     | 
| 
      
 43 
     | 
    
         
            +
            hgroup .hN{
         
     | 
| 
      
 44 
     | 
    
         
            +
                margin-bottom:0;
         
     | 
| 
      
 45 
     | 
    
         
            +
            }
         
     | 
| 
      
 46 
     | 
    
         
            +
             
     | 
| 
      
 47 
     | 
    
         
            +
             
     | 
| 
      
 48 
     | 
    
         
            +
            /**
         
     | 
| 
      
 49 
     | 
    
         
            +
             * A series of classes for setting massive type; for use in heroes, mastheads,
         
     | 
| 
      
 50 
     | 
    
         
            +
             * promos, etc.
         
     | 
| 
      
 51 
     | 
    
         
            +
             */
         
     | 
| 
      
 52 
     | 
    
         
            +
            .giga{
         
     | 
| 
      
 53 
     | 
    
         
            +
                @include font-size($giga-size);
         
     | 
| 
      
 54 
     | 
    
         
            +
            }
         
     | 
| 
      
 55 
     | 
    
         
            +
            .mega{
         
     | 
| 
      
 56 
     | 
    
         
            +
                @include font-size($mega-size);
         
     | 
| 
      
 57 
     | 
    
         
            +
            }
         
     | 
| 
      
 58 
     | 
    
         
            +
            .kilo{
         
     | 
| 
      
 59 
     | 
    
         
            +
                @include font-size($kilo-size);
         
     | 
| 
      
 60 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,67 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $IMAGES
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * Demo: jsfiddle.net/inuitcss/yMtur
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
            /**
         
     | 
| 
      
 8 
     | 
    
         
            +
             * Fluid images.
         
     | 
| 
      
 9 
     | 
    
         
            +
             */
         
     | 
| 
      
 10 
     | 
    
         
            +
            img{
         
     | 
| 
      
 11 
     | 
    
         
            +
                max-width:100%;
         
     | 
| 
      
 12 
     | 
    
         
            +
            }
         
     | 
| 
      
 13 
     | 
    
         
            +
             
     | 
| 
      
 14 
     | 
    
         
            +
             
     | 
| 
      
 15 
     | 
    
         
            +
            /**
         
     | 
| 
      
 16 
     | 
    
         
            +
             * Non-fluid images if you specify `width` and/or `height` attributes.
         
     | 
| 
      
 17 
     | 
    
         
            +
             */
         
     | 
| 
      
 18 
     | 
    
         
            +
            img[width],
         
     | 
| 
      
 19 
     | 
    
         
            +
            img[height]{
         
     | 
| 
      
 20 
     | 
    
         
            +
                max-width:none;
         
     | 
| 
      
 21 
     | 
    
         
            +
            }
         
     | 
| 
      
 22 
     | 
    
         
            +
             
     | 
| 
      
 23 
     | 
    
         
            +
             
     | 
| 
      
 24 
     | 
    
         
            +
            /**
         
     | 
| 
      
 25 
     | 
    
         
            +
             * Image placement variations.
         
     | 
| 
      
 26 
     | 
    
         
            +
             */
         
     | 
| 
      
 27 
     | 
    
         
            +
            .img--right{
         
     | 
| 
      
 28 
     | 
    
         
            +
                float:right;
         
     | 
| 
      
 29 
     | 
    
         
            +
                margin-bottom:$base-spacing-unit;
         
     | 
| 
      
 30 
     | 
    
         
            +
                margin-left:$base-spacing-unit;
         
     | 
| 
      
 31 
     | 
    
         
            +
            }
         
     | 
| 
      
 32 
     | 
    
         
            +
            .img--left{
         
     | 
| 
      
 33 
     | 
    
         
            +
                float:left;
         
     | 
| 
      
 34 
     | 
    
         
            +
                margin-right:$base-spacing-unit;
         
     | 
| 
      
 35 
     | 
    
         
            +
                margin-bottom:$base-spacing-unit;
         
     | 
| 
      
 36 
     | 
    
         
            +
            }
         
     | 
| 
      
 37 
     | 
    
         
            +
            .img--center{
         
     | 
| 
      
 38 
     | 
    
         
            +
                display:block;
         
     | 
| 
      
 39 
     | 
    
         
            +
                margin-right:auto;
         
     | 
| 
      
 40 
     | 
    
         
            +
                margin-bottom:$base-spacing-unit;
         
     | 
| 
      
 41 
     | 
    
         
            +
                margin-left:auto;
         
     | 
| 
      
 42 
     | 
    
         
            +
            }
         
     | 
| 
      
 43 
     | 
    
         
            +
             
     | 
| 
      
 44 
     | 
    
         
            +
             
     | 
| 
      
 45 
     | 
    
         
            +
            /**
         
     | 
| 
      
 46 
     | 
    
         
            +
             * Keep your images on your baseline.
         
     | 
| 
      
 47 
     | 
    
         
            +
             *
         
     | 
| 
      
 48 
     | 
    
         
            +
             * Please note, these will not work too nicely with fluid images and will
         
     | 
| 
      
 49 
     | 
    
         
            +
             * distort when resized below a certain width. Use with caution.
         
     | 
| 
      
 50 
     | 
    
         
            +
             */
         
     | 
| 
      
 51 
     | 
    
         
            +
            .img--short{
         
     | 
| 
      
 52 
     | 
    
         
            +
                height:5 * $base-spacing-unit;
         
     | 
| 
      
 53 
     | 
    
         
            +
            }
         
     | 
| 
      
 54 
     | 
    
         
            +
            .img--medium{
         
     | 
| 
      
 55 
     | 
    
         
            +
                height:10 * $base-spacing-unit;
         
     | 
| 
      
 56 
     | 
    
         
            +
            }
         
     | 
| 
      
 57 
     | 
    
         
            +
            .img--tall{
         
     | 
| 
      
 58 
     | 
    
         
            +
                height:15 * $base-spacing-unit;
         
     | 
| 
      
 59 
     | 
    
         
            +
            }
         
     | 
| 
      
 60 
     | 
    
         
            +
             
     | 
| 
      
 61 
     | 
    
         
            +
             
     | 
| 
      
 62 
     | 
    
         
            +
            /**
         
     | 
| 
      
 63 
     | 
    
         
            +
             * Images in `figure` elements.
         
     | 
| 
      
 64 
     | 
    
         
            +
             */
         
     | 
| 
      
 65 
     | 
    
         
            +
            figure > img{
         
     | 
| 
      
 66 
     | 
    
         
            +
                display:block;
         
     | 
| 
      
 67 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,37 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $LINKS
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * Say no to negative hovers, as per: csswizardry.com/2011/05/on-negative-hovers
         
     | 
| 
      
 6 
     | 
    
         
            +
             *
         
     | 
| 
      
 7 
     | 
    
         
            +
             * Sometimes, particularly on larger projects, it is useful to scope link
         
     | 
| 
      
 8 
     | 
    
         
            +
             * styling only to anchors which have `href` attributes.
         
     | 
| 
      
 9 
     | 
    
         
            +
             */
         
     | 
| 
      
 10 
     | 
    
         
            +
            a{
         
     | 
| 
      
 11 
     | 
    
         
            +
                /**
         
     | 
| 
      
 12 
     | 
    
         
            +
                 * Set colors etc in your theme stylesheet.
         
     | 
| 
      
 13 
     | 
    
         
            +
                 */
         
     | 
| 
      
 14 
     | 
    
         
            +
             
     | 
| 
      
 15 
     | 
    
         
            +
                &:hover,
         
     | 
| 
      
 16 
     | 
    
         
            +
                &:active,
         
     | 
| 
      
 17 
     | 
    
         
            +
                &:focus{
         
     | 
| 
      
 18 
     | 
    
         
            +
                    text-decoration:underline;
         
     | 
| 
      
 19 
     | 
    
         
            +
                }
         
     | 
| 
      
 20 
     | 
    
         
            +
            }
         
     | 
| 
      
 21 
     | 
    
         
            +
             
     | 
| 
      
 22 
     | 
    
         
            +
             
     | 
| 
      
 23 
     | 
    
         
            +
            /**
         
     | 
| 
      
 24 
     | 
    
         
            +
             * ‘Current’ states, e.g.:
         
     | 
| 
      
 25 
     | 
    
         
            +
             *
         
     | 
| 
      
 26 
     | 
    
         
            +
               <ul class=nav>
         
     | 
| 
      
 27 
     | 
    
         
            +
                   <li><a href=#>Home</a></li>
         
     | 
| 
      
 28 
     | 
    
         
            +
                   <li><a href=#>About</a></li>
         
     | 
| 
      
 29 
     | 
    
         
            +
                   <li class=current><a href=#>Portfolio</a></li>
         
     | 
| 
      
 30 
     | 
    
         
            +
                   <li><a href=#>Contact</a></li>
         
     | 
| 
      
 31 
     | 
    
         
            +
               </ul>
         
     | 
| 
      
 32 
     | 
    
         
            +
             *
         
     | 
| 
      
 33 
     | 
    
         
            +
             */
         
     | 
| 
      
 34 
     | 
    
         
            +
            .current > a{
         
     | 
| 
      
 35 
     | 
    
         
            +
                cursor:text;
         
     | 
| 
      
 36 
     | 
    
         
            +
                text-decoration:underline;
         
     | 
| 
      
 37 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,19 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $LISTS
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * Remove vertical spacing from nested lists.
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
            li{
         
     | 
| 
      
 8 
     | 
    
         
            +
                > ul,
         
     | 
| 
      
 9 
     | 
    
         
            +
                > ol{
         
     | 
| 
      
 10 
     | 
    
         
            +
                     margin-bottom:0;
         
     | 
| 
      
 11 
     | 
    
         
            +
                 }
         
     | 
| 
      
 12 
     | 
    
         
            +
            }
         
     | 
| 
      
 13 
     | 
    
         
            +
             
     | 
| 
      
 14 
     | 
    
         
            +
            /**
         
     | 
| 
      
 15 
     | 
    
         
            +
             * Have a numbered `ul` without the semantics implied by using an `ol`.
         
     | 
| 
      
 16 
     | 
    
         
            +
             */
         
     | 
| 
      
 17 
     | 
    
         
            +
            /*ul*/.numbered-list{
         
     | 
| 
      
 18 
     | 
    
         
            +
                list-style-type:decimal;
         
     | 
| 
      
 19 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,11 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $PARAGRAPHS
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * The `.lede` class is used to make the introductory text (usually a paragraph)
         
     | 
| 
      
 6 
     | 
    
         
            +
             * of a document slightly larger.
         
     | 
| 
      
 7 
     | 
    
         
            +
             */
         
     | 
| 
      
 8 
     | 
    
         
            +
            .lede,
         
     | 
| 
      
 9 
     | 
    
         
            +
            .lead{
         
     | 
| 
      
 10 
     | 
    
         
            +
                @include font-size($base-font-size * 1.125);
         
     | 
| 
      
 11 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,96 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $QUOTES
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * If English quotes are set in `_vars.scss`, define them here.
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
            @if $english-quotes == true{
         
     | 
| 
      
 8 
     | 
    
         
            +
                $open-quote:    “;
         
     | 
| 
      
 9 
     | 
    
         
            +
                $close-quote:   ”;
         
     | 
| 
      
 10 
     | 
    
         
            +
            }
         
     | 
| 
      
 11 
     | 
    
         
            +
             
     | 
| 
      
 12 
     | 
    
         
            +
             
     | 
| 
      
 13 
     | 
    
         
            +
            /**
         
     | 
| 
      
 14 
     | 
    
         
            +
             * Big up @boblet: html5doctor.com/blockquote-q-cite
         
     | 
| 
      
 15 
     | 
    
         
            +
             */
         
     | 
| 
      
 16 
     | 
    
         
            +
             
     | 
| 
      
 17 
     | 
    
         
            +
            /**
         
     | 
| 
      
 18 
     | 
    
         
            +
             * Inline quotes.
         
     | 
| 
      
 19 
     | 
    
         
            +
             */
         
     | 
| 
      
 20 
     | 
    
         
            +
            q{
         
     | 
| 
      
 21 
     | 
    
         
            +
                quotes:"‘" "’" "#{$open-quote}" "#{$close-quote}";
         
     | 
| 
      
 22 
     | 
    
         
            +
             
     | 
| 
      
 23 
     | 
    
         
            +
                &:before{
         
     | 
| 
      
 24 
     | 
    
         
            +
                    content:"‘";
         
     | 
| 
      
 25 
     | 
    
         
            +
                    content:open-quote;
         
     | 
| 
      
 26 
     | 
    
         
            +
                }
         
     | 
| 
      
 27 
     | 
    
         
            +
                &:after{
         
     | 
| 
      
 28 
     | 
    
         
            +
                    content:"’";
         
     | 
| 
      
 29 
     | 
    
         
            +
                    content:close-quote;
         
     | 
| 
      
 30 
     | 
    
         
            +
                }
         
     | 
| 
      
 31 
     | 
    
         
            +
             
     | 
| 
      
 32 
     | 
    
         
            +
                q:before{
         
     | 
| 
      
 33 
     | 
    
         
            +
                    content:"“";
         
     | 
| 
      
 34 
     | 
    
         
            +
                    content:open-quote;
         
     | 
| 
      
 35 
     | 
    
         
            +
                }
         
     | 
| 
      
 36 
     | 
    
         
            +
                q:after{
         
     | 
| 
      
 37 
     | 
    
         
            +
                    content:"”";
         
     | 
| 
      
 38 
     | 
    
         
            +
                    content:close-quote;
         
     | 
| 
      
 39 
     | 
    
         
            +
                }
         
     | 
| 
      
 40 
     | 
    
         
            +
            }
         
     | 
| 
      
 41 
     | 
    
         
            +
             
     | 
| 
      
 42 
     | 
    
         
            +
            blockquote{
         
     | 
| 
      
 43 
     | 
    
         
            +
                quotes:"#{$open-quote}" "#{$close-quote}";
         
     | 
| 
      
 44 
     | 
    
         
            +
             
     | 
| 
      
 45 
     | 
    
         
            +
                p:before{
         
     | 
| 
      
 46 
     | 
    
         
            +
                    content:"#{$open-quote}";
         
     | 
| 
      
 47 
     | 
    
         
            +
                    content:open-quote;
         
     | 
| 
      
 48 
     | 
    
         
            +
                }
         
     | 
| 
      
 49 
     | 
    
         
            +
                p:after{
         
     | 
| 
      
 50 
     | 
    
         
            +
                    content:"";
         
     | 
| 
      
 51 
     | 
    
         
            +
                    content:no-close-quote;
         
     | 
| 
      
 52 
     | 
    
         
            +
                }
         
     | 
| 
      
 53 
     | 
    
         
            +
                p:last-of-type:after{
         
     | 
| 
      
 54 
     | 
    
         
            +
                    content:"#{$close-quote}";
         
     | 
| 
      
 55 
     | 
    
         
            +
                    content:close-quote;
         
     | 
| 
      
 56 
     | 
    
         
            +
                }
         
     | 
| 
      
 57 
     | 
    
         
            +
             
     | 
| 
      
 58 
     | 
    
         
            +
                q:before{
         
     | 
| 
      
 59 
     | 
    
         
            +
                    content:"‘";
         
     | 
| 
      
 60 
     | 
    
         
            +
                    content:open-quote;
         
     | 
| 
      
 61 
     | 
    
         
            +
                }
         
     | 
| 
      
 62 
     | 
    
         
            +
                q:after{
         
     | 
| 
      
 63 
     | 
    
         
            +
                    content:"’";
         
     | 
| 
      
 64 
     | 
    
         
            +
                    content:close-quote;
         
     | 
| 
      
 65 
     | 
    
         
            +
                }
         
     | 
| 
      
 66 
     | 
    
         
            +
            }
         
     | 
| 
      
 67 
     | 
    
         
            +
             
     | 
| 
      
 68 
     | 
    
         
            +
             
     | 
| 
      
 69 
     | 
    
         
            +
            /**
         
     | 
| 
      
 70 
     | 
    
         
            +
             *
         
     | 
| 
      
 71 
     | 
    
         
            +
               <blockquote>
         
     | 
| 
      
 72 
     | 
    
         
            +
                   <p>Insanity: doing the same thing over and over again and expecting
         
     | 
| 
      
 73 
     | 
    
         
            +
                   different results.</p>
         
     | 
| 
      
 74 
     | 
    
         
            +
                   <b class=source>Albert Einstein</b>
         
     | 
| 
      
 75 
     | 
    
         
            +
               </blockquote>
         
     | 
| 
      
 76 
     | 
    
         
            +
             *
         
     | 
| 
      
 77 
     | 
    
         
            +
             */
         
     | 
| 
      
 78 
     | 
    
         
            +
            blockquote{
         
     | 
| 
      
 79 
     | 
    
         
            +
                /**
         
     | 
| 
      
 80 
     | 
    
         
            +
                 * .4em is roughly equal to the width of the opening “ that we wish to hang.
         
     | 
| 
      
 81 
     | 
    
         
            +
                 */
         
     | 
| 
      
 82 
     | 
    
         
            +
                text-indent:-0.41em;
         
     | 
| 
      
 83 
     | 
    
         
            +
             
     | 
| 
      
 84 
     | 
    
         
            +
                p:last-of-type{
         
     | 
| 
      
 85 
     | 
    
         
            +
                    margin-bottom:0;
         
     | 
| 
      
 86 
     | 
    
         
            +
                }
         
     | 
| 
      
 87 
     | 
    
         
            +
            }
         
     | 
| 
      
 88 
     | 
    
         
            +
             
     | 
| 
      
 89 
     | 
    
         
            +
            .source{
         
     | 
| 
      
 90 
     | 
    
         
            +
                display:block;
         
     | 
| 
      
 91 
     | 
    
         
            +
                text-indent:0;
         
     | 
| 
      
 92 
     | 
    
         
            +
             
     | 
| 
      
 93 
     | 
    
         
            +
                &:before{
         
     | 
| 
      
 94 
     | 
    
         
            +
                    content:"—";
         
     | 
| 
      
 95 
     | 
    
         
            +
                }
         
     | 
| 
      
 96 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,13 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $SMALLPRINT
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * A series of classes for setting tiny type; for use in smallprint etc.
         
     | 
| 
      
 6 
     | 
    
         
            +
             */
         
     | 
| 
      
 7 
     | 
    
         
            +
            .smallprint,
         
     | 
| 
      
 8 
     | 
    
         
            +
            .milli{
         
     | 
| 
      
 9 
     | 
    
         
            +
                @include font-size($milli-size);
         
     | 
| 
      
 10 
     | 
    
         
            +
            }
         
     | 
| 
      
 11 
     | 
    
         
            +
            .micro{
         
     | 
| 
      
 12 
     | 
    
         
            +
                @include font-size($micro-size);
         
     | 
| 
      
 13 
     | 
    
         
            +
            }
         
     | 
| 
         @@ -0,0 +1,163 @@ 
     | 
|
| 
      
 1 
     | 
    
         
            +
            /*------------------------------------*\
         
     | 
| 
      
 2 
     | 
    
         
            +
                $TABLES
         
     | 
| 
      
 3 
     | 
    
         
            +
            \*------------------------------------*/
         
     | 
| 
      
 4 
     | 
    
         
            +
            /**
         
     | 
| 
      
 5 
     | 
    
         
            +
             * We have a lot at our disposal for making very complex table constructs, e.g.:
         
     | 
| 
      
 6 
     | 
    
         
            +
             *
         
     | 
| 
      
 7 
     | 
    
         
            +
               <table class="table--bordered  table--striped  table--data">
         
     | 
| 
      
 8 
     | 
    
         
            +
                   <colgroup>
         
     | 
| 
      
 9 
     | 
    
         
            +
                       <col class=t10>
         
     | 
| 
      
 10 
     | 
    
         
            +
                       <col class=t10>
         
     | 
| 
      
 11 
     | 
    
         
            +
                       <col class=t10>
         
     | 
| 
      
 12 
     | 
    
         
            +
                       <col>
         
     | 
| 
      
 13 
     | 
    
         
            +
                   </colgroup>
         
     | 
| 
      
 14 
     | 
    
         
            +
                   <thead>
         
     | 
| 
      
 15 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 16 
     | 
    
         
            +
                           <th colspan=3>Foo</th>
         
     | 
| 
      
 17 
     | 
    
         
            +
                           <th>Bar</th>
         
     | 
| 
      
 18 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 19 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 20 
     | 
    
         
            +
                           <th>Lorem</th>
         
     | 
| 
      
 21 
     | 
    
         
            +
                           <th>Ipsum</th>
         
     | 
| 
      
 22 
     | 
    
         
            +
                           <th class=numerical>Dolor</th>
         
     | 
| 
      
 23 
     | 
    
         
            +
                           <th>Sit</th>
         
     | 
| 
      
 24 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 25 
     | 
    
         
            +
                   </thead>
         
     | 
| 
      
 26 
     | 
    
         
            +
                   <tbody>
         
     | 
| 
      
 27 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 28 
     | 
    
         
            +
                           <th rowspan=3>Sit</th>
         
     | 
| 
      
 29 
     | 
    
         
            +
                           <td>Dolor</td>
         
     | 
| 
      
 30 
     | 
    
         
            +
                           <td class=numerical>03.788</td>
         
     | 
| 
      
 31 
     | 
    
         
            +
                           <td>Lorem</td>
         
     | 
| 
      
 32 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 33 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 34 
     | 
    
         
            +
                           <td>Dolor</td>
         
     | 
| 
      
 35 
     | 
    
         
            +
                           <td class=numerical>32.210</td>
         
     | 
| 
      
 36 
     | 
    
         
            +
                           <td>Lorem</td>
         
     | 
| 
      
 37 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 38 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 39 
     | 
    
         
            +
                           <td>Dolor</td>
         
     | 
| 
      
 40 
     | 
    
         
            +
                           <td class=numerical>47.797</td>
         
     | 
| 
      
 41 
     | 
    
         
            +
                           <td>Lorem</td>
         
     | 
| 
      
 42 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 43 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 44 
     | 
    
         
            +
                           <th rowspan=2>Sit</th>
         
     | 
| 
      
 45 
     | 
    
         
            +
                           <td>Dolor</td>
         
     | 
| 
      
 46 
     | 
    
         
            +
                           <td class=numerical>09.640</td>
         
     | 
| 
      
 47 
     | 
    
         
            +
                           <td>Lorem</td>
         
     | 
| 
      
 48 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 49 
     | 
    
         
            +
                       <tr>
         
     | 
| 
      
 50 
     | 
    
         
            +
                           <td>Dolor</td>
         
     | 
| 
      
 51 
     | 
    
         
            +
                           <td class=numerical>12.117</td>
         
     | 
| 
      
 52 
     | 
    
         
            +
                           <td>Lorem</td>
         
     | 
| 
      
 53 
     | 
    
         
            +
                       </tr>
         
     | 
| 
      
 54 
     | 
    
         
            +
                   </tbody>
         
     | 
| 
      
 55 
     | 
    
         
            +
               </table>
         
     | 
| 
      
 56 
     | 
    
         
            +
             *
         
     | 
| 
      
 57 
     | 
    
         
            +
             */
         
     | 
| 
      
 58 
     | 
    
         
            +
            table{
         
     | 
| 
      
 59 
     | 
    
         
            +
                width:100%;
         
     | 
| 
      
 60 
     | 
    
         
            +
            }
         
     | 
| 
      
 61 
     | 
    
         
            +
            th,
         
     | 
| 
      
 62 
     | 
    
         
            +
            td{
         
     | 
| 
      
 63 
     | 
    
         
            +
                padding:$base-spacing-unit / 4;
         
     | 
| 
      
 64 
     | 
    
         
            +
                @media screen and (min-width:480px){
         
     | 
| 
      
 65 
     | 
    
         
            +
                    padding:$half-spacing-unit;
         
     | 
| 
      
 66 
     | 
    
         
            +
                }
         
     | 
| 
      
 67 
     | 
    
         
            +
                text-align:left;
         
     | 
| 
      
 68 
     | 
    
         
            +
            }
         
     | 
| 
      
 69 
     | 
    
         
            +
             
     | 
| 
      
 70 
     | 
    
         
            +
             
     | 
| 
      
 71 
     | 
    
         
            +
            /**
         
     | 
| 
      
 72 
     | 
    
         
            +
             * Cell alignments
         
     | 
| 
      
 73 
     | 
    
         
            +
             */
         
     | 
| 
      
 74 
     | 
    
         
            +
            [colspan]{
         
     | 
| 
      
 75 
     | 
    
         
            +
                text-align:center;
         
     | 
| 
      
 76 
     | 
    
         
            +
            }
         
     | 
| 
      
 77 
     | 
    
         
            +
            [colspan="1"]{
         
     | 
| 
      
 78 
     | 
    
         
            +
                text-align:left;
         
     | 
| 
      
 79 
     | 
    
         
            +
            }
         
     | 
| 
      
 80 
     | 
    
         
            +
            [rowspan]{
         
     | 
| 
      
 81 
     | 
    
         
            +
                vertical-align:middle;
         
     | 
| 
      
 82 
     | 
    
         
            +
            }
         
     | 
| 
      
 83 
     | 
    
         
            +
            [rowspan="1"]{
         
     | 
| 
      
 84 
     | 
    
         
            +
                vertical-align:top;
         
     | 
| 
      
 85 
     | 
    
         
            +
            }
         
     | 
| 
      
 86 
     | 
    
         
            +
            .numerical{
         
     | 
| 
      
 87 
     | 
    
         
            +
                text-align:right;
         
     | 
| 
      
 88 
     | 
    
         
            +
            }
         
     | 
| 
      
 89 
     | 
    
         
            +
             
     | 
| 
      
 90 
     | 
    
         
            +
            /**
         
     | 
| 
      
 91 
     | 
    
         
            +
             * In the HTML above we see several `col` elements with classes whose numbers
         
     | 
| 
      
 92 
     | 
    
         
            +
             * represent a percentage width for that column. We leave one column free of a
         
     | 
| 
      
 93 
     | 
    
         
            +
             * class so that column can soak up the effects of any accidental breakage in
         
     | 
| 
      
 94 
     | 
    
         
            +
             * the table.
         
     | 
| 
      
 95 
     | 
    
         
            +
             */
         
     | 
| 
      
 96 
     | 
    
         
            +
            .t5     { width: 5% }
         
     | 
| 
      
 97 
     | 
    
         
            +
            .t10    { width:10% }
         
     | 
| 
      
 98 
     | 
    
         
            +
            .t12    { width:12.5% }     /* 1/8 */
         
     | 
| 
      
 99 
     | 
    
         
            +
            .t15    { width:15% }
         
     | 
| 
      
 100 
     | 
    
         
            +
            .t20    { width:20% }
         
     | 
| 
      
 101 
     | 
    
         
            +
            .t25    { width:25% }       /* 1/4 */
         
     | 
| 
      
 102 
     | 
    
         
            +
            .t30    { width:30% }
         
     | 
| 
      
 103 
     | 
    
         
            +
            .t33    { width:33.333% }   /* 1/3 */
         
     | 
| 
      
 104 
     | 
    
         
            +
            .t35    { width:35% }
         
     | 
| 
      
 105 
     | 
    
         
            +
            .t37    { width:37.5% }     /* 3/8 */
         
     | 
| 
      
 106 
     | 
    
         
            +
            .t40    { width:40% }
         
     | 
| 
      
 107 
     | 
    
         
            +
            .t45    { width:45% }
         
     | 
| 
      
 108 
     | 
    
         
            +
            .t50    { width:50% }       /* 1/2 */
         
     | 
| 
      
 109 
     | 
    
         
            +
            .t55    { width:55% }
         
     | 
| 
      
 110 
     | 
    
         
            +
            .t60    { width:60% }
         
     | 
| 
      
 111 
     | 
    
         
            +
            .t62    { width:62.5% }     /* 5/8 */
         
     | 
| 
      
 112 
     | 
    
         
            +
            .t65    { width:65% }
         
     | 
| 
      
 113 
     | 
    
         
            +
            .t66    { width:66.666% }   /* 2/3 */
         
     | 
| 
      
 114 
     | 
    
         
            +
            .t70    { width:70% }
         
     | 
| 
      
 115 
     | 
    
         
            +
            .t75    { width:75% }       /* 3/4*/
         
     | 
| 
      
 116 
     | 
    
         
            +
            .t80    { width:80% }
         
     | 
| 
      
 117 
     | 
    
         
            +
            .t85    { width:85% }
         
     | 
| 
      
 118 
     | 
    
         
            +
            .t87    { width:87.5% }     /* 7/8 */
         
     | 
| 
      
 119 
     | 
    
         
            +
            .t90    { width:90% }
         
     | 
| 
      
 120 
     | 
    
         
            +
            .t95    { width:95% }
         
     | 
| 
      
 121 
     | 
    
         
            +
             
     | 
| 
      
 122 
     | 
    
         
            +
             
     | 
| 
      
 123 
     | 
    
         
            +
            /**
         
     | 
| 
      
 124 
     | 
    
         
            +
             * Bordered tables
         
     | 
| 
      
 125 
     | 
    
         
            +
             */
         
     | 
| 
      
 126 
     | 
    
         
            +
            .table--bordered{
         
     | 
| 
      
 127 
     | 
    
         
            +
             
     | 
| 
      
 128 
     | 
    
         
            +
                th,
         
     | 
| 
      
 129 
     | 
    
         
            +
                td{
         
     | 
| 
      
 130 
     | 
    
         
            +
                    border:1px solid #ccc; /* Override this color in your theme stylesheet */
         
     | 
| 
      
 131 
     | 
    
         
            +
             
     | 
| 
      
 132 
     | 
    
         
            +
                    &:empty{
         
     | 
| 
      
 133 
     | 
    
         
            +
                        border:none;
         
     | 
| 
      
 134 
     | 
    
         
            +
                    }
         
     | 
| 
      
 135 
     | 
    
         
            +
                }
         
     | 
| 
      
 136 
     | 
    
         
            +
             
     | 
| 
      
 137 
     | 
    
         
            +
                thead tr:last-child th{
         
     | 
| 
      
 138 
     | 
    
         
            +
                    border-bottom-width:2px;
         
     | 
| 
      
 139 
     | 
    
         
            +
                }
         
     | 
| 
      
 140 
     | 
    
         
            +
             
     | 
| 
      
 141 
     | 
    
         
            +
                tbody tr th:last-of-type{
         
     | 
| 
      
 142 
     | 
    
         
            +
                    border-right-width:2px;
         
     | 
| 
      
 143 
     | 
    
         
            +
                }
         
     | 
| 
      
 144 
     | 
    
         
            +
            }
         
     | 
| 
      
 145 
     | 
    
         
            +
             
     | 
| 
      
 146 
     | 
    
         
            +
             
     | 
| 
      
 147 
     | 
    
         
            +
            /**
         
     | 
| 
      
 148 
     | 
    
         
            +
             * Striped tables
         
     | 
| 
      
 149 
     | 
    
         
            +
             */
         
     | 
| 
      
 150 
     | 
    
         
            +
            .table--striped{
         
     | 
| 
      
 151 
     | 
    
         
            +
             
     | 
| 
      
 152 
     | 
    
         
            +
                tbody tr:nth-of-type(odd){
         
     | 
| 
      
 153 
     | 
    
         
            +
                    background-color:#ffc; /* Override this color in your theme stylesheet */
         
     | 
| 
      
 154 
     | 
    
         
            +
                }
         
     | 
| 
      
 155 
     | 
    
         
            +
            }
         
     | 
| 
      
 156 
     | 
    
         
            +
             
     | 
| 
      
 157 
     | 
    
         
            +
             
     | 
| 
      
 158 
     | 
    
         
            +
            /**
         
     | 
| 
      
 159 
     | 
    
         
            +
             * Data table
         
     | 
| 
      
 160 
     | 
    
         
            +
             */
         
     | 
| 
      
 161 
     | 
    
         
            +
            .table--data{
         
     | 
| 
      
 162 
     | 
    
         
            +
                font:12px/1.5 sans-serif;
         
     | 
| 
      
 163 
     | 
    
         
            +
            }
         
     |