stylesheets/utilities/_helper-classes.scss in rapido-css-0.1.1 vs stylesheets/utilities/_helper-classes.scss in rapido-css-0.1.2

@@ -1,45 +1,45 @@
-/* ====================================================================================================================
+/*
 
 Helper Classes
 
 There are provided some helper classes usually used with `@extend` for applying effects or common styles.
 
-Styleguide 22.
+Styleguide 22
 
-==================================================================================================================== */
+*/
 
-/* --------------------------------------------------------------------------------------------------------------------
+/*
 
 Generic
 
 Add a a simple `transition all`, used as a generic extend for element that can accept transition on all attributes.
     .transition
 Simple divider class used in some components (like dropdowns).␣␣
     .divider
 
 Styleguide 22.1
 
--------------------------------------------------------------------------------------------------------------------- */
+*/
 
 .clearfix {
-	&:after {
-		content: "";
-		display: table;
-		clear: both;
-	}
+    &:after {
+        content: "";
+        display: table;
+        clear: both;
+    }
 }
 
 .transition {
-	@include transition();
+    @include transition();
 }
 
 .divider {
-	@include nav-divider();
+    @include nav-divider();
 }
 
-/* --------------------------------------------------------------------------------------------------------------------
+/*
 
 Wrappers
 
 Flexible wrapper to center the layout, max-width width `$desk-end`.
 
@@ -51,32 +51,32 @@
     .fixed-wrapper
     .fw
 
 Styleguide 22.2
 
--------------------------------------------------------------------------------------------------------------------- */
+*/
 
 .wrapper, .w {
-	@extend .clearfix;
-	margin: 0 auto;
-	max-width: $desk-end;
-	padding-left: $wrapper-padding;
-	padding-right: $wrapper-padding;
+    @extend .clearfix;
+    margin: 0 auto;
+    max-width: $desk-end;
+    padding-left: $wrapper-padding;
+    padding-right: $wrapper-padding;
 }
 
 .fixed-wrapper, .fw {
-	@extend .clearfix;
-	margin: 0 auto;
-	width: $desk-end;
+    @extend .clearfix;
+    margin: 0 auto;
+    width: $desk-end;
 }
 
 
 .left {float: left;}
 .right {float: right;}
 
 
-/* --------------------------------------------------------------------------------------------------------------------
+/*
 
 Elements width
 
 Add `data-width="n"` to any html element to set the width.
 
@@ -84,69 +84,85 @@
 
 * **n**: Width in percentage in increments of 5 of the element.
 
 Example:
 
-	data-width="50"
+    data-width="50"
 
 Corrispond to:
 
-	width: 50% !important;
+    width: 50% !important;
 
 Styleguide 22.3
 
--------------------------------------------------------------------------------------------------------------------- */
+*/
 
 $i: 100;
 @while $i > 0 {
-	%width-#{$i} { width: $i * 1% !important; }
-	@if $width-helper-classes {
-		[data-width="#{$i}"] { @extend %width-#{$i}; }
-	}
-	$i: $i - 1;
+    %width-#{$i} { width: $i * 1% !important; }
+    @if $width-helper-classes {
+        [data-width="#{$i}"] { @extend %width-#{$i}; }
+    }
+    $i: $i - 1;
 }
 
-/* --------------------------------------------------------------------------------------------------------------------
+/*
 
 Typography
 
+Some common classes for fixing the typography, to be used sparingly.
+
+    .lead           # Bigger font size
+    .muted          # color: $gray
+
+    .pull-left      # float: left
+    .pull-right     # float: right
+
+    .text-left      # text-align: left
+    .text-right     # text-align: right
+    .text-center    # text-align: center
+
 Styleguide 22.4
 
--------------------------------------------------------------------------------------------------------------------- */
+*/
 
-.lead			{ @include adjust-font-size-to($h4-size); }
-.muted			{ color: $gray; }
+.lead           { @include adjust-font-size-to($h4-size); }
+.muted          { color: $gray; }
 
-.pull-left		{ float: left; }
-.pull-right		{ float: right; }
+.pull-left      { float: left; }
+.pull-right     { float: right; }
 
-.text-left		{ text-align: left; }
-.text-right		{ text-align: right; }
-.text-center	{ text-align: center; }
+.text-left      { text-align: left; }
+.text-right     { text-align: right; }
+.text-center    { text-align: center; }
 
-/* --------------------------------------------------------------------------------------------------------------------
+/*
 
 Sprites
 
+Simple class used for spriting.
+
+    .s
+
 Styleguide 22.5
 
--------------------------------------------------------------------------------------------------------------------- */
+*/
 
 .s {
-	@include transition(none);
-	content: "";
-	display: inline-block;
-	font-style:normal;
-	overflow:hidden;
-	text-align:center;
-	text-indent:-9999px;
-	vertical-align:middle;
-	zoom:1;
+    @include transition(none);
+    content: "";
+    display: inline-block;
+    font-style:normal;
+    overflow:hidden;
+    text-align:center;
+    text-indent:-9999px;
+    vertical-align:middle;
+    zoom:1;
 
 }
 
-/* --------------------------------------------------------------------------------------------------------------------
+/*
 
 Text replacement
 
 All the text replacement classes from from [html5boilerplate](http://html5boilerplate.com/).
 
@@ -157,13 +173,13 @@
     .visuallyhidden
     .invisible
 
 Styleguide 22.6
 
--------------------------------------------------------------------------------------------------------------------- */
+*/
 
 .ir{background-color:transparent;border:0;overflow:hidden;text-indent:-9999px;line-height:0;font-size:0;}
 .ir:before{content:"";display:block;width:0;height:150%}
 .hidden{display:none!important;visibility:hidden}
 .visuallyhidden{border:0;clip:rect(0000);height:1px;overflow:hidden;position:absolute;width:1px;margin:-1px;padding:0}
 .visuallyhidden.focusable:active,.visuallyhidden.focusable:focus{clip:auto;height:auto;overflow:visible;position:static;width:auto;margin:0}
-.invisible{visibility:hidden}
\ No newline at end of file
+.invisible{visibility:hidden}