aboutsummaryrefslogtreecommitdiff
path: root/scss
diff options
context:
space:
mode:
Diffstat (limited to 'scss')
-rw-r--r--scss/_buttons.scss7
-rw-r--r--scss/_pagination.scss6
-rw-r--r--scss/_utilities.scss10
-rw-r--r--scss/_variables.scss19
-rw-r--r--scss/forms/_form-check.scss3
-rw-r--r--scss/forms/_form-control.scss2
-rw-r--r--scss/forms/_input-group.scss2
-rw-r--r--scss/forms/_labels.scss2
-rw-r--r--scss/mixins/_buttons.scss3
-rw-r--r--scss/mixins/_pagination.scss3
10 files changed, 26 insertions, 31 deletions
diff --git a/scss/_buttons.scss b/scss/_buttons.scss
index 52e6b195a..a12bb0e99 100644
--- a/scss/_buttons.scss
+++ b/scss/_buttons.scss
@@ -8,6 +8,7 @@
display: inline-block;
font-family: $btn-font-family;
font-weight: $btn-font-weight;
+ line-height: $btn-line-height;
color: $body-color;
text-align: center;
vertical-align: middle;
@@ -15,7 +16,7 @@
user-select: none;
background-color: transparent;
border: $btn-border-width solid transparent;
- @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-line-height, $btn-border-radius);
+ @include button-size($btn-padding-y, $btn-padding-x, $btn-font-size, $btn-border-radius);
@include transition($btn-transition);
&:hover {
@@ -106,11 +107,11 @@ fieldset:disabled a.btn {
//
.btn-lg {
- @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-line-height-lg, $btn-border-radius-lg);
+ @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $btn-font-size-lg, $btn-border-radius-lg);
}
.btn-sm {
- @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-line-height-sm, $btn-border-radius-sm);
+ @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $btn-font-size-sm, $btn-border-radius-sm);
}
diff --git a/scss/_pagination.scss b/scss/_pagination.scss
index c51272dd7..67d27176a 100644
--- a/scss/_pagination.scss
+++ b/scss/_pagination.scss
@@ -51,12 +51,12 @@
//
// Sizing
//
-@include pagination-size($pagination-padding-y, $pagination-padding-x, null, $pagination-line-height, $pagination-border-radius);
+@include pagination-size($pagination-padding-y, $pagination-padding-x, null, $pagination-border-radius);
.pagination-lg {
- @include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $line-height-lg, $border-radius-lg);
+ @include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $border-radius-lg);
}
.pagination-sm {
- @include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $line-height-sm, $border-radius-sm);
+ @include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $border-radius-sm);
}
diff --git a/scss/_utilities.scss b/scss/_utilities.scss
index 823000c03..4864ec664 100644
--- a/scss/_utilities.scss
+++ b/scss/_utilities.scss
@@ -394,6 +394,16 @@ $utilities: map-merge(
)
)
),
+ "line-height": (
+ property: line-height,
+ class: lh,
+ values: (
+ 1: 1,
+ sm: $line-height-sm,
+ base: $line-height-base,
+ lg: $line-height-lg,
+ )
+ ),
"background-color": (
property: background-color,
class: bg,
diff --git a/scss/_variables.scss b/scss/_variables.scss
index ed2755901..850344aac 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -226,8 +226,8 @@ $container-padding-x: $grid-gutter-width / 2 !default;
//
// Define common padding and border radius sizes and more.
-$line-height-lg: 1.5 !default;
-$line-height-sm: 1.5 !default;
+$line-height-sm: 1.25 !default;
+$line-height-lg: 2 !default;
$border-width: 1px !default;
$border-color: $gray-300 !default;
@@ -420,12 +420,10 @@ $input-btn-focus-box-shadow: 0 0 0 $input-btn-focus-width $input-btn-focus-colo
$input-btn-padding-y-sm: .25rem !default;
$input-btn-padding-x-sm: .5rem !default;
$input-btn-font-size-sm: $font-size-sm !default;
-$input-btn-line-height-sm: $line-height-sm !default;
$input-btn-padding-y-lg: .5rem !default;
$input-btn-padding-x-lg: 1rem !default;
$input-btn-font-size-lg: $font-size-lg !default;
-$input-btn-line-height-lg: $line-height-lg !default;
$input-btn-border-width: $border-width !default;
@@ -443,12 +441,10 @@ $btn-line-height: $input-btn-line-height !default;
$btn-padding-y-sm: $input-btn-padding-y-sm !default;
$btn-padding-x-sm: $input-btn-padding-x-sm !default;
$btn-font-size-sm: $input-btn-font-size-sm !default;
-$btn-line-height-sm: $input-btn-line-height-sm !default;
$btn-padding-y-lg: $input-btn-padding-y-lg !default;
$btn-padding-x-lg: $input-btn-padding-x-lg !default;
$btn-font-size-lg: $input-btn-font-size-lg !default;
-$btn-line-height-lg: $input-btn-line-height-lg !default;
$btn-border-width: $input-btn-border-width !default;
@@ -487,12 +483,10 @@ $input-line-height: $input-btn-line-height !default;
$input-padding-y-sm: $input-btn-padding-y-sm !default;
$input-padding-x-sm: $input-btn-padding-x-sm !default;
$input-font-size-sm: $input-btn-font-size-sm !default;
-$input-line-height-sm: $input-btn-line-height-sm !default;
$input-padding-y-lg: $input-btn-padding-y-lg !default;
$input-padding-x-lg: $input-btn-padding-x-lg !default;
$input-font-size-lg: $input-btn-font-size-lg !default;
-$input-line-height-lg: $input-btn-line-height-lg !default;
$input-bg: $white !default;
$input-disabled-bg: $gray-200 !default;
@@ -523,8 +517,8 @@ $input-height-inner-half: calc(#{$input-line-height * .5em} + #{$i
$input-height-inner-quarter: calc(#{$input-line-height * .25em} + #{$input-padding-y / 2}) !default;
$input-height: calc(#{$input-line-height * 1em} + #{$input-padding-y * 2} + #{$input-height-border}) !default;
-$input-height-sm: calc(#{$input-line-height-sm * 1em} + #{$input-btn-padding-y-sm * 2} + #{$input-height-border}) !default;
-$input-height-lg: calc(#{$input-line-height-lg * 1em} + #{$input-btn-padding-y-lg * 2} + #{$input-height-border}) !default;
+$input-height-sm: calc(#{$input-line-height * 1em} + #{$input-btn-padding-y-sm * 2} + #{$input-height-border}) !default;
+$input-height-lg: calc(#{$input-line-height * 1em} + #{$input-btn-padding-y-lg * 2} + #{$input-height-border}) !default;
$input-transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out !default;
@@ -805,13 +799,12 @@ $dropdown-header-color: $gray-600 !default;
// Pagination
-$pagination-padding-y: .5rem !default;
+$pagination-padding-y: .375rem !default;
$pagination-padding-x: .75rem !default;
$pagination-padding-y-sm: .25rem !default;
$pagination-padding-x-sm: .5rem !default;
$pagination-padding-y-lg: .75rem !default;
$pagination-padding-x-lg: 1.5rem !default;
-$pagination-line-height: 1.25 !default;
$pagination-color: $link-color !default;
$pagination-bg: $white !default;
@@ -875,7 +868,7 @@ $tooltip-arrow-color: $tooltip-bg !default;
$form-feedback-tooltip-padding-y: $tooltip-padding-y !default;
$form-feedback-tooltip-padding-x: $tooltip-padding-x !default;
$form-feedback-tooltip-font-size: $tooltip-font-size !default;
-$form-feedback-tooltip-line-height: $line-height-base !default;
+$form-feedback-tooltip-line-height: null !default;
$form-feedback-tooltip-opacity: $tooltip-opacity !default;
$form-feedback-tooltip-border-radius: $tooltip-border-radius !default;
diff --git a/scss/forms/_form-check.scss b/scss/forms/_form-check.scss
index b5dffa04e..bd35b6b04 100644
--- a/scss/forms/_form-check.scss
+++ b/scss/forms/_form-check.scss
@@ -13,8 +13,7 @@
float: left;
width: $form-check-input-width;
height: $form-check-input-width;
- // Todo: Change static value to base line-height?
- margin-top: calc((1.5em - #{$form-check-input-width}) / 2); // line-height minus check height
+ margin-top: ($line-height-base - $form-check-input-width) / 2; // line-height minus check height
margin-left: $form-check-padding-left * -1;
background-color: $form-check-input-bg;
border: $form-check-input-border;
diff --git a/scss/forms/_form-control.scss b/scss/forms/_form-control.scss
index 209b6a56e..a9f534f03 100644
--- a/scss/forms/_form-control.scss
+++ b/scss/forms/_form-control.scss
@@ -99,7 +99,6 @@
min-height: $input-height-sm;
padding: $input-padding-y-sm $input-padding-x-sm;
@include font-size($input-font-size-sm);
- line-height: $input-line-height-sm;
@include border-radius($input-border-radius-sm);
}
@@ -107,7 +106,6 @@
min-height: $input-height-lg;
padding: $input-padding-y-lg $input-padding-x-lg;
@include font-size($input-font-size-lg);
- line-height: $input-line-height-lg;
@include border-radius($input-border-radius-lg);
}
diff --git a/scss/forms/_input-group.scss b/scss/forms/_input-group.scss
index 05eae6a49..b965f394f 100644
--- a/scss/forms/_input-group.scss
+++ b/scss/forms/_input-group.scss
@@ -139,7 +139,6 @@
.input-group-lg > .input-group-append > .btn {
padding: $input-padding-y-lg $input-padding-x-lg;
@include font-size($input-font-size-lg);
- line-height: $input-line-height-lg;
@include border-radius($input-border-radius-lg);
}
@@ -159,7 +158,6 @@
.input-group-sm > .input-group-append > .btn {
padding: $input-padding-y-sm $input-padding-x-sm;
@include font-size($input-font-size-sm);
- line-height: $input-line-height-sm;
@include border-radius($input-border-radius-sm);
}
diff --git a/scss/forms/_labels.scss b/scss/forms/_labels.scss
index 1a4ea8c5c..b4ccfa804 100644
--- a/scss/forms/_labels.scss
+++ b/scss/forms/_labels.scss
@@ -16,12 +16,10 @@
padding-top: calc(#{$input-padding-y-lg} + #{$input-border-width});
padding-bottom: calc(#{$input-padding-y-lg} + #{$input-border-width});
@include font-size($input-font-size-lg);
- line-height: $input-line-height-lg;
}
.col-form-label-sm {
padding-top: calc(#{$input-padding-y-sm} + #{$input-border-width});
padding-bottom: calc(#{$input-padding-y-sm} + #{$input-border-width});
@include font-size($input-font-size-sm);
- line-height: $input-line-height-sm;
}
diff --git a/scss/mixins/_buttons.scss b/scss/mixins/_buttons.scss
index 1c51765d2..de9c6e9b9 100644
--- a/scss/mixins/_buttons.scss
+++ b/scss/mixins/_buttons.scss
@@ -101,10 +101,9 @@
}
// Button sizes
-@mixin button-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {
padding: $padding-y $padding-x;
@include font-size($font-size);
- line-height: $line-height;
// Manually declare to provide an override to the browser default
@include border-radius($border-radius, 0);
}
diff --git a/scss/mixins/_pagination.scss b/scss/mixins/_pagination.scss
index 2c31a8cc5..52ad1e121 100644
--- a/scss/mixins/_pagination.scss
+++ b/scss/mixins/_pagination.scss
@@ -1,10 +1,9 @@
// Pagination
-@mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+@mixin pagination-size($padding-y, $padding-x, $font-size, $border-radius) {
.page-link {
padding: $padding-y $padding-x;
@include font-size($font-size);
- line-height: $line-height;
}
.page-item {
generated by cgit v1.2.3 (git 2.25.1) at 2026-06-06 05:14:13 +0000