mirror_css/bootstrap
1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-15 01:55:46 +02:00
Code Issues Releases Wiki Activity

Don't disallow calc()

Browse Source
This commit is contained in:
Mark Otto
2025-06-21 15:49:44 -07:00
parent 974bc43acc
commit 693e5fb2cc
15 changed files with 39 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
.stylelintrc.json
View File

@@ -13,7 +13,6 @@
"outline": "none" "outline": "none"
}, },
"function-disallowed-list": [ "function-disallowed-list": [
"calc",
"lighten", "lighten",
"darken" "darken"
], ],

2
scss/_accordion.scss
View File

@@ -55,7 +55,7 @@
&:not(.collapsed) { &:not(.collapsed) {
color: var(--#{$prefix}accordion-active-color); color: var(--#{$prefix}accordion-active-color);
background-color: var(--#{$prefix}accordion-active-bg); background-color: var(--#{$prefix}accordion-active-bg);
box-shadow: inset 0 calc(-1 * var(--#{$prefix}accordion-border-width)) 0 var(--#{$prefix}accordion-border-color); // stylelint-disable-line function-disallowed-list box-shadow: inset 0 calc(-1 * var(--#{$prefix}accordion-border-width)) 0 var(--#{$prefix}accordion-border-color);
&::after { &::after {
background-image: var(--#{$prefix}accordion-btn-active-icon); background-image: var(--#{$prefix}accordion-btn-active-icon);

4
scss/_button-group.scss
View File

@@ -44,7 +44,7 @@
// Prevent double borders when buttons are next to each other // Prevent double borders when buttons are next to each other
> :not(.btn-check:first-child) + .btn, > :not(.btn-check:first-child) + .btn,
> .btn-group:not(:first-child) { > .btn-group:not(:first-child) {
margin-left: calc(-1 * #{$btn-border-width}); // stylelint-disable-line function-disallowed-list margin-left: calc(-1 * #{$btn-border-width});
} }
// Reset rounded corners // Reset rounded corners
@@ -131,7 +131,7 @@
> .btn:not(:first-child), > .btn:not(:first-child),
> .btn-group:not(:first-child) { > .btn-group:not(:first-child) {
margin-top: calc(-1 * #{$btn-border-width}); // stylelint-disable-line function-disallowed-list margin-top: calc(-1 * #{$btn-border-width});
} }
// Reset rounded corners // Reset rounded corners

12
scss/_card.scss
View File

@@ -86,7 +86,7 @@
} }
.card-subtitle { .card-subtitle {
margin-top: calc(-.5 * var(--#{$prefix}card-title-spacer-y)); // stylelint-disable-line function-disallowed-list margin-top: calc(-.5 * var(--#{$prefix}card-title-spacer-y));
margin-bottom: 0; margin-bottom: 0;
color: var(--#{$prefix}card-subtitle-color); color: var(--#{$prefix}card-subtitle-color);
} }
@@ -138,9 +138,9 @@
// //
.card-header-tabs { .card-header-tabs {
margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x));
margin-bottom: calc(-1 * var(--#{$prefix}card-cap-padding-y)); // stylelint-disable-line function-disallowed-list margin-bottom: calc(-1 * var(--#{$prefix}card-cap-padding-y));
margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x));
border-bottom: 0; border-bottom: 0;
.nav-link.active { .nav-link.active {
@@ -150,8 +150,8 @@
} }
.card-header-pills { .card-header-pills {
margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list margin-right: calc(-.5 * var(--#{$prefix}card-cap-padding-x));
margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x)); // stylelint-disable-line function-disallowed-list margin-left: calc(-.5 * var(--#{$prefix}card-cap-padding-x));
} }
// Card image // Card image

4
scss/_list-group.scss
View File

@@ -92,7 +92,7 @@
border-top-width: 0; border-top-width: 0;
&.active { &.active {
margin-top: calc(-1 * var(--#{$prefix}list-group-border-width)); // stylelint-disable-line function-disallowed-list margin-top: calc(-1 * var(--#{$prefix}list-group-border-width));
border-top-width: var(--#{$prefix}list-group-border-width); border-top-width: var(--#{$prefix}list-group-border-width);
} }
} }
@@ -156,7 +156,7 @@
border-left-width: 0; border-left-width: 0;
&.active { &.active {
margin-left: calc(-1 * var(--#{$prefix}list-group-border-width)); // stylelint-disable-line function-disallowed-list margin-left: calc(-1 * var(--#{$prefix}list-group-border-width));
border-left-width: var(--#{$prefix}list-group-border-width); border-left-width: var(--#{$prefix}list-group-border-width);
} }
} }

2
scss/_modal.scss
View File

@@ -9,8 +9,6 @@
@use "vendor/rfs" as *; @use "vendor/rfs" as *;
@use "layout/breakpoints" as *; @use "layout/breakpoints" as *;
// stylelint-disable function-disallowed-list
// .modal-open - body class for killing the scroll // .modal-open - body class for killing the scroll
// .modal - container to scroll within // .modal - container to scroll within
// .modal-dialog - positioning shell for the actual modal // .modal-dialog - positioning shell for the actual modal

4
scss/_nav.scss
View File

@@ -77,7 +77,7 @@
border-bottom: var(--#{$prefix}nav-tabs-border-width) solid var(--#{$prefix}nav-tabs-border-color); border-bottom: var(--#{$prefix}nav-tabs-border-width) solid var(--#{$prefix}nav-tabs-border-color);
.nav-link { .nav-link {
margin-bottom: calc(-1 * var(--#{$prefix}nav-tabs-border-width)); // stylelint-disable-line function-disallowed-list margin-bottom: calc(-1 * var(--#{$prefix}nav-tabs-border-width));
border: var(--#{$prefix}nav-tabs-border-width) solid transparent; border: var(--#{$prefix}nav-tabs-border-width) solid transparent;
@include border-top-radius(var(--#{$prefix}nav-tabs-border-radius)); @include border-top-radius(var(--#{$prefix}nav-tabs-border-radius));
@@ -98,7 +98,7 @@
.dropdown-menu { .dropdown-menu {
// Make dropdown border overlap tab border // Make dropdown border overlap tab border
margin-top: calc(-1 * var(--#{$prefix}nav-tabs-border-width)); // stylelint-disable-line function-disallowed-list margin-top: calc(-1 * var(--#{$prefix}nav-tabs-border-width));
// Remove the top rounded corners here since there is a hard edge above the menu // Remove the top rounded corners here since there is a hard edge above the menu
@include border-top-radius(0); @include border-top-radius(0);
} }

2
scss/_offcanvas.scss
View File

@@ -6,8 +6,6 @@
@use "mixins/backdrop" as *; @use "mixins/backdrop" as *;
@use "layout/breakpoints" as *; @use "layout/breakpoints" as *;
// stylelint-disable function-disallowed-list
%offcanvas-css-vars { %offcanvas-css-vars {
// scss-docs-start offcanvas-css-vars // scss-docs-start offcanvas-css-vars
--#{$prefix}offcanvas-zindex: #{$zindex-offcanvas}; --#{$prefix}offcanvas-zindex: #{$zindex-offcanvas};

18
scss/_popover.scss
View File

@@ -63,11 +63,11 @@
.bs-popover-top { .bs-popover-top {
> .popover-arrow { > .popover-arrow {
bottom: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list bottom: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width));
&::before, &::before,
&::after { &::after {
border-width: var(--#{$prefix}popover-arrow-height) calc(var(--#{$prefix}popover-arrow-width) * .5) 0; // stylelint-disable-line function-disallowed-list border-width: var(--#{$prefix}popover-arrow-height) calc(var(--#{$prefix}popover-arrow-width) * .5) 0;
} }
&::before { &::before {
@@ -85,13 +85,13 @@
/* rtl:begin:ignore */ /* rtl:begin:ignore */
.bs-popover-end { .bs-popover-end {
> .popover-arrow { > .popover-arrow {
left: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list left: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width));
width: var(--#{$prefix}popover-arrow-height); width: var(--#{$prefix}popover-arrow-height);
height: var(--#{$prefix}popover-arrow-width); height: var(--#{$prefix}popover-arrow-width);
&::before, &::before,
&::after { &::after {
border-width: calc(var(--#{$prefix}popover-arrow-width) * .5) var(--#{$prefix}popover-arrow-height) calc(var(--#{$prefix}popover-arrow-width) * .5) 0; // stylelint-disable-line function-disallowed-list border-width: calc(var(--#{$prefix}popover-arrow-width) * .5) var(--#{$prefix}popover-arrow-height) calc(var(--#{$prefix}popover-arrow-width) * .5) 0;
} }
&::before { &::before {
@@ -110,11 +110,11 @@
.bs-popover-bottom { .bs-popover-bottom {
> .popover-arrow { > .popover-arrow {
top: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list top: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width));
&::before, &::before,
&::after { &::after {
border-width: 0 calc(var(--#{$prefix}popover-arrow-width) * .5) var(--#{$prefix}popover-arrow-height); // stylelint-disable-line function-disallowed-list border-width: 0 calc(var(--#{$prefix}popover-arrow-width) * .5) var(--#{$prefix}popover-arrow-height);
} }
&::before { &::before {
@@ -135,7 +135,7 @@
left: 50%; left: 50%;
display: block; display: block;
width: var(--#{$prefix}popover-arrow-width); width: var(--#{$prefix}popover-arrow-width);
margin-left: calc(-.5 * var(--#{$prefix}popover-arrow-width)); // stylelint-disable-line function-disallowed-list margin-left: calc(-.5 * var(--#{$prefix}popover-arrow-width));
content: ""; content: "";
border-bottom: var(--#{$prefix}popover-border-width) solid var(--#{$prefix}popover-header-bg); border-bottom: var(--#{$prefix}popover-border-width) solid var(--#{$prefix}popover-header-bg);
} }
@@ -144,13 +144,13 @@
/* rtl:begin:ignore */ /* rtl:begin:ignore */
.bs-popover-start { .bs-popover-start {
> .popover-arrow { > .popover-arrow {
right: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width)); // stylelint-disable-line function-disallowed-list right: calc(-1 * (var(--#{$prefix}popover-arrow-height)) - var(--#{$prefix}popover-border-width));
width: var(--#{$prefix}popover-arrow-height); width: var(--#{$prefix}popover-arrow-height);
height: var(--#{$prefix}popover-arrow-width); height: var(--#{$prefix}popover-arrow-width);
&::before, &::before,
&::after { &::after {
border-width: calc(var(--#{$prefix}popover-arrow-width) * .5) 0 calc(var(--#{$prefix}popover-arrow-width) * .5) var(--#{$prefix}popover-arrow-height); // stylelint-disable-line function-disallowed-list border-width: calc(var(--#{$prefix}popover-arrow-width) * .5) 0 calc(var(--#{$prefix}popover-arrow-width) * .5) var(--#{$prefix}popover-arrow-height);
} }
&::before { &::before {

2
scss/_toasts.scss
View File

@@ -67,7 +67,7 @@
@include border-top-radius(calc(var(--#{$prefix}toast-border-radius) - var(--#{$prefix}toast-border-width))); @include border-top-radius(calc(var(--#{$prefix}toast-border-radius) - var(--#{$prefix}toast-border-width)));
.btn-close { .btn-close {
margin-right: calc(-.5 * var(--#{$prefix}toast-padding-x)); // stylelint-disable-line function-disallowed-list margin-right: calc(-.5 * var(--#{$prefix}toast-padding-x));
margin-left: var(--#{$prefix}toast-padding-x); margin-left: var(--#{$prefix}toast-padding-x);
} }
} }

16
scss/_tooltip.scss
View File

@@ -51,24 +51,24 @@
} }
.bs-tooltip-top .tooltip-arrow { .bs-tooltip-top .tooltip-arrow {
bottom: calc(-1 * var(--#{$prefix}tooltip-arrow-height)); // stylelint-disable-line function-disallowed-list bottom: calc(-1 * var(--#{$prefix}tooltip-arrow-height));
&::before { &::before {
top: -1px; top: -1px;
border-width: var(--#{$prefix}tooltip-arrow-height) calc(var(--#{$prefix}tooltip-arrow-width) * .5) 0; // stylelint-disable-line function-disallowed-list border-width: var(--#{$prefix}tooltip-arrow-height) calc(var(--#{$prefix}tooltip-arrow-width) * .5) 0;
border-top-color: var(--#{$prefix}tooltip-bg); border-top-color: var(--#{$prefix}tooltip-bg);
} }
} }
/* rtl:begin:ignore */ /* rtl:begin:ignore */
.bs-tooltip-end .tooltip-arrow { .bs-tooltip-end .tooltip-arrow {
left: calc(-1 * var(--#{$prefix}tooltip-arrow-height)); // stylelint-disable-line function-disallowed-list left: calc(-1 * var(--#{$prefix}tooltip-arrow-height));
width: var(--#{$prefix}tooltip-arrow-height); width: var(--#{$prefix}tooltip-arrow-height);
height: var(--#{$prefix}tooltip-arrow-width); height: var(--#{$prefix}tooltip-arrow-width);
&::before { &::before {
right: -1px; right: -1px;
border-width: calc(var(--#{$prefix}tooltip-arrow-width) * .5) var(--#{$prefix}tooltip-arrow-height) calc(var(--#{$prefix}tooltip-arrow-width) * .5) 0; // stylelint-disable-line function-disallowed-list border-width: calc(var(--#{$prefix}tooltip-arrow-width) * .5) var(--#{$prefix}tooltip-arrow-height) calc(var(--#{$prefix}tooltip-arrow-width) * .5) 0;
border-right-color: var(--#{$prefix}tooltip-bg); border-right-color: var(--#{$prefix}tooltip-bg);
} }
} }
@@ -76,24 +76,24 @@
/* rtl:end:ignore */ /* rtl:end:ignore */
.bs-tooltip-bottom .tooltip-arrow { .bs-tooltip-bottom .tooltip-arrow {
top: calc(-1 * var(--#{$prefix}tooltip-arrow-height)); // stylelint-disable-line function-disallowed-list top: calc(-1 * var(--#{$prefix}tooltip-arrow-height));
&::before { &::before {
bottom: -1px; bottom: -1px;
border-width: 0 calc(var(--#{$prefix}tooltip-arrow-width) * .5) var(--#{$prefix}tooltip-arrow-height); // stylelint-disable-line function-disallowed-list border-width: 0 calc(var(--#{$prefix}tooltip-arrow-width) * .5) var(--#{$prefix}tooltip-arrow-height);
border-bottom-color: var(--#{$prefix}tooltip-bg); border-bottom-color: var(--#{$prefix}tooltip-bg);
} }
} }
/* rtl:begin:ignore */ /* rtl:begin:ignore */
.bs-tooltip-start .tooltip-arrow { .bs-tooltip-start .tooltip-arrow {
right: calc(-1 * var(--#{$prefix}tooltip-arrow-height)); // stylelint-disable-line function-disallowed-list right: calc(-1 * var(--#{$prefix}tooltip-arrow-height));
width: var(--#{$prefix}tooltip-arrow-height); width: var(--#{$prefix}tooltip-arrow-height);
height: var(--#{$prefix}tooltip-arrow-width); height: var(--#{$prefix}tooltip-arrow-width);
&::before { &::before {
left: -1px; left: -1px;
border-width: calc(var(--#{$prefix}tooltip-arrow-width) * .5) 0 calc(var(--#{$prefix}tooltip-arrow-width) * .5) var(--#{$prefix}tooltip-arrow-height); // stylelint-disable-line function-disallowed-list border-width: calc(var(--#{$prefix}tooltip-arrow-width) * .5) 0 calc(var(--#{$prefix}tooltip-arrow-width) * .5) var(--#{$prefix}tooltip-arrow-height);
border-left-color: var(--#{$prefix}tooltip-bg); border-left-color: var(--#{$prefix}tooltip-bg);
} }
} }

8
scss/_variables.scss
View File

@@ -636,7 +636,7 @@ $input-focus-box-shadow: $input-btn-focus-box-shadow !default;
$input-placeholder-color: var(--#{$prefix}secondary-color) !default; $input-placeholder-color: var(--#{$prefix}secondary-color) !default;
$input-plaintext-color: var(--#{$prefix}body-color) !default; $input-plaintext-color: var(--#{$prefix}body-color) !default;
$input-height-border: calc(#{$input-border-width} * 2) !default; // stylelint-disable-line function-disallowed-list $input-height-border: calc(#{$input-border-width} * 2) !default;
$input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default; $input-height-inner: add($input-line-height * 1em, $input-padding-y * 2) !default;
$input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default; $input-height-inner-half: add($input-line-height * .5em, $input-padding-y) !default;
@@ -961,7 +961,7 @@ $dropdown-bg: var(--#{$prefix}body-bg) !default;
$dropdown-border-color: var(--#{$prefix}border-color-translucent) !default; $dropdown-border-color: var(--#{$prefix}border-color-translucent) !default;
$dropdown-border-radius: var(--#{$prefix}border-radius) !default; $dropdown-border-radius: var(--#{$prefix}border-radius) !default;
$dropdown-border-width: var(--#{$prefix}border-width) !default; $dropdown-border-width: var(--#{$prefix}border-width) !default;
$dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default; // stylelint-disable-line function-disallowed-list $dropdown-inner-border-radius: calc(#{$dropdown-border-radius} - #{$dropdown-border-width}) !default;
$dropdown-divider-bg: $dropdown-border-color !default; $dropdown-divider-bg: $dropdown-border-color !default;
$dropdown-divider-margin-y: $spacer * .5 !default; $dropdown-divider-margin-y: $spacer * .5 !default;
$dropdown-box-shadow: var(--#{$prefix}box-shadow) !default; $dropdown-box-shadow: var(--#{$prefix}box-shadow) !default;
@@ -1018,7 +1018,7 @@ $pagination-color: var(--#{$prefix}link-color) !default;
$pagination-bg: var(--#{$prefix}body-bg) !default; $pagination-bg: var(--#{$prefix}body-bg) !default;
$pagination-border-radius: var(--#{$prefix}border-radius) !default; $pagination-border-radius: var(--#{$prefix}border-radius) !default;
$pagination-border-width: var(--#{$prefix}border-width) !default; $pagination-border-width: var(--#{$prefix}border-width) !default;
$pagination-margin-start: calc(-1 * #{$pagination-border-width}) !default; // stylelint-disable-line function-disallowed-list $pagination-margin-start: calc(-1 * #{$pagination-border-width}) !default;
$pagination-border-color: var(--#{$prefix}border-color) !default; $pagination-border-color: var(--#{$prefix}border-color) !default;
$pagination-focus-color: var(--#{$prefix}link-hover-color) !default; $pagination-focus-color: var(--#{$prefix}link-hover-color) !default;
@@ -1154,7 +1154,7 @@ $popover-max-width: 276px !default;
$popover-border-width: var(--#{$prefix}border-width) !default; $popover-border-width: var(--#{$prefix}border-width) !default;
$popover-border-color: var(--#{$prefix}border-color-translucent) !default; $popover-border-color: var(--#{$prefix}border-color-translucent) !default;
$popover-border-radius: var(--#{$prefix}border-radius-lg) !default; $popover-border-radius: var(--#{$prefix}border-radius-lg) !default;
$popover-inner-border-radius: calc(#{$popover-border-radius} - #{$popover-border-width}) !default; // stylelint-disable-line function-disallowed-list $popover-inner-border-radius: calc(#{$popover-border-radius} - #{$popover-border-width}) !default;
$popover-box-shadow: var(--#{$prefix}box-shadow) !default; $popover-box-shadow: var(--#{$prefix}box-shadow) !default;
$popover-header-font-size: $font-size-base !default; $popover-header-font-size: $font-size-base !default;

2
scss/content/_tables.scss
View File

@@ -83,7 +83,7 @@
} }
.table-group-divider { .table-group-divider {
border-top: calc(#{$table-border-width} * 2) solid $table-group-separator-color; // stylelint-disable-line function-disallowed-list border-top: calc(#{$table-border-width} * 2) solid $table-group-separator-color;
} }
// //

2
scss/forms/_input-group.scss
View File

@@ -127,7 +127,7 @@
} }
> :not(:first-child):not(.dropdown-menu)#{$validation-messages} { > :not(:first-child):not(.dropdown-menu)#{$validation-messages} {
margin-left: calc(-1 * #{$input-border-width}); // stylelint-disable-line function-disallowed-list margin-left: calc(-1 * #{$input-border-width});
@include border-start-radius(0); @include border-start-radius(0);
} }

4
scss/layout/_containers.scss
View File

@@ -10,8 +10,8 @@
--#{$prefix}gutter-x: #{$gutter}; --#{$prefix}gutter-x: #{$gutter};
--#{$prefix}gutter-y: 0; --#{$prefix}gutter-y: 0;
width: 100%; width: 100%;
padding-right: calc(var(--#{$prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list padding-right: calc(var(--#{$prefix}gutter-x) * .5);
padding-left: calc(var(--#{$prefix}gutter-x) * .5); // stylelint-disable-line function-disallowed-list padding-left: calc(var(--#{$prefix}gutter-x) * .5);
margin-right: auto; margin-right: auto;
margin-left: auto; margin-left: auto;
} }