2.2.2 -> 2.3.0

[bootswatch] / spacelab / variables.less

diff --git a/spacelab/variables.less b/spacelab/variables.less
index b9075b2..1576942 100755 (executable)
--- a/spacelab/variables.less
+++ b/spacelab/variables.less
@@ -1,7 +1,5 @@
-//
+// Spacelab 2.3.0
 // Variables
-// Swatch: Spacelab
-// Version: 2.1.0
 // --------------------------------------------------
 
 
@@ -13,8 +11,8 @@
 // -------------------------
 @black:                 #000;
 @grayDarker:            #2D2D2D;
-@grayDark:              #333;
-@gray:                  #777;
+@grayDark:              #434848;
+@gray:                  #666;
 @grayLight:             #bbb;
 @grayLighter:           #eee;
 @white:                 #fff;
@@ -24,7 +22,7 @@
 // -------------------------
 @blue:                  #3399F3;
 @blueDark:              #405A6A;
-@green:                 #819E37;
+@green:                 #3CB521;
 @red:                   #CD0200;
 @yellow:                #F4CA00;
 @orange:                #D47500;
@@ -35,29 +33,46 @@
 // Scaffolding
 // -------------------------
 @bodyBackground:        @white;
-@textColor:             @grayDarker;
+@textColor:             @gray;
 
 
 // Links
 // -------------------------
-@linkColor:             #558BC4;
+@linkColor:             #09d;
 @linkColorHover:        @linkColor;
 
 
 // Typography
 // -------------------------
-@sansFontFamily:        "Muli", "Helvetica Neue", Helvetica, Arial, sans-serif;
+@sansFontFamily:        "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
 @serifFontFamily:       Georgia, "Times New Roman", Times, serif;
 @monoFontFamily:        Menlo, Monaco, Consolas, "Courier New", monospace;
 
-@baseFontSize:          14px;
+@baseFontSize:          15px;
 @baseFontFamily:        @sansFontFamily;
 @baseLineHeight:        21px;
 @altFontFamily:         @serifFontFamily;
 
 @headingsFontFamily:    inherit; // empty to use BS default, @baseFontFamily
 @headingsFontWeight:    normal;    // instead of browser default, bold
-@headingsColor:         inherit; // empty to use BS default, @textColor
+@headingsColor:         @grayDarker; // empty to use BS default, @textColor
+
+
+// Component sizing
+// -------------------------
+// Based on 14px font-size and 20px line-height
+
+@fontSizeLarge:         @baseFontSize * 1.25; // ~18px
+@fontSizeSmall:         @baseFontSize * 0.85; // ~12px
+@fontSizeMini:          @baseFontSize * 0.75; // ~11px
+
+@paddingLarge:          11px 19px; // 44px
+@paddingSmall:          2px 10px;  // 26px
+@paddingMini:           0px 6px;   // 22px
+
+@baseBorderRadius:      4px;
+@borderRadiusLarge:     6px;
+@borderRadiusSmall:     3px;
 
 
 // Tables
@@ -67,26 +82,25 @@
 @tableBackgroundHover:              #f5f5f5; // for hover
 @tableBorder:                       #ddd; // table and cell border
 
-
 // Buttons
 // -------------------------
 @btnBackground:                     @white;
 @btnBackgroundHighlight:            @grayLighter;
 @btnBorder:                         darken(@btnBackground, 20%);
 
-@btnPrimaryBackground:              lighten(@linkColor, 15%);
+@btnPrimaryBackground:              lighten(@linkColor, 10%);
 @btnPrimaryBackgroundHighlight:     @linkColor;
 
-@btnInfoBackground:                 lighten(@grayLight, 15%);
-@btnInfoBackgroundHighlight:        @grayLight;
+@btnInfoBackground:                 lighten(#3A5D83, 10%);
+@btnInfoBackgroundHighlight:        #3A5D83;
 
-@btnSuccessBackground:              lighten(@green, 15%);
+@btnSuccessBackground:              lighten(@green, 10%);
 @btnSuccessBackgroundHighlight:     @green;
 
-@btnWarningBackground:              lighten(@orange, 15%);
+@btnWarningBackground:              lighten(@orange, 10%);
 @btnWarningBackgroundHighlight:     @orange;
 
-@btnDangerBackground:               lighten(@red, 15%);
+@btnDangerBackground:               lighten(@red, 10%);
 @btnDangerBackgroundHighlight:      @red;
 
 @btnInverseBackground:              lighten(@navbarInverseBackground, 15%);
@@ -97,9 +111,11 @@
 // -------------------------
 @inputBackground:               @white;
 @inputBorder:                   #ccc;
-@inputBorderRadius:             3px;
+@inputBorderRadius:             @baseBorderRadius;
 @inputDisabledBackground:       @grayLighter;
 @formActionsBackground:         #f5f5f5;
+@inputHeight:                   @baseLineHeight + 10px; // base line-height + 8px vertical padding + 2px top/bottom border
+
 
 // Dropdowns
 // -------------------------
@@ -109,18 +125,18 @@
 @dropdownDividerBottom:         @white;
 
 @dropdownLinkColor:             @textColor;
-
 @dropdownLinkColorHover:        @white;
-@dropdownLinkBackgroundHover:   @dropdownLinkBackgroundActive;
+@dropdownLinkColorActive:       @white;
 
-@dropdownLinkColorActive:       @dropdownLinkColor;
 @dropdownLinkBackgroundActive:  @linkColor;
+@dropdownLinkBackgroundHover:   @dropdownLinkBackgroundActive;
 
 
 
 // COMPONENT VARIABLES
 // --------------------------------------------------
 
+
 // Z-index master list
 // -------------------------
 // Used for a bird's eye view of components dependent on the z-axis
@@ -149,28 +165,34 @@
 @hrBorder:                @grayLighter;
 
 
+// Horizontal forms & lists
+// -------------------------
+@horizontalComponentOffset:       180px;
+
+
 // Wells
 // -------------------------
-@wellBackground:                  #f5f5f5;
+@wellBackground:                  @grayLighter;
 
 
 // Navbar
 // -------------------------
 @navbarCollapseWidth:             979px;
+@navbarCollapseDesktopWidth:      @navbarCollapseWidth + 1;
 
 @navbarHeight:                    40px;
-@navbarBackground:                @grayLight;
-@navbarBackgroundHighlight:       #eee;
-@navbarBorder:                    darken(@navbarBackground, 5%);
+@navbarBackgroundHighlight:       @grayLighter;
+@navbarBackground:                lighten(@grayLight, 5%);
+@navbarBorder:                    @grayLight;
 
 @navbarText:                      @textColor;
 @navbarLinkColor:                 @textColor;
-@navbarLinkColorHover:            @linkColor;
-@navbarLinkColorActive:           @textColor;
+@navbarLinkColorHover:            @black;
+@navbarLinkColorActive:           @black;
 @navbarLinkBackgroundHover:       transparent;
 @navbarLinkBackgroundActive:      transparent;
 
-@navbarBrandColor:                @grayDark;
+@navbarBrandColor:                @navbarLinkColor;
 
 // Inverted navbar
 @navbarInverseBackground:                #6C737E;
@@ -202,7 +224,7 @@
 // Hero unit
 // -------------------------
 @heroUnitBackground:              @grayLighter;
-@heroUnitHeadingColor:            inherit;
+@heroUnitHeadingColor:            @headingsColor;
 @heroUnitLeadColor:               inherit;