| // Variables.less |
| // Variables to customize the look and feel of Bootstrap |
| // ----------------------------------------------------- |
| |
| |
| |
| // GLOBAL VALUES |
| // -------------------------------------------------- |
| |
| // Links |
| @linkColor: #08c; |
| @linkColorHover: darken(@linkColor, 15%); |
| |
| // Grays |
| @black: #000; |
| @grayDarker: #222; |
| @grayDark: #333; |
| @gray: #555; |
| @grayLight: #999; |
| @grayLighter: #eee; |
| @white: #fff; |
| |
| // Accent colors |
| @blue: #049cdb; |
| @blueDark: #0064cd; |
| @green: #46a546; |
| @red: #9d261d; |
| @yellow: #ffc40d; |
| @orange: #f89406; |
| @pink: #c3325f; |
| @purple: #7a43b6; |
| |
| // Typography |
| @baseFontSize: 13px; |
| @baseFontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif; |
| @baseLineHeight: 18px; |
| @textColor: @grayDark; |
| |
| // Buttons |
| @primaryButtonBackground: @linkColor; |
| |
| |
| |
| // 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 :) |
| @zindexDropdown: 1000; |
| @zindexPopover: 1010; |
| @zindexTooltip: 1020; |
| @zindexFixedNavbar: 1030; |
| @zindexModalBackdrop: 1040; |
| @zindexModal: 1050; |
| |
| // Sprite icons path |
| @iconSpritePath: "../img/glyphicons-halflings.png"; |
| @iconWhiteSpritePath: "../img/glyphicons-halflings-white.png"; |
| |
| // Input placeholder text color |
| @placeholderText: @grayLight; |
| |
| // Hr border color |
| @hrBorder: @grayLighter; |
| |
| // Navbar |
| @navbarHeight: 40px; |
| @navbarBackground: @grayDarker; |
| @navbarBackgroundHighlight: @grayDark; |
| @navbarLinkBackgroundHover: transparent; |
| |
| @navbarText: @grayLight; |
| @navbarLinkColor: @grayLight; |
| @navbarLinkColorHover: @white; |
| |
| // Form states and alerts |
| @warningText: #c09853; |
| @warningBackground: #fcf8e3; |
| @warningBorder: darken(spin(@warningBackground, -10), 3%); |
| |
| @errorText: #b94a48; |
| @errorBackground: #f2dede; |
| @errorBorder: darken(spin(@errorBackground, -10), 3%); |
| |
| @successText: #468847; |
| @successBackground: #dff0d8; |
| @successBorder: darken(spin(@successBackground, -10), 5%); |
| |
| @infoText: #3a87ad; |
| @infoBackground: #d9edf7; |
| @infoBorder: darken(spin(@infoBackground, -10), 7%); |
| |
| |
| |
| // GRID |
| // -------------------------------------------------- |
| |
| // Default 940px grid |
| @gridColumns: 12; |
| @gridColumnWidth: 60px; |
| @gridGutterWidth: 20px; |
| @gridRowWidth: (@gridColumns * @gridColumnWidth) + (@gridGutterWidth * (@gridColumns - 1)); |
| |
| // Fluid grid |
| @fluidGridColumnWidth: 6.382978723%; |
| @fluidGridGutterWidth: 2.127659574%; |