mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-25 22:41:20 +02:00
Code Issues Releases Wiki Activity

Add dropright and dropleft (right and left placements for our dropdown) (#23860)

Browse Source 
* Add dropright (right placement for our dropdown)

* Add dropleft

* moves drop left arrow to the left
This commit is contained in:
Johann-S
2017-10-29 23:29:13 +01:00
committed by Mark Otto
parent b1623c4429
commit e454c8ec1e
5 changed files with 244 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
scss/_dropdown.scss
View File

@@ -44,6 +44,34 @@
}
}
.dropright {
.dropdown-menu {
margin-top: 0;
margin-left: $dropdown-spacer;
}
.dropdown-toggle {
@include caret(right);
&::after {
vertical-align: 0;
}
}
}
.dropleft {
.dropdown-menu {
margin-top: 0;
margin-right: $dropdown-spacer;
}
.dropdown-toggle {
@include caret(left);
&::before {
vertical-align: 0;
}
}
}
// Dividers (basically an `<hr>`) within the dropdown
.dropdown-divider {
@include nav-divider($dropdown-divider-bg);

30
scss/mixins/_caret.scss
View File

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