assets/css/bs3/less/base/variables.less
// Variables.less
// Variables to customize the look and feel of Bootstrap
// -----------------------------------------------------



// GLOBAL VALUES
// --------------------------------------------------


// Grays
// -------------------------
@black:                 #000;
@grayDarker:            #222;
@grayDark:              #333;
@gray:                  #555;
@grayLight:             #999;
@grayLighter:           #eee;
@white:                 #fff;


@brandPrimary:         #428bca;
@brandSuccess:         #5cb85c;
@brandInfo:            #5bc0de;
@brandWarning:         #f0ad4e;
@brandDanger:          #d9534f;
@brandInverse:         @grayDarker;


// Accent colors
// -------------------------
@blue:                  #049cdb;
@blueDark:              #0064cd;
@blueLight:             #e0e6fc;
@green:                 #46a546;
@red:                   #9d261d;
@yellow:                #ffc40d;
@orange:                #f89406;
@pink:                  #c3325f;
@purple:                #7a43b6;


// Scaffolding
// -------------------------
@bodyBackground:        @white;     //
@textColor:             @grayDark;
@disabledColor:         #ccc; 
@borderColor:           #c3c3d6;
@backColor:             #E8E9EF;


@selectedBackground:    #ccd7ff;
@selectedBorderColr:    #99afff;

@hoverBackground:       #dee5ff;
@hoverBorderColor:      @selectedBackground;


// Links
// -------------------------
@linkColor:             @brandPrimary;
@linkColorHover:        darken(@linkColor, 15%);


// Typography
// -------------------------
@baseFontSize:          12px;
@baseFontFamily:        "ff-tisa-web-pro-1","ff-tisa-web-pro-2","Lucida Grande","Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Hiragino Sans GB W3","WenQuanYi Micro Hei",sans-serif;
@altFontFamily:         @baseFontFamily;
@numberFontFamily:      "Tahoma","SimSun";

//** Unit-less `line-height` for use in components like buttons.
@baseLineHeight:        20px; // 20/14
//** Computed "line-height" (`font-size` * `line-height`) for use with `margin`, `padding`, etc.
@computedLineHeight:    20px; //floor((@baseFontSize * @baseLineHeight)); // ~20px

@headingsFontFamily:    "ff-tisa-web-pro-1","ff-tisa-web-pro-2","Lucida Grande","Helvetica Neue",Helvetica,Arial,"Hiragino Sans GB","Hiragino Sans GB W3","Microsoft YaHei UI","Microsoft YaHei","WenQuanYi Micro Hei",sans-serif;
@headingsFontWeight:    500;    // instead of browser default, 500
@headingsColor:         inherit; // empty to use BS default, @textColor

//字体大小的字义
@fontSizeBase:          @baseFontSize;
@fontSizeLarge:         18px;  //ceil((@baseFontSize * 1.25)); // ~18px
@fontSizeSmall:         12px;  //ceil((@baseFontSize * 0.85)); // ~12px

@font-size-h1:          24px;  //floor((@baseFontSize * 2.6)); // ~36px
@font-size-h2:          18px;  //floor((@baseFontSize * 2.15)); // ~30px
@font-size-h3:          16px;  //ceil((@baseFontSize * 1.7)); // ~24px
@font-size-h4:          14px;  //ceil((@baseFontSize * 1.25)); // ~18px
@font-size-h5:          12px;  //@baseFontSize;
@font-size-h6:          12px;  //ceil((@baseFontSize * 0.85)); // ~12px



//== Components
//
//## Define common padding and border radius sizes and more. Values based on 14px text and 1.428 line-height (~20px to start).

@paddingBaseVertical:     4px;
@paddingBaseHorizontal:   12px;

@paddingLargeVertical:    10px;
@paddingLargeHorizontal:  16px;

@paddingSmallVertical:    2px;
@paddingSmallHorizontal:  8px;

@paddingMiniVertical:     1px;
@paddingMiniHorizontal:   5px;

@lineHeightLarge:         1.33;
@lineHeightSmall:         1.5;

@radius:                  4px;
@radiusLarge:             6px;
@radiusSmall:             3px;

// Tables
// -------------------------
@tableBackground:                   transparent; // overall background-color
@tableBackgroundAccent:             #f9f9f9; // for striping
@tableBackgroundHover:              #f5f5f5; // for hover
@tableBorder:                       #ddd; // table and cell border
@tableActive:                       @tableBackgroundHover;

@tableBorderedHeaderBackground:             #f8f8f8;
@tableBorderedHeaderBackgroundHighlight:    @grayLighter;

@tableHeaderBackground:             @white;
@tableHeaderBackgroundHighlight:    #f4f4f4;



//== Panels
//
//##

@panel-bg:                    #fff;
@panel-body-padding:          15px;
@panel-header-padding:       10px 15px;
@panel-footer-padding:        @panel-header-padding;
@panel-border-radius:         @radius;

//** Border color for elements within panels
@panel-inner-border:          #ddd;
@panel-footer-bg:             #f5f5f5;

@panel-default-text:          @grayDark;
@panel-default-border:        #ddd;
@panel-default-heading-bg:    #f5f5f5;

@panel-primary-text:          #fff;
@panel-primary-border:        @brandPrimary;
@panel-primary-heading-bg:    @brandPrimary;

@panel-success-text:          @successText;
@panel-success-border:        @successBorder;
@panel-success-heading-bg:    @successBackground;

@panel-info-text:             @infoText;
@panel-info-border:           @infoBorder;
@panel-info-heading-bg:       @infoBackground;

@panel-warning-text:          @warningText;
@panel-warning-border:        @warningBorder;
@panel-warning-heading-bg:    @warningBackground;

@panel-danger-text:           @errorText;
@panel-danger-border:         @errorBorder;
@panel-danger-heading-bg:     @errorBackground;



//icons 大部分icons的颜色使用按钮的颜色
@iconInfoBackground:                #0096e8;
@iconInfoBackgroundHighlight:       #0071e7;

@iconBackground:                    #fff;//没特殊颜色的icon
@iconColor:                         #9ca0b1;
@iconBorderColor:                   #c3c3d6;
@iconBackgroundHighlight:           #e6e6e6;

@iconDisableBackGroundHighlight:    #ececec;
@iconDisableColor:                  #d5d5d5;
@iconDisableBorderColor:            #dfdfdf;

@iconHoverBackGroundHighlight:      #DEDEDE;
@iconHoverColor:                    #73787d;
@iconHoverBorderColor:              #a6a6c1;

//== Buttons
//
//## For each of Bootstrap's buttons, define text, background and border color.

@buttonFontWeight:                normal;

@buttonDefaultColor:              #333;
@buttonDefaultBg:                 #fff;
@buttonDefaultBorder:             #ccc;

@buttonPrimaryColor:              #fff;
@buttonPrimaryBg:                 @brandPrimary;
@buttonPrimaryBorder:             darken(@buttonPrimaryBg, 5%);

@buttonSuccessColor:              #fff;
@buttonSuccessBg:                 @brandSuccess;
@buttonSuccessBorder:             darken(@buttonSuccessBg, 5%);

@buttonInfoColor:                 #fff;
@buttonInfoBg:                    @brandInfo;
@buttonInfoBorder:                darken(@buttonInfoBg, 5%);

@buttonWarningColor:              #fff;
@buttonWarningBg:                 @brandWarning;
@buttonWarningBorder:             darken(@buttonWarningBg, 5%);

@buttonDangerColor:               #fff;
@buttonDangerBg:                  @brandDanger;
@buttonDangerBorder:              darken(@buttonDangerBg, 5%);

@buttonInverseColor:               #fff;
@buttonInverseBg:                  @brandInverse;
@buttonInverseBorder:              darken(@buttonInverseBg, 5%);

@buttonLinkDisabledColor:        @grayLight;


@btnBackground:                     #fff;//#f8f8f8;
@btnBackgroundHighlight:            #e4e4e4;

// Forms
// -------------------------
@inputBackground:               @white;
@inputBorder:                   #ccc;
@inputDisabledBackground:       @grayLighter;
@controlRowHeight:              20px;
@controlAppendHeight:           4px;
@controlFocusBorder:            #66afe9;
//** Placeholder text color
@inputColorPlaceholder:        @grayLight;

@controlNormal:                 140px;
@controlSmall:                  80px;
@controlLarge:                  300px;

//** Placeholder text color
@input-color-placeholder:        @grayLight;


// COMPONENT VARIABLES
// --------------------------------------------------

// Z-index master list
// -------------------------
// Used for a bird's eye view of components dependent on the z-axis
// Try to avoid customizing these :)
@zindexGridHeader:		  100;
@zindexGridMenu:		  200;
@zindexDropdown:          1000;
@zindexPopover:           1010;
@zindexTooltip:           1020;
@zindexFixedNavbar:       1030;
@zindexMask:              1040;
@zindexMaskMsg:           1050;
@zindexModalBackdrop:     1060;
@zindexModal:             1070;




// Sprite icons path
// -------------------------
@iconSpritePath:          "../../img/sprite-469-300.png";
@iconWhiteSpritePath:     "../../img/white_sprite-469-300.png";
@loadPath:                "../../img/load-16-16.gif";

// Input placeholder text color
// -------------------------
@placeholderText:         @grayLight;


// Hr border color
// -------------------------
@hrBorder:                @grayLighter;

//detail page
// ------------
@sectionIconBorder:       #ADBCE2;
@sectionArrowColor:       #5970A6;
@sectionArrowBack:        #f4f8f4;
@sectionArrowBackHighlight:#cddaf8;


// Form states and alerts
// -------------------------
@successText:             #3c763d;
@successBackground:       #dff0d8;
@successBorder:           darken(spin(@successBackground, -10), 5%);

@infoText:                #31708f;
@infoBackground:          #d9edf7;
@infoBorder:              darken(spin(@infoBackground, -10), 7%);

@warningText:             #8a6d3b;
@warningBackground:       #fcf8e3;
@warningBorder:           darken(spin(@warningBackground, -10), 3%);

@errorText:               #a94442; //#b94a48;
@errorBackground:         #f2dede;
@errorBorder:             darken(spin(@errorBackground, -10), 5%);
// @errorOuter:              #cc4333;


// GRID
// --------------------------------------------------

// Default 950px grid 
// -------------------------
@gridColumns:             24;
@gridColumnWidth:         30px;//default 60
@gridGutterWidth:         10px;//default 20
@gridRowWidth:            (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1));


// Fluid grid
// -------------------------
@fluidGridColumnWidth:    3.1578947368%;//6.382978723%;
@fluidGridGutterWidth:    1.0526315789%;//2.127659574%;

//== Progress bars
//

//** Background color of the whole progress component
@progress-bg:                 #f5f5f5;
//** Progress bar text color
@progress-bar-color:          #fff;

//** Default progress bar color
@progress-bar-bg:             @brandPrimary;
//** Success progress bar color
@progress-bar-success-bg:     @brandSuccess;
//** Warning progress bar color
@progress-bar-warning-bg:     @brandWarning;
//** Danger progress bar color
@progress-bar-danger-bg:      @brandDanger;
//** Info progress bar color
@progress-bar-info-bg:        @brandInfo;

//tip
@tipNoticeText:           @panel-warning-text;
@tipNoticeBorder:         @panel-warning-border;
@tipNoticeBackground:     @panel-warning-heading-bg;
@tipSuccessText:          @panel-success-text;
@tipSuccessBorder:        @panel-success-border;
@tipSuccessBackground:    @panel-success-heading-bg;
@tipWaringText:           @panel-danger-text;
@tipWaringBorder:         @panel-danger-border;
@tipWaringBackground:     @panel-danger-heading-bg;
@tipInfoText:             @panel-info-text;
@tipInfoBorder:           @panel-info-border;
@tipInfoBackground:       @panel-info-heading-bg;
@tipNormalText:           @panel-default-text;
@tipNormalBorder:         @panel-default-border;
@tipNormalBackground:     @panel-default-heading-bg;

