diff --git a/docs/base-css.html b/docs/base-css.html index 69a9a2f590..b5330c3a46 100644 --- a/docs/base-css.html +++ b/docs/base-css.html @@ -34,11 +34,11 @@
@bodyBackground |
- @white |
- Page background color | -- |
@textColor |
- @grayDark |
- Default text color for entire body, headings, and more | -- |
@linkColor |
- #08c |
- Default link text color | -- |
@linkColorHover |
- darken(@linkColor, 15%) |
- Default link text hover color | -- |
@gridColumns |
- 12 | -
@gridColumnWidth |
- 60px | -
@gridGutterWidth |
- 20px | -
@fluidGridColumnWidth |
- 6.382978723% | -
@fluidGridGutterWidth |
- 2.127659574% | -
@sansFontFamily |
- "Helvetica Neue", Helvetica, Arial, sans-serif | -||
@serifFontFamily |
- Georgia, "Times New Roman", Times, serif |
- ||
@monoFontFamily |
- Menlo, Monaco, "Courier New", monospace | -
@bodyBackground |
+ @white |
+ Page background color | ++ |
@textColor |
+ @grayDark |
+ Default text color for entire body, headings, and more | ++ |
@linkColor |
+ #08c |
+ Default link text color | ++ |
@linkColorHover |
+ darken(@linkColor, 15%) |
+ Default link text hover color | ++ |
@gridColumns |
+ 12 | +
@gridColumnWidth |
+ 60px | +
@gridGutterWidth |
+ 20px | +
@fluidGridColumnWidth |
+ 6.382978723% | +
@fluidGridGutterWidth |
+ 2.127659574% | +
@sansFontFamily |
+ "Helvetica Neue", Helvetica, Arial, sans-serif | +|
@serifFontFamily |
+ Georgia, "Times New Roman", Times, serif |
+ |
@monoFontFamily |
+ Menlo, Monaco, "Courier New", monospace | +|
@baseFontSize |
- 13px | -Must be pixels | -
@baseFontFamily |
- @sansFontFamily |
- |
@baseLineHeight |
- 18px | -Must be pixels | -
@altFontFamily |
- @serifFontFamily |
- |
@baseFontSize |
+ 13px | +Must be pixels | +
@baseFontFamily |
+ @sansFontFamily |
+ |
@baseLineHeight |
+ 18px | +Must be pixels | +
@altFontFamily |
+ @serifFontFamily |
+ |
@headingsFontFamily |
+ inherit |
+ |
@headingsFontWeight |
+ bold |
+ |
@headingsColor |
+ inherit |
+
@tableBackground |
+ transparent |
+
@tableBackgroundAccent |
+ #f9f9f9 |
+
@tableBackgroundHover |
+ #f5f5f5 |
+
@tableBorder |
+ ddd |
+
@black |
+ #000 | ++ |
@grayDarker |
+ #222 | ++ |
@grayDark |
+ #333 | ++ |
@gray |
+ #555 | ++ |
@grayLight |
+ #999 | ++ |
@grayLighter |
+ #eee | ++ |
@white |
+ #fff | ++ |
@blue |
+ #049cdb | ++ |
@green |
+ #46a546 | ++ |
@red |
+ #9d261d | ++ |
@yellow |
+ #ffc40d | ++ |
@orange |
+ #f89406 | ++ |
@pink |
+ #c3325f | ++ |
@purple |
+ #7a43b6 | ++ |
@headingsFontFamily
inherit
@headingsFontWeight
bold
@headingsColor
inherit
@tableBackground |
- transparent |
-
@tableBackgroundAccent |
- #f9f9f9 |
-
@tableBackgroundHover |
- #f5f5f5 |
-
@tableBorder |
- ddd |
-
@black |
- #000 | -- |
@grayDarker |
- #222 | -- |
@grayDark |
- #333 | -- |
@gray |
- #555 | -- |
@grayLight |
- #999 | -- |
@grayLighter |
- #eee | -- |
@white |
- #fff | -- |
@blue |
- #049cdb | -- |
@green |
- #46a546 | -- |
@red |
- #9d261d | -- |
@yellow |
- #ffc40d | -- |
@orange |
- #f89406 | -- |
@pink |
- #c3325f | -- |
@purple |
- #7a43b6 | -- |
@btnBackground |
- @white |
- - |
@btnBackgroundHighlight |
- darken(@white, 10%) |
- - |
@btnBorder |
- darken(@white, 20%) |
- - |
@btnPrimaryBackground |
- @linkColor |
- - |
@btnPrimaryBackgroundHighlight |
- spin(@btnPrimaryBackground, 15%) |
- - |
@btnBackground |
+ @white |
+ + |
@btnBackgroundHighlight |
+ darken(@white, 10%) |
+ + |
@btnBorder |
+ darken(@white, 20%) |
+ + |
@btnInfoBackground |
- #5bc0de |
- - |
@btnInfoBackgroundHighlight |
- #2f96b4 |
- - |
@btnPrimaryBackground |
+ @linkColor |
+ + |
@btnPrimaryBackgroundHighlight |
+ spin(@btnPrimaryBackground, 15%) |
+ + |
@btnSuccessBackground |
- #62c462 |
- - |
@btnSuccessBackgroundHighlight |
- 51a351 |
- - |
@btnInfoBackground |
+ #5bc0de |
+ + |
@btnInfoBackgroundHighlight |
+ #2f96b4 |
+ + |
@btnWarningBackground |
- lighten(@orange, 15%) |
- - |
@btnWarningBackgroundHighlight |
- @orange |
- - |
@btnSuccessBackground |
+ #62c462 |
+ + |
@btnSuccessBackgroundHighlight |
+ 51a351 |
+ + |
@btnDangerBackground |
- #ee5f5b |
- - |
@btnDangerBackgroundHighlight |
- #bd362f |
- - |
@btnWarningBackground |
+ lighten(@orange, 15%) |
+ + |
@btnWarningBackgroundHighlight |
+ @orange |
+ + |
@btnInverseBackground |
- @gray |
- - |
@btnInverseBackgroundHighlight |
- @grayDarker |
- - |
@placeholderText |
- @grayLight |
-
@inputBackground |
- @white |
-
@inputBorder |
- #ccc |
-
@inputBorderRadius |
- 3px |
-
@inputDisabledBackground |
- @grayLighter |
-
@formActionsBackground |
- #f5f5f5 |
-
@warningText |
- #c09853 | -- |
@warningBackground |
- #f3edd2 | -- |
@errorText |
- #b94a48 | -- |
@errorBackground |
- #f2dede | -- |
@successText |
- #468847 | -- |
@successBackground |
- #dff0d8 | -- |
@infoText |
- #3a87ad | -- |
@infoBackground |
- #d9edf7 | -- |
@navbarHeight |
- 40px | -- |
@navbarBackground |
- @grayDarker |
- - |
@navbarBackgroundHighlight |
- @grayDark |
- - |
@btnDangerBackground |
+ #ee5f5b |
+ + |
@btnDangerBackgroundHighlight |
+ #bd362f |
+ + |
@navbarText |
- @grayLight |
- - |
@navbarLinkColor |
- @grayLight |
- - |
@navbarLinkColorHover |
- @white |
- - |
@navbarLinkColorActive |
- @navbarLinkColorHover |
- - |
@navbarLinkBackgroundHover |
- transparent |
- - |
@navbarLinkBackgroundActive |
- @navbarBackground |
- - |
@btnInverseBackground |
+ @gray |
+ + |
@btnInverseBackgroundHighlight |
+ @grayDarker |
+ + |
@placeholderText |
+ @grayLight |
+
@inputBackground |
+ @white |
+
@inputBorder |
+ #ccc |
+
@inputBorderRadius |
+ 3px |
+
@inputDisabledBackground |
+ @grayLighter |
+
@formActionsBackground |
+ #f5f5f5 |
+
@warningText |
+ #c09853 | ++ |
@warningBackground |
+ #f3edd2 | ++ |
@errorText |
+ #b94a48 | ++ |
@errorBackground |
+ #f2dede | ++ |
@successText |
+ #468847 | ++ |
@successBackground |
+ #dff0d8 | ++ |
@infoText |
+ #3a87ad | ++ |
@infoBackground |
+ #d9edf7 | ++ |
@navbarHeight |
+ 40px | ++ |
@navbarBackground |
+ @grayDarker |
+ + |
@navbarBackgroundHighlight |
+ @grayDark |
+ + |
@navbarText |
+ @grayLight |
+ + |
@navbarLinkColor |
+ @grayLight |
+ + |
@navbarLinkColorHover |
+ @white |
+ + |
@navbarLinkColorActive |
+ @navbarLinkColorHover |
+ + |
@navbarLinkBackgroundHover |
+ transparent |
+ + |
@navbarLinkBackgroundActive |
+ @navbarBackground |
+ + |
@navbarSearchBackground |
+ lighten(@navbarBackground, 25%) |
+ + |
@navbarSearchBackgroundFocus |
+ @white |
+ + |
@navbarSearchBorder |
+ darken(@navbarSearchBackground, 30%) |
+ + |
@navbarSearchPlaceholderColor |
+ #ccc |
+ + |
@navbarBrandColor |
+ @navbarLinkColor |
+ + |
@dropdownBackground |
+ @white |
+
@dropdownBorder |
+ rgba(0,0,0,.2) |
+
@dropdownLinkColor |
+ @grayDark |
+
@dropdownLinkColorHover |
+ @white |
+
@dropdownLinkBackgroundHover |
+ @linkColor |
+
@@dropdownDividerTop |
+ #e5e5e5 |
+
@@dropdownDividerBottom |
+ @white |
+
@heroUnitBackground |
+ @grayLighter |
+ + |
@heroUnitHeadingColor |
+ inherit |
+ + |
@heroUnitLeadColor |
+ inhereit |
+ + |
@navbarSearchBackground
lighten(@navbarBackground, 25%)
@navbarSearchBackgroundFocus
@white
@navbarSearchBorder
darken(@navbarSearchBackground, 30%)
@navbarSearchPlaceholderColor
#ccc
@navbarBrandColor
@navbarLinkColor
@dropdownBackground |
- @white |
-
@dropdownBorder |
- rgba(0,0,0,.2) |
-
@dropdownLinkColor |
- @grayDark |
-
@dropdownLinkColorHover |
- @white |
-
@dropdownLinkBackgroundHover |
- @linkColor |
-
@@dropdownDividerTop |
- #e5e5e5 |
-
@@dropdownDividerBottom |
- @white |
-
@heroUnitBackground |
- @grayLighter |
- - |
@heroUnitHeadingColor |
- inherit |
- - |
@heroUnitLeadColor |
- inhereit |
- - |
@bodyBackground |
- @white |
- {{_i}}Page background color{{/i}} | -- |
@textColor |
- @grayDark |
- {{_i}}Default text color for entire body, headings, and more{{/i}} | -- |
@linkColor |
- #08c |
- {{_i}}Default link text color{{/i}} | -- |
@linkColorHover |
- darken(@linkColor, 15%) |
- {{_i}}Default link text hover color{{/i}} | -- |
@gridColumns |
- 12 | -
@gridColumnWidth |
- 60px | -
@gridGutterWidth |
- 20px | -
@fluidGridColumnWidth |
- 6.382978723% | -
@fluidGridGutterWidth |
- 2.127659574% | -
@sansFontFamily |
- "Helvetica Neue", Helvetica, Arial, sans-serif | -||
@serifFontFamily |
- Georgia, "Times New Roman", Times, serif |
- ||
@monoFontFamily |
- Menlo, Monaco, "Courier New", monospace | -
@bodyBackground |
+ @white |
+ {{_i}}Page background color{{/i}} | ++ |
@textColor |
+ @grayDark |
+ {{_i}}Default text color for entire body, headings, and more{{/i}} | ++ |
@linkColor |
+ #08c |
+ {{_i}}Default link text color{{/i}} | ++ |
@linkColorHover |
+ darken(@linkColor, 15%) |
+ {{_i}}Default link text hover color{{/i}} | ++ |
@gridColumns |
+ 12 | +
@gridColumnWidth |
+ 60px | +
@gridGutterWidth |
+ 20px | +
@fluidGridColumnWidth |
+ 6.382978723% | +
@fluidGridGutterWidth |
+ 2.127659574% | +
@sansFontFamily |
+ "Helvetica Neue", Helvetica, Arial, sans-serif | +|
@serifFontFamily |
+ Georgia, "Times New Roman", Times, serif |
+ |
@monoFontFamily |
+ Menlo, Monaco, "Courier New", monospace | +|
@baseFontSize |
- 13px | -Must be pixels | -
@baseFontFamily |
- @sansFontFamily |
- |
@baseLineHeight |
- 18px | -Must be pixels | -
@altFontFamily |
- @serifFontFamily |
- |
@baseFontSize |
+ 13px | +Must be pixels | +
@baseFontFamily |
+ @sansFontFamily |
+ |
@baseLineHeight |
+ 18px | +Must be pixels | +
@altFontFamily |
+ @serifFontFamily |
+ |
@headingsFontFamily |
+ inherit |
+ |
@headingsFontWeight |
+ bold |
+ |
@headingsColor |
+ inherit |
+
@tableBackground |
+ transparent |
+
@tableBackgroundAccent |
+ #f9f9f9 |
+
@tableBackgroundHover |
+ #f5f5f5 |
+
@tableBorder |
+ ddd |
+
@black |
+ #000 | ++ |
@grayDarker |
+ #222 | ++ |
@grayDark |
+ #333 | ++ |
@gray |
+ #555 | ++ |
@grayLight |
+ #999 | ++ |
@grayLighter |
+ #eee | ++ |
@white |
+ #fff | ++ |
@blue |
+ #049cdb | ++ |
@green |
+ #46a546 | ++ |
@red |
+ #9d261d | ++ |
@yellow |
+ #ffc40d | ++ |
@orange |
+ #f89406 | ++ |
@pink |
+ #c3325f | ++ |
@purple |
+ #7a43b6 | ++ |
@headingsFontFamily
inherit
@headingsFontWeight
bold
@headingsColor
inherit
@tableBackground |
- transparent |
-
@tableBackgroundAccent |
- #f9f9f9 |
-
@tableBackgroundHover |
- #f5f5f5 |
-
@tableBorder |
- ddd |
-
@black |
- #000 | -- |
@grayDarker |
- #222 | -- |
@grayDark |
- #333 | -- |
@gray |
- #555 | -- |
@grayLight |
- #999 | -- |
@grayLighter |
- #eee | -- |
@white |
- #fff | -- |
@blue |
- #049cdb | -- |
@green |
- #46a546 | -- |
@red |
- #9d261d | -- |
@yellow |
- #ffc40d | -- |
@orange |
- #f89406 | -- |
@pink |
- #c3325f | -- |
@purple |
- #7a43b6 | -- |
@btnBackground |
- @white |
- - |
@btnBackgroundHighlight |
- darken(@white, 10%) |
- - |
@btnBorder |
- darken(@white, 20%) |
- - |
@btnPrimaryBackground |
- @linkColor |
- - |
@btnPrimaryBackgroundHighlight |
- spin(@btnPrimaryBackground, 15%) |
- - |
@btnBackground |
+ @white |
+ + |
@btnBackgroundHighlight |
+ darken(@white, 10%) |
+ + |
@btnBorder |
+ darken(@white, 20%) |
+ + |
@btnInfoBackground |
- #5bc0de |
- - |
@btnInfoBackgroundHighlight |
- #2f96b4 |
- - |
@btnPrimaryBackground |
+ @linkColor |
+ + |
@btnPrimaryBackgroundHighlight |
+ spin(@btnPrimaryBackground, 15%) |
+ + |
@btnSuccessBackground |
- #62c462 |
- - |
@btnSuccessBackgroundHighlight |
- 51a351 |
- - |
@btnInfoBackground |
+ #5bc0de |
+ + |
@btnInfoBackgroundHighlight |
+ #2f96b4 |
+ + |
@btnWarningBackground |
- lighten(@orange, 15%) |
- - |
@btnWarningBackgroundHighlight |
- @orange |
- - |
@btnSuccessBackground |
+ #62c462 |
+ + |
@btnSuccessBackgroundHighlight |
+ 51a351 |
+ + |
@btnDangerBackground |
- #ee5f5b |
- - |
@btnDangerBackgroundHighlight |
- #bd362f |
- - |
@btnWarningBackground |
+ lighten(@orange, 15%) |
+ + |
@btnWarningBackgroundHighlight |
+ @orange |
+ + |
@btnInverseBackground |
- @gray |
- - |
@btnInverseBackgroundHighlight |
- @grayDarker |
- - |
@placeholderText |
- @grayLight |
-
@inputBackground |
- @white |
-
@inputBorder |
- #ccc |
-
@inputBorderRadius |
- 3px |
-
@inputDisabledBackground |
- @grayLighter |
-
@formActionsBackground |
- #f5f5f5 |
-
@warningText |
- #c09853 | -- |
@warningBackground |
- #f3edd2 | -- |
@errorText |
- #b94a48 | -- |
@errorBackground |
- #f2dede | -- |
@successText |
- #468847 | -- |
@successBackground |
- #dff0d8 | -- |
@infoText |
- #3a87ad | -- |
@infoBackground |
- #d9edf7 | -- |
@navbarHeight |
- 40px | -- |
@navbarBackground |
- @grayDarker |
- - |
@navbarBackgroundHighlight |
- @grayDark |
- - |
@btnDangerBackground |
+ #ee5f5b |
+ + |
@btnDangerBackgroundHighlight |
+ #bd362f |
+ + |
@navbarText |
- @grayLight |
- - |
@navbarLinkColor |
- @grayLight |
- - |
@navbarLinkColorHover |
- @white |
- - |
@navbarLinkColorActive |
- @navbarLinkColorHover |
- - |
@navbarLinkBackgroundHover |
- transparent |
- - |
@navbarLinkBackgroundActive |
- @navbarBackground |
- - |
@btnInverseBackground |
+ @gray |
+ + |
@btnInverseBackgroundHighlight |
+ @grayDarker |
+ + |
@placeholderText |
+ @grayLight |
+
@inputBackground |
+ @white |
+
@inputBorder |
+ #ccc |
+
@inputBorderRadius |
+ 3px |
+
@inputDisabledBackground |
+ @grayLighter |
+
@formActionsBackground |
+ #f5f5f5 |
+
@warningText |
+ #c09853 | ++ |
@warningBackground |
+ #f3edd2 | ++ |
@errorText |
+ #b94a48 | ++ |
@errorBackground |
+ #f2dede | ++ |
@successText |
+ #468847 | ++ |
@successBackground |
+ #dff0d8 | ++ |
@infoText |
+ #3a87ad | ++ |
@infoBackground |
+ #d9edf7 | ++ |
@navbarHeight |
+ 40px | ++ |
@navbarBackground |
+ @grayDarker |
+ + |
@navbarBackgroundHighlight |
+ @grayDark |
+ + |
@navbarText |
+ @grayLight |
+ + |
@navbarLinkColor |
+ @grayLight |
+ + |
@navbarLinkColorHover |
+ @white |
+ + |
@navbarLinkColorActive |
+ @navbarLinkColorHover |
+ + |
@navbarLinkBackgroundHover |
+ transparent |
+ + |
@navbarLinkBackgroundActive |
+ @navbarBackground |
+ + |
@navbarSearchBackground |
+ lighten(@navbarBackground, 25%) |
+ + |
@navbarSearchBackgroundFocus |
+ @white |
+ + |
@navbarSearchBorder |
+ darken(@navbarSearchBackground, 30%) |
+ + |
@navbarSearchPlaceholderColor |
+ #ccc |
+ + |
@navbarBrandColor |
+ @navbarLinkColor |
+ + |
@dropdownBackground |
+ @white |
+
@dropdownBorder |
+ rgba(0,0,0,.2) |
+
@dropdownLinkColor |
+ @grayDark |
+
@dropdownLinkColorHover |
+ @white |
+
@dropdownLinkBackgroundHover |
+ @linkColor |
+
@@dropdownDividerTop |
+ #e5e5e5 |
+
@@dropdownDividerBottom |
+ @white |
+
@heroUnitBackground |
+ @grayLighter |
+ + |
@heroUnitHeadingColor |
+ inherit |
+ + |
@heroUnitLeadColor |
+ inhereit |
+ + |
@navbarSearchBackground
lighten(@navbarBackground, 25%)
@navbarSearchBackgroundFocus
@white
@navbarSearchBorder
darken(@navbarSearchBackground, 30%)
@navbarSearchPlaceholderColor
#ccc
@navbarBrandColor
@navbarLinkColor
@dropdownBackground |
- @white |
-
@dropdownBorder |
- rgba(0,0,0,.2) |
-
@dropdownLinkColor |
- @grayDark |
-
@dropdownLinkColorHover |
- @white |
-
@dropdownLinkBackgroundHover |
- @linkColor |
-
@@dropdownDividerTop |
- #e5e5e5 |
-
@@dropdownDividerBottom |
- @white |
-
@heroUnitBackground |
- @grayLighter |
- - |
@heroUnitHeadingColor |
- inherit |
- - |
@heroUnitLeadColor |
- inhereit |
- - |