sharpetronics/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-06-05 00:02:25 -04:00
Code Issues Projects Releases Wiki Activity

more vars changing

Browse Source
This commit is contained in:
Mark Otto 2012-11-30 15:09:57 -08:00
parent 9239bfbc7b
commit 0ef347706c
5 changed files with 44 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
docs/customize.html
View File

@ -423,15 +423,15 @@
<input type="text" class="span3" placeholder="@navbarCollapseWidth + 1"> <input type="text" class="span3" placeholder="@navbarCollapseWidth + 1">
<h3>Dropdowns</h3> <h3>Dropdowns</h3>
<label>@dropdownBackground</label> <label>@dropdown-background</label>
<input type="text" class="span3" placeholder="#fff"> <input type="text" class="span3" placeholder="#fff">
<label>@dropdownBorder</label> <label>@dropdown-border</label>
<input type="text" class="span3" placeholder="rgba(0,0,0,.2)"> <input type="text" class="span3" placeholder="rgba(0,0,0,.2)">
<label>@dropdownLinkColor</label> <label>@dropdown-link-color</label>
<input type="text" class="span3" placeholder="@grayDark"> <input type="text" class="span3" placeholder="@grayDark">
<label>@dropdownLinkColorHover</label> <label>@dropdown-link-color-hover</label>
<input type="text" class="span3" placeholder="#fff"> <input type="text" class="span3" placeholder="#fff">
<label>@dropdownLinkBackgroundHover</label> <label>@dropdown-link-background-hover</label>
<input type="text" class="span3" placeholder="@link-color"> <input type="text" class="span3" placeholder="@link-color">
</div><!-- /span --> </div><!-- /span -->
</div><!-- /row --> </div><!-- /row -->

10
docs/templates/pages/customize.mustache vendored
View File

@ -355,15 +355,15 @@
<input type="text" class="span3" placeholder="@navbarCollapseWidth + 1"> <input type="text" class="span3" placeholder="@navbarCollapseWidth + 1">
<h3>{{_i}}Dropdowns{{/i}}</h3> <h3>{{_i}}Dropdowns{{/i}}</h3>
<label>@dropdownBackground</label> <label>@dropdown-background</label>
<input type="text" class="span3" placeholder="#fff"> <input type="text" class="span3" placeholder="#fff">
<label>@dropdownBorder</label> <label>@dropdown-border</label>
<input type="text" class="span3" placeholder="rgba(0,0,0,.2)"> <input type="text" class="span3" placeholder="rgba(0,0,0,.2)">
<label>@dropdownLinkColor</label> <label>@dropdown-link-color</label>
<input type="text" class="span3" placeholder="@grayDark"> <input type="text" class="span3" placeholder="@grayDark">
<label>@dropdownLinkColorHover</label> <label>@dropdown-link-color-hover</label>
<input type="text" class="span3" placeholder="#fff"> <input type="text" class="span3" placeholder="#fff">
<label>@dropdownLinkBackgroundHover</label> <label>@dropdown-link-background-hover</label>
<input type="text" class="span3" placeholder="@link-color"> <input type="text" class="span3" placeholder="@link-color">
</div><!-- /span --> </div><!-- /span -->
</div><!-- /row --> </div><!-- /row -->

20
less/dropdowns.less
View File

@ -45,9 +45,9 @@
padding: 5px 0; padding: 5px 0;
margin: 2px 0 0; // override default ul margin: 2px 0 0; // override default ul
list-style: none; list-style: none;
background-color: @dropdownBackground; background-color: @dropdown-background;
border: 1px solid #ccc; // IE8 fallback border: 1px solid #ccc; // IE8 fallback
border: 1px solid @dropdownBorder; border: 1px solid @dropdown-border;
border-radius: @border-radius-base; border-radius: @border-radius-base;
.box-shadow(0 5px 10px rgba(0,0,0,.2)); .box-shadow(0 5px 10px rgba(0,0,0,.2));
.background-clip(padding-box); .background-clip(padding-box);
@ -60,7 +60,7 @@
// Dividers (basically an hr) within the dropdown // Dividers (basically an hr) within the dropdown
.divider { .divider {
.nav-divider(@dropdownDividerTop, @dropdownDividerBottom); .nav-divider(@dropdown-divider-top, @dropdown-divider-bottom);
} }
// Links within the dropdown menu // Links within the dropdown menu
@ -70,7 +70,7 @@
clear: both; clear: both;
font-weight: normal; font-weight: normal;
line-height: @line-height-base; line-height: @line-height-base;
color: @dropdownLinkColor; color: @dropdown-link-color;
white-space: nowrap; white-space: nowrap;
} }
} }
@ -81,18 +81,18 @@
.dropdown-menu li > a:focus, .dropdown-menu li > a:focus,
.dropdown-submenu:hover > a { .dropdown-submenu:hover > a {
text-decoration: none; text-decoration: none;
color: @dropdownLinkColorHover; color: @dropdown-link-color-hover;
#gradient > .vertical(@dropdownLinkBackgroundHover, darken(@dropdownLinkBackgroundHover, 5%)); #gradient > .vertical(@dropdown-link-background-hover, darken(@dropdown-link-background-hover, 5%));
} }
// Active state // Active state
// ------------ // ------------
.dropdown-menu .active > a, .dropdown-menu .active > a,
.dropdown-menu .active > a:hover { .dropdown-menu .active > a:hover {
color: @dropdownLinkColorActive; color: @dropdown-link-color-active;
text-decoration: none; text-decoration: none;
outline: 0; outline: 0;
#gradient > .vertical(@dropdownLinkBackgroundActive, darken(@dropdownLinkBackgroundActive, 5%)); #gradient > .vertical(@dropdown-link-background-active, darken(@dropdown-link-background-active, 5%));
} }
// Disabled state // Disabled state
@ -182,12 +182,12 @@
border-color: transparent; border-color: transparent;
border-style: solid; border-style: solid;
border-width: 5px 0 5px 5px; border-width: 5px 0 5px 5px;
border-left-color: darken(@dropdownBackground, 20%); border-left-color: darken(@dropdown-background, 20%);
margin-top: 5px; margin-top: 5px;
margin-right: -10px; margin-right: -10px;
} }
.dropdown-submenu:hover > a:after { .dropdown-submenu:hover > a:after {
border-left-color: @dropdownLinkColorHover; border-left-color: @dropdown-link-color-hover;
} }
// Left aligned submenus // Left aligned submenus

8
less/navbar.less
View File

@ -279,7 +279,7 @@
border-left: 7px solid transparent; border-left: 7px solid transparent;
border-right: 7px solid transparent; border-right: 7px solid transparent;
border-bottom: 7px solid #ccc; border-bottom: 7px solid #ccc;
border-bottom-color: @dropdownBorder; border-bottom-color: @dropdown-border;
position: absolute; position: absolute;
top: -7px; top: -7px;
left: 9px; left: 9px;
@ -289,7 +289,7 @@
display: inline-block; display: inline-block;
border-left: 6px solid transparent; border-left: 6px solid transparent;
border-right: 6px solid transparent; border-right: 6px solid transparent;
border-bottom: 6px solid @dropdownBackground; border-bottom: 6px solid @dropdown-background;
position: absolute; position: absolute;
top: -6px; top: -6px;
left: 10px; left: 10px;
@ -299,13 +299,13 @@
.navbar-fixed-bottom .nav > li > .dropdown-menu { .navbar-fixed-bottom .nav > li > .dropdown-menu {
&:before { &:before {
border-top: 7px solid #ccc; border-top: 7px solid #ccc;
border-top-color: @dropdownBorder; border-top-color: @dropdown-border;
border-bottom: 0; border-bottom: 0;
bottom: -7px; bottom: -7px;
top: auto; top: auto;
} }
&:after { &:after {
border-top: 6px solid @dropdownBackground; border-top: 6px solid @dropdown-background;
border-bottom: 0; border-bottom: 0;
bottom: -6px; bottom: -6px;
top: auto; top: auto;

30
less/variables.less
View File

@ -30,12 +30,14 @@
// Scaffolding // Scaffolding
// ------------------------- // -------------------------
@body-background: #fff; @body-background: #fff;
@text-color: @grayDark; @text-color: @grayDark;
// Links // Links
// ------------------------- // -------------------------
@link-color: #08c; @link-color: #08c;
@link-color-hover: darken(@link-color, 15%); @link-color-hover: darken(@link-color, 15%);
@ -73,14 +75,17 @@
// Tables // Tables
// ------------------------- // -------------------------
@table-background: transparent; // overall background-color @table-background: transparent; // overall background-color
@table-background-accent: #f9f9f9; // for striping @table-background-accent: #f9f9f9; // for striping
@table-background-hover: #f5f5f5; // for hover @table-background-hover: #f5f5f5; // for hover
@table-border: #ddd; // table and cell border @table-border: #ddd; // table and cell border
// Buttons // Buttons
// ------------------------- // -------------------------
@btn-background: #fff; @btn-background: #fff;
@btn-background-highlight: darken(#fff, 10%); @btn-background-highlight: darken(#fff, 10%);
@btn-border: #bbb; @btn-border: #bbb;
@ -106,28 +111,33 @@
// Forms // Forms
// ------------------------- // -------------------------
@input-background: #fff; @input-background: #fff;
@input-background-disabled: @grayLighter;
@input-border: #ccc; @input-border: #ccc;
@input-border-radius: @border-radius-base; @input-border-radius: @border-radius-base;
@input-border-radius-search: 20px; @input-border-radius-search: 20px;
@input-background-disabled: @grayLighter;
@form-actions-background: #f5f5f5; @form-actions-background: #f5f5f5;
@input-height: @line-height-base + 14px; // base line-height + 12px vertical padding + 2px top/bottom border @input-height: @line-height-base + 14px; // base line-height + 12px vertical padding + 2px top/bottom border
// Dropdowns // Dropdowns
// ------------------------- // -------------------------
@dropdownBackground: #fff;
@dropdownBorder: rgba(0,0,0,.2);
@dropdownDividerTop: #e5e5e5;
@dropdownDividerBottom: #fff;
@dropdownLinkColor: @grayDark; @dropdown-background: #fff;
@dropdownLinkColorHover: #fff; @dropdown-border: rgba(0,0,0,.2);
@dropdownLinkColorActive: #fff; @dropdown-divider-top: #e5e5e5;
@dropdown-divider-bottom: #fff;
@dropdownLinkBackgroundActive: @link-color; @dropdown-link-color: @grayDark;
@dropdownLinkBackgroundHover: @dropdownLinkBackgroundActive; @dropdown-link-color-hover: #fff;
@dropdown-link-color-active: #fff;
@dropdown-link-background-active: @link-color;
@dropdown-link-background-hover: @dropdown-link-background-active;