mirror of
https://github.com/twbs/bootstrap.git
synced 2025-01-17 09:52:29 +01:00
Update dropdown vars
* Update `.nav-divider` mixin to simplify to a 1px line (one value instead of two in parametric mixin) * Rename and consolidate dropdown caret vars * Add vars to Customizer
This commit is contained in:
parent
cdf6019e11
commit
398038c798
@ -817,6 +817,10 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
|
||||
<label>@dropdown-link-hover-bg</label>
|
||||
<input type="text" placeholder="@dropdown-link-active-bg">
|
||||
<p class="help-block">Hovered dropdown menu entry background color</p>
|
||||
<h3>Dropdown caret</h3>
|
||||
<label>@dropdown-caret-color</label>
|
||||
<input type="text" placeholder="@dropdown-caret-color">
|
||||
<p class="help-block">Indicator arrow for showing an element has a dropdown</p>
|
||||
</div>
|
||||
<div class="col-lg-6">
|
||||
<h3>Colors</h3>
|
||||
@ -834,12 +838,9 @@ lead: Customize Bootstrap's components, LESS variables, and jQuery plugins to ge
|
||||
<h3>Dividers</h3>
|
||||
<div class="row">
|
||||
<div class="col-lg-6">
|
||||
<label>@dropdown-divider-top</label>
|
||||
<label>@dropdown-divider-bg</label>
|
||||
<input type="text" placeholder="#e5e5e5">
|
||||
<p class="help-block">Dropdown divider top border color</p>
|
||||
<label>@dropdown-divider-bottom</label>
|
||||
<input type="text" placeholder="#fff">
|
||||
<p class="help-block">Dropdown divider bottom border color</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -11,7 +11,7 @@
|
||||
height: 0;
|
||||
margin-left: 2px;
|
||||
vertical-align: middle;
|
||||
border-top: 4px solid @caret-border-top-color;
|
||||
border-top: 4px solid @dropdown-caret-color;
|
||||
border-right: 4px solid transparent;
|
||||
border-left: 4px solid transparent;
|
||||
content: "";
|
||||
@ -45,7 +45,7 @@
|
||||
|
||||
// Dividers (basically an hr) within the dropdown
|
||||
.divider {
|
||||
.nav-divider(@dropdown-divider-top, @dropdown-divider-bottom);
|
||||
.nav-divider(@dropdown-divider-bg);
|
||||
}
|
||||
|
||||
// Links within the dropdown menu
|
||||
@ -159,7 +159,7 @@
|
||||
// Reverse the caret
|
||||
.caret {
|
||||
border-top: 0;
|
||||
border-bottom: 4px solid @dropup-caret-border-color;
|
||||
border-bottom: 4px solid @dropdown-caret-color;
|
||||
content: "";
|
||||
}
|
||||
// Different positioning for bottom up menu
|
||||
|
@ -332,12 +332,11 @@
|
||||
// Horizontal dividers
|
||||
// -------------------------
|
||||
// Dividers (basically an hr) within dropdowns and nav lists
|
||||
.nav-divider(@top: #e5e5e5, @bottom: #fff) {
|
||||
height: 2px; // 1px for background, one for border
|
||||
.nav-divider(@color: #e5e5e5) {
|
||||
height: 1px;
|
||||
margin: ((@line-height-computed / 2) - 1) 0;
|
||||
overflow: hidden;
|
||||
background-color: @top;
|
||||
border-bottom: 1px solid @bottom;
|
||||
background-color: @color;
|
||||
}
|
||||
|
||||
// Alerts
|
||||
|
@ -147,8 +147,7 @@
|
||||
@dropdown-bg: #fff;
|
||||
@dropdown-border: rgba(0,0,0,.15);
|
||||
@dropdown-fallback-border: #ccc;
|
||||
@dropdown-divider-top: #e5e5e5;
|
||||
@dropdown-divider-bottom: #fff;
|
||||
@dropdown-divider-bg: #e5e5e5;
|
||||
|
||||
@dropdown-link-active-color: #fff;
|
||||
@dropdown-link-active-bg: @component-active-bg;
|
||||
@ -157,9 +156,7 @@
|
||||
@dropdown-link-hover-color: #fff;
|
||||
@dropdown-link-hover-bg: @dropdown-link-active-bg;
|
||||
|
||||
@caret-border-top-color: #000;
|
||||
|
||||
@dropup-caret-border-color: #000;
|
||||
@dropdown-caret-color: #000;
|
||||
|
||||
|
||||
// COMPONENT VARIABLES
|
||||
|
Loading…
x
Reference in New Issue
Block a user