rapido-css 0.0.1 → 0.0.2.1

data/stylesheets/components/_tables.scss

@@ -1,21 +1,18 @@
-//
-// Tables
-// --------------------------------------------------
+// ====================================================================================================================
+// TABLES
+// ====================================================================================================================
 
 @if $tables {
 
-	// BASE TABLES
-	// -----------------
-
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Base
+// --------------------------------------------------------------------------------------------------------------------
 	table {
 		max-width: 100%;
 		border-collapse: collapse;
 		border-spacing: 0;
 	}
 
-	// BASELINE STYLES
-	// ---------------
-
 	.table {
 		width: 100%;
 		margin-bottom: rhythm(1);
@@ -46,19 +43,20 @@
 
 	}
 
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Condensed Table w/ Half Padding
+// --------------------------------------------------------------------------------------------------------------------
+	.table--condensed {
+		$half-top: nth($tables-padding, 1) / 2;
+		$half-side: nth($tables-padding, 2) / 2;
 
-
-	// CONDENSED TABLE W/ HALF PADDING
-	// -------------------------------
-	.table-condensed {
-		th,
-		td { padding: em(4px) em(5px); }
+		th, td { padding: $half-top $half-side; }
 	}
 
-	// ZEBRA-STRIPING
-	// --------------
-	.table-striped {
-		@extend .table;
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Zebra-striping
+// --------------------------------------------------------------------------------------------------------------------
+	.table--striped {
 		tbody {
 			> tr:nth-child(odd) > td,
 			> tr:nth-child(odd) > th {
@@ -67,19 +65,19 @@
 		}
 	}
 
-
-	// BORDERED VERSION
-	// ----------------
-
-	.table-bordered {
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Bordered Version
+// --------------------------------------------------------------------------------------------------------------------
+	.table--bordered {
 		@extend .table;
 		@extend %table-bordered !optional;
 	}
 
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Hover effect
+// --------------------------------------------------------------------------------------------------------------------
 
-	// HOVER EFFECT
-	// ------------
-	.table-hover {
+	.table--hover {
 		@extend .table;
 		tbody {
 			tr:hover > td,
@@ -89,10 +87,10 @@
 		}
 	}
 
-	// STUPID TABLE
-	// ---------------
-	.table-sortable {
-		@extend .table;
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Sortable w/ StupidTable (https://github.com/joequery/Stupid-Table-Plugin)
+// --------------------------------------------------------------------------------------------------------------------
+	.table--sortable {
 		@extend %table-sortable !optional;
 
 		thead {

data/stylesheets/components/_tabs.scss

@@ -1,3 +1,7 @@
+// ====================================================================================================================
+// TABS w/ EasyTabs (https://github.com/JangoSteve/jQuery-EasyTabs)
+// ====================================================================================================================
+
 @if $tabs {
 
 	.tab-container {

data/stylesheets/components/_type.scss

@@ -1,15 +1,21 @@
-// Scaffolding
-// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// ====================================================================================================================
+// SCAFFOLDING
+// ====================================================================================================================
+
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Base
+// --------------------------------------------------------------------------------------------------------------------
+
 *, *:before, *:after {@include box-sizing(border-box); outline: none;}
 
 html {
 	@if $responsive-font-size {
 
-	    @each $step in $responsive-font-size {
-	    	@include media(nth($step, 1)) {
-	    		font-size: 100% * nth($step, 2) / 16px;
-	    	}
-	    }
+		@each $step in $responsive-font-size {
+			@include media(nth($step, 1)) {
+				font-size: 100% * nth($step, 2) / 16px;
+			}
+		}
 
 	} @else {
 		font-size: 100% * $base-font-size / 16px;
@@ -28,9 +34,9 @@ img {max-width: 100%;}
 
 a, button, textarea, input { outline: none; }
 
-
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // Links
-// -------------------------
+// --------------------------------------------------------------------------------------------------------------------
 a {
 	color: $link-color;
 	text-decoration: none;
@@ -42,37 +48,39 @@ a:focus {
 }
 
 
-
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // Body text
-// -------------------------
+// --------------------------------------------------------------------------------------------------------------------
 
-p {
-	margin: 0 0 rhythm(1);
-}
+p 					{ margin: 0 0 rhythm(1);}
 
-.lead { @include adjust-font-size-to($h4-size); }
+.lead 				{ @include adjust-font-size-to($h4-size); }
 
-.muted { color: $gray;}
+.muted 				{ color: $gray; }
 
-.pull-left {float: left;}
-.pull-right {float: right;}
-.clearfix { @include clearfix;}
+.pull-left 			{ float: left; }
+.pull-right 		{ float: right; }
+.clearfix 			{ @include clearfix; }
 
+
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // Emphasis & misc
-// -------------------------
-small   { @include adjust-font-size-to($milli-size); }
+// --------------------------------------------------------------------------------------------------------------------
+
+small   			{ @include adjust-font-size-to($milli-size); }
 
-strong  { font-weight: bold; }
-em      { font-style: italic; }
-cite    { font-style: normal; }
+strong  			{ font-weight: bold; }
+em      			{ font-style: italic; }
+cite    			{ font-style: normal; }
 
-.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; }
 
 
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // Headings
-// -------------------------
+// --------------------------------------------------------------------------------------------------------------------
 
 h1,
 h2,
@@ -80,13 +88,13 @@ h3,
 h4,
 h5,
 h6 {
-	margin: 0 0 1em;
+	margin: 0 0 rhythm();
 	text-rendering: optimizelegibility;
 	@if $titles-font-family { font-family: $titles-font-family; }
 
 	small {
 		font-weight: normal;
-		line-height: 1;
+		line-height: rhythm();
 		color: $grayLight;
 	}
 }
@@ -128,8 +136,10 @@ h2 small { @include adjust-font-size-to($h4-size); }
 h3 small { @include adjust-font-size-to($h5-size); }
 h4 small { @include adjust-font-size-to($h6-size); }
 
+
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // Lists
-// --------------------------------------------------
+// --------------------------------------------------------------------------------------------------------------------
 
 .list_style_none, .list-style-none {
 	padding-left: 0;
@@ -138,6 +148,7 @@ h4 small { @include adjust-font-size-to($h6-size); }
 }
 
 // Unordered and Ordered lists
+// --------------------------------------------------------------------------------------------------------------------
 ul, ol {
 	padding: 0;
 	margin: 0 0 rhythm(1) 25px;
@@ -161,14 +172,14 @@ ol.inline {
 	margin-left: 0;
 	list-style: none;
 	> li {
-    	@include inline-block();
-    	padding-left: 5px;
-    	padding-right: 5px;
+		@include inline-block();
+		padding-left: 5px;
+		padding-right: 5px;
 	}
 }
 
 // Description lists
-
+// --------------------------------------------------------------------------------------------------------------------
 dl { margin-bottom: rhythm(1); }
 dt,
 dd { line-height: rhythm(1); }
@@ -179,18 +190,19 @@ dd { margin-left: rhythm(.5); }
 .dl-horizontal {
   @extend .clearfix;
   dt {
-  	float: left;
-  	width: em($horizontal-offset) - 20;
-  	clear: left;
-  	text-align: right;
-  	@include text-overflow();
+	float: left;
+	width: em($horizontal-offset) - 20;
+	clear: left;
+	text-align: right;
+	@include text-overflow();
   }
 
   dd { margin-left: em($horizontal-offset); }
 }
 
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // MISC
-// ----
+// --------------------------------------------------------------------------------------------------------------------
 
 hr {
 	margin: rhythm(1) 0;
@@ -199,6 +211,7 @@ hr {
 }
 
 // Abbreviations and acronyms
+// --------------------------------------------------------------------------------------------------------------------
 abbr[title],
 abbr[data-original-title] {
 	cursor: help;
@@ -210,6 +223,7 @@ abbr.initialism {
 }
 
 // Blockquotes
+// --------------------------------------------------------------------------------------------------------------------
 blockquote {
 	padding: 0 0 0 rhythm(1);
 	margin: 0;
@@ -218,7 +232,7 @@ blockquote {
 
 	p {
 		margin-bottom: 0;
-    	font-weight: 300;
+		font-weight: 300;
 	}
 
 	small {
@@ -229,27 +243,28 @@ blockquote {
 		}
 	}
 
-  // Float right with text-align: right
-  &.pull-right {
-  	float: right;
-  	padding-right: 15px;
-  	padding-left: 0;
-  	border-right: 5px solid $grayLighter;
-  	border-left: 0;
-
-  	p,
-  	small {
-  		text-align: right;
-  	}
-
-  	small {
-  		&:before { content: ''; }
-  		&:after { content: '\00A0 \2014'; }
-  	}
-  }
+	&.pull-right {
+		float: right;
+		padding-right: 15px;
+		padding-left: 0;
+		border-right: 5px solid $grayLighter;
+		border-left: 0;
+
+		p,
+		small {
+			text-align: right;
+		}
+
+		small {
+			&:before { content: ''; }
+			&:after { content: '\00A0 \2014'; }
+		}
+	}
 }
 
 // Quotes
+// --------------------------------------------------------------------------------------------------------------------
+
 q:before,
 q:after,
 blockquote:before,
@@ -258,6 +273,7 @@ blockquote:after {
 }
 
 // Addresses
+// --------------------------------------------------------------------------------------------------------------------
 address {
 	display: block;
 	margin-bottom: rhythm(1);

data/stylesheets/settings/_base.scss

@@ -1,22 +1,29 @@
+// ====================================================================================================================
+// BASE Settings
+// ====================================================================================================================
+
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Debug Mode
+// --------------------------------------------------------------------------------------------------------------------
 
-// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
-// DEBUG MODE
-// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 $debug-mode:        								false 												!default;
 $default-styles: 									true 												!default;
 
-// FONTS
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Text body size
 // --------------------------------------------------------------------------------------------------------------------
+
 $base-font-size:    								14px 												!default;
 $base-line-height:  								20px 												!default;
 $round-to-nearest-half-line: 						true 												!default;
 
-// Cambia dimension dispositivi
-// --------------------------------------------------------------------------------------------------------------------
+// Change text size with media query
 $responsive-font-size:    							lap-and-up $base-font-size, palm 16px				!default;
 
-// Font-families di default
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Font families
 // --------------------------------------------------------------------------------------------------------------------
+
 $font-sans:        									"Helvetica Neue", Helvetica, Arial, sans-serif 		!default;
 $font-serif:       									Georgia, "Times New Roman", Times, serif 			!default;
 $font-mono:        									Monaco, Menlo, Consolas, "Courier New", monospace 	!default;
@@ -24,9 +31,9 @@ $font-mono:        									Monaco, Menlo, Consolas, "Courier New", monospace 	!
 $base-font-family:  								$font-sans 											!default;
 $titles-font-family:  								''		 											!default;
 
-// Calcolo EM
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
+// Convert to Ems
 // --------------------------------------------------------------------------------------------------------------------
 @function em($to-size, $from-size: $base-font-size) {
 	@return ($to-size / $from-size) + 0em;
-}
-
+}

data/stylesheets/settings/_colors.scss

@@ -1,7 +1,7 @@
+// ====================================================================================================================
+// BASE COLORS
+// ====================================================================================================================
 
-// ********************************************************************************************************************
-// COLORI BASE
-// ********************************************************************************************************************
 $black:                 							#000;
 $grayDarker:            							lighten($black, 15);
 $grayDark:              							lighten($black, 30);
@@ -11,6 +11,6 @@ $grayLighter:           							lighten($black, 95);
 $white:                 							lighten($black, 100);
 
 $text-color:         								#333 												!default;
-			
+
 $link-color: 										#0066cc 											!default;
 $link-color-hover: 									darken($link-color, 10%) 							!default;

data/stylesheets/settings/_components.scss

@@ -1,7 +1,6 @@
-
-// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
-// Enable Components
-// --------------------------------------------------------------------------------------------------------------------
+// ====================================================================================================================
+// ENABLE COMPONENTS
+// ====================================================================================================================
 
 $alerts: 							true 		!default;
 $breadcrumbs: 						true 		!default;
@@ -13,15 +12,15 @@ $dropdowns: 						true 		!default;
 
 $forms: 							true 		!default;
 	$forms-append:					true 		!default;
-	$forms-inline: 					true 		!default;
-	$forms-horizontal:				true 		!default;
+	$forms-inline:					true 		!default;
+	$forms-aligned:					true 		!default;
 	$forms-columns: 				true 		!default;
 
 $modals: 							true 		!default;
 $navs: 								true 		!default;
 $pager: 							true 		!default;
 $pagination: 						true 		!default;
-$pills: 							true 		!default;
+$labels: 							true 		!default;
 $responsive-navs: 					true 		!default;
 $tables: 							true 		!default;
 
@@ -31,7 +30,7 @@ $modal: 							true 		!default;
 	$modal-buttons: 				true 		!default;
 	$modal-thumbs: 					true 		!default;
 
-
+// ––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––––
 // Icon Fonts
 // --------------------------------------------------------------------------------------------------------------------
 $use-fontawesome: 					true 		!default;