mirrors/bootstrap
2
0
Fork 0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-14 18:42:30 +03:00
Code Activity

Switch up some split button stuff

Browse Source 
- New vars
- New function for stripping units so we can combine rems and ems in math functions
- Add new classes for sizing and spacing around the split dropdown toggle so that the caret isn't misaligned
This commit is contained in:
Mark Otto
2016-01-08 13:23:24 -08:00
parent 3740d8f2ac
commit f6ad665c26
6 changed files with 75 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scss/_button-group.scss
+13 -7
View File
@@ -103,13 +103,19 @@
//
// Give the line between buttons some depth
.btn-group > .btn + .dropdown-toggle {
padding-right: $split-btn-dropdown-toggle-padding-x;
padding-left: $split-btn-dropdown-toggle-padding-x;
}
.btn-group > .btn-lg + .dropdown-toggle {
padding-right: $split-btn-lg-dropdown-toggle-padding-x;
padding-left: $split-btn-lg-dropdown-toggle-padding-x;
.dropdown-toggle-split {
padding-left: $btn-dropdown-toggle-split-l;
padding-right: $btn-dropdown-toggle-split-r;
&.btn-sm {
padding-left: $btn-dropdown-toggle-split-l-sm;
padding-right: $btn-dropdown-toggle-split-r-sm;
}
&.btn-lg {
padding-left: $btn-dropdown-toggle-split-l-lg;
padding-right: $btn-dropdown-toggle-split-r-lg;
}
}
// The clickable button for toggling the menu
scss/_dropdown.scss
+1 -2
View File
@@ -10,8 +10,7 @@
display: inline-block;
width: 0;
height: 0;
margin-right: .25rem;
margin-left: .25rem;
margin-left: $caret-width;
vertical-align: middle;
content: "";
border-top: $caret-width solid;
scss/_functions.scss
+17
View File
@@ -0,0 +1,17 @@
//
// Functions
//
// Remove the unit of a length
// Source: https://css-tricks.com/snippets/sass/strip-unit-function/
//
// @param {Number} $number - Number to remove unit from
// @return {Number} - Unitless number
@function strip-unit($number) {
@if type-of($number) == 'number' and not unitless($number) {
@return $number / ($number * 0 + 1);
}
@return $number;
}
scss/_variables.scss
+8 -4
View File
@@ -270,11 +270,15 @@ $btn-padding-y-sm: .25rem !default;
$btn-padding-x-lg: 1.25rem !default;
$btn-padding-y-lg: .75rem !default;
$btn-block-spacing-y: 5px !default;
$btn-toolbar-margin: 5px !default;
$btn-block-spacing-y: .5rem !default;
$btn-toolbar-margin: .5rem !default;
$split-btn-dropdown-toggle-padding-x: 8px !default;
$split-btn-lg-dropdown-toggle-padding-x: 12px !default;
$btn-dropdown-toggle-split-l: (strip-unit($btn-padding-x) - ($caret-width * 1.5)) !default;
$btn-dropdown-toggle-split-r: (strip-unit($btn-padding-x) - ($caret-width * .5)) !default;
$btn-dropdown-toggle-split-l-sm: (strip-unit($btn-padding-x-sm) - ($caret-width * 1.5)) !default;
$btn-dropdown-toggle-split-r-sm: (strip-unit($btn-padding-x-sm) - ($caret-width * .5)) !default;
$btn-dropdown-toggle-split-l-lg: (strip-unit($btn-padding-x-lg) - ($caret-width-lg * 1.5)) !default;
$btn-dropdown-toggle-split-r-lg: (strip-unit($btn-padding-x-lg) - ($caret-width-lg * .5)) !default;
// Allows for customizing button radius independently from global border radius
$btn-border-radius: $border-radius !default;
scss/bootstrap.scss
Vendored
+1
View File
@@ -5,6 +5,7 @@
*/
// Core variables and mixins
@import "functions";
@import "variables";
@import "mixins";