0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-28 10:24:19 +01:00

Merge branch 'dropdown-caret' of https://github.com/pat270/bootstrap into v4-dev

This commit is contained in:
Mark Otto 2017-10-02 20:51:14 -07:00
commit e626277c73
5 changed files with 40 additions and 19 deletions

View File

@ -163,6 +163,7 @@ You can find and customize these variables for key global options in our `_varia
| `$enable-transitions` | `true` (default) or `false` | Enables predefined `transition`s on various components. |
| `$enable-hover-media-query` | `true` or `false` (default) | ... |
| `$enable-grid-classes` | `true` (default) or `false` | Enables the generation of CSS classes for the grid system (e.g., `.container`, `.row`, `.col-md-1`, etc.). |
| `$enable-caret` | `true` (default) or `false` | Enables pseudo element caret on `.dropdown-toggle`. |
| `$enable-print-styles` | `true` (default) or `false` | Enables styles for optimizing printing. |
## Color

View File

@ -6,21 +6,7 @@
.dropdown-toggle {
// Generate the caret automatically
&::after {
display: inline-block;
width: 0;
height: 0;
margin-left: $caret-width * .85;
vertical-align: $caret-width * .85;
content: "";
border-top: $caret-width solid;
border-right: $caret-width solid transparent;
border-left: $caret-width solid transparent;
}
&:empty::after {
margin-left: 0;
}
@include caret;
}
// Allow for dropdowns to go bottom up (aka, dropup-menu)
@ -32,10 +18,7 @@
}
.dropdown-toggle {
&::after {
border-top: 0;
border-bottom: $caret-width solid;
}
@include caret(up);
}
}

View File

@ -19,6 +19,7 @@
// // Components
@import "mixins/alert";
@import "mixins/buttons";
@import "mixins/caret";
@import "mixins/pagination";
@import "mixins/lists";
@import "mixins/list-group";

View File

@ -83,6 +83,7 @@ $theme-color-interval: 8% !default;
//
// Quickly modify global styling by enabling or disabling optional features.
$enable-caret: true !default;
$enable-rounded: true !default;
$enable-shadows: false !default;
$enable-gradients: false !default;

35
scss/mixins/_caret.scss Normal file
View File

@ -0,0 +1,35 @@
@mixin caret-down {
border-top: $caret-width solid;
border-right: $caret-width solid transparent;
border-bottom: 0;
border-left: $caret-width solid transparent;
}
@mixin caret-up {
border-top: 0;
border-right: $caret-width solid transparent;
border-bottom: $caret-width solid;
border-left: $caret-width solid transparent;
}
@mixin caret($direction: down) {
@if $enable-caret {
&::after {
display: inline-block;
width: 0;
height: 0;
margin-left: $caret-width * .85;
vertical-align: $caret-width * .85;
content: "";
@if $direction == down {
@include caret-down;
} @else if $direction == up {
@include caret-up;
}
}
&:empty::after {
margin-left: 0;
}
}
}