rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-11-28 10:24:19 +01:00
Code Issues Actions Packages Releases Activity

Add option to disable carets on dropdowns through $enable-caret

Browse Source
This commit is contained in:
Patrick Yeo 2017-06-28 12:34:07 -07:00
parent 7de266d4dd
commit e6042e6f44
4 changed files with 39 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
scss/_dropdown.scss
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);
}
}

1
scss/_mixins.scss
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";

1
scss/_variables.scss
View File

@ -122,6 +122,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;
}
}
}