variables.less

1 lines UTF-8 Unix (LF)
1
/** ------------------------------------------------------------------ 
 * Variables
 */


/** ------------------------------------------------------------------ 
 * Grid
 */
@column-width: 30;
@gutter-width: 10;
@columns: 24;

// Utility variable — you should never need to modify this
@gridsystem-width: (@column-width*@columns) + (@gutter-width*@columns) * 1px;

// Set @total-width to 100% for a fluid layout
@total-width: @gridsystem-width;

@columnWidth: @column-width;
@gutterWidth: @gutter-width;



/** --------------------------------------------------------------
 * Typography.
 *
 */

/**
 * Font families to choose from. 
 */
// Monospace
@fontFamilyCourier:         "Courier New", Courier, monospace;
@fontFamilyMonospace:       monospace;

// Serif
@fontFamilyCambria:         Cambria, Georgia, Times, 'Times New Roman', serif;
@fontFamilyTimes:           Times, 'Times New Roman', serif;
@fontFamilyGaramond:        Garamond, Baskerville, "Baskerville Old Face", "Hoefler Text", Georgia, "Times New Roman", Times, serif;

// Sans-serif
@fontFamilyHelvetica:       Frutiger, "Frutiger Linotype", Univers, Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
@fontFamilyCalibri:         Calibri, "Gill Sans", "Gill Sans MT", "Myriad Pro", Myriad, "DejaVu Sans Condensed", "Liberation Sans", "Nimbus Sans L", Tahoma, Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif;
@fontFamilyMyriadPro:       MyriadPro-Regular, 'Myriad Pro Regular', MyriadPro, 'Myriad Pro', Helvetica, Arial, sans-serif;
@fontFamilyHelveticaNeue:   "Helvetica Neue", Helvetica, Arial, sans-serif;
@fontFamilyArial:           Arial, sans-serif;


/**
 * Default font-families
 */
@fontFamilyHeadings:  @fontFamilyTimes;
@fontFamilyBody:      @fontFamilyTimes;
@fontFamilyCode:      @fontFamilyMonospace;
@fontFamilySiteTitle: @fontFamilyTimes;

/**
 * Magic number for vertical rythm
 */
//@magicNumber: 24px; /* 16px - 100%/1.5 */
@magicNumber: 22px; /* 16px - 100%/1.375 */


/**
 * Headings calculation 
 *
 * 2.75em  * 16px   = 44 => line-height: 44 = 1
 * 2.375em * 16px   = 38 => line-height: 44/38 = 1.1579
 * 2.25em  * 16px   = 36 => line-height: 44/36 = 1.2222
 * 2em     * 16px   = 32 => line-height: 44/32 = 1.375
 * 1.875em * 16px   = 30 => line-height: 44/30 = 1.4667
 * 1.75em  * 16px   = 28 => line-height: 44/28 = 1.5714
 * 1.375em * 16px   = 22 => line-height: 22 = 1
 * 1.25em  * 16px   = 20 => line-height: 22/20 = 1.1
 * 1em     * 16px   = 16 => line-height: 22/16 = 1.375
 * 0.875em * 16px   = 14 => line-height: 22/14 = 1.5714
 * 0.75em  * 16px   = 12 => line-height: 22/12 = 1.8333
 */
@fontSizeBody: 16px;

@fontSizeH1: 2.375em;
@fontSizeH2: 1.875em;
@fontSizeH3: 1.375em;
@fontSizeH4: 1.25em;
@fontSizeH5: 1em;
@fontSizeH6: 1em;

@fontSizeSmall: 0.875em;

@fontSizeSiteTitle: 3em;


@fontSizeSearchH2: 1.25em;


/** --------------------------------------------------------------
 * General colors to colorize the site
 */
@bgColorHtml: #fff;
@bgColorBody: #fff;

@colorBody:         #333;
@colorBody2:        #444;
@colorBodyLighter:  #666;
@colorBodyLight:    #999;

@colorBorderLight: #ccc;

@bgColorLight: #f6f6f6;

@colorSiteTitle: #333;
@colorSiteSlogan: #333;

@anchorColor:         #33b;
@anchorColor2:        #448;
@anchorColorHover:    #33f;
@anchorColorActive:   #838;
@anchorColorVisited:  #838;

@anchorColorAnonymous:      @colorBody;
@anchorColorAnonymousHover: #00c;

@anchorTabBgColor:          lighten(@anchorColorHover, 35%);
@anchorTabBgColorHover:     lighten(@anchorColorHover, 30%);
@anchorTabBgColorActive:    lighten(@anchorColorHover, 35%);
@anchorTabBgColorSelected:  @bgColorBody;

@colorBorderTabElement:         #aaa;
@colorBorderTabElementHover:    #777;
@colorBorderTabElementSelected: #999;
@colorBorderTabBottom:          #ccc;

@colorMark:   @colorBody;
@bgColorMark: #eee;

@colorTableHeaderBorder:    #333;
@colorTableRowBorder:       #ddd;
@colorTableRowBorderHover:  #aaa;
@colorTableRowHover:        #222;
@bgColorTableStripe:        @bgColorLight;

@colorMenuItems:          #444;
@colorMenuItemsHover:     #33f;
@colorMenuItemsSelected:  #000;

@colorSearchUrl:  #009933;