helpers em scss

helpers.scss

/*= @group NON-SEMANTIC HELPERS
 ---------------------------------------------------------------------- */

    // For image replacement
    .ir { border: 0; font: 0; text-shadow: none; color: transparent !important; background-color: transparent; }

    //Hide only visually, but have it available for screenreaders: by Jon Neal. www.webaim.org/techniques/css/invisiblecontent/ & j.mp/visuallyhidden
    .visuallyhidden {
        border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;

        // Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: drupal.org/node/897638
        &.focusable:active, &.focusable:focus {
            clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto;
        }
    }

    // Contain floats: h5bp.com/q
    .clearfix, [class^="l-"] {
      &:before, &:after { content: ""; display: table; }
      &:after { clear: both; }
      *zoom: 1;
    }

    // floats
    .pull-left { float: left; }
    .pull-right { float: right; }

    // for icons
    [class^="icon-"] {
        @extend .ir;
        @include inline-block(middle); // mixin externo
    }