mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Blacklist border-radius property (use mixin instead) (#27900)
This commit is contained in:
parent
6a5a1b073d
commit
39b14c9806
14 changed files with 40 additions and 35 deletions
|
@ -261,7 +261,14 @@
|
|||
"fill",
|
||||
"stroke"
|
||||
],
|
||||
"property-blacklist": ["transition"],
|
||||
"property-blacklist": [
|
||||
"border-radius",
|
||||
"border-top-left-radius",
|
||||
"border-top-right-radius",
|
||||
"border-bottom-right-radius",
|
||||
"border-bottom-left-radius",
|
||||
"transition"
|
||||
],
|
||||
"property-no-vendor-prefix": true,
|
||||
"rule-empty-line-before": null,
|
||||
"scss/at-function-named-arguments": "never",
|
||||
|
|
|
@ -200,10 +200,12 @@
|
|||
|
||||
.card-img-top,
|
||||
.card-header {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-top-right-radius: 0;
|
||||
}
|
||||
.card-img-bottom,
|
||||
.card-footer {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-bottom-right-radius: 0;
|
||||
}
|
||||
}
|
||||
|
@ -213,10 +215,12 @@
|
|||
|
||||
.card-img-top,
|
||||
.card-header {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-top-left-radius: 0;
|
||||
}
|
||||
.card-img-bottom,
|
||||
.card-footer {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-bottom-left-radius: 0;
|
||||
}
|
||||
}
|
||||
|
@ -283,24 +287,22 @@
|
|||
|
||||
&:not(:first-of-type) {
|
||||
.card-header:first-child {
|
||||
border-radius: 0;
|
||||
@include border-radius(0);
|
||||
}
|
||||
|
||||
&:not(:last-of-type) {
|
||||
border-bottom: 0;
|
||||
border-radius: 0;
|
||||
@include border-radius(0);
|
||||
}
|
||||
}
|
||||
|
||||
&:first-of-type {
|
||||
border-bottom: 0;
|
||||
border-bottom-right-radius: 0;
|
||||
border-bottom-left-radius: 0;
|
||||
@include border-bottom-radius(0);
|
||||
}
|
||||
|
||||
&:last-of-type {
|
||||
border-top-left-radius: 0;
|
||||
border-top-right-radius: 0;
|
||||
@include border-top-radius(0);
|
||||
}
|
||||
|
||||
.card-header {
|
||||
|
|
|
@ -144,6 +144,7 @@
|
|||
|
||||
.custom-radio {
|
||||
.custom-control-label::before {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-radius: $custom-radio-indicator-border-radius;
|
||||
}
|
||||
|
||||
|
@ -173,6 +174,7 @@
|
|||
left: -($custom-switch-width + $custom-control-gutter);
|
||||
width: $custom-switch-width;
|
||||
pointer-events: all;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-radius: $custom-switch-indicator-border-radius;
|
||||
}
|
||||
|
||||
|
@ -182,6 +184,7 @@
|
|||
width: $custom-switch-indicator-size;
|
||||
height: $custom-switch-indicator-size;
|
||||
background-color: $custom-control-indicator-border-color;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-radius: $custom-switch-indicator-border-radius;
|
||||
@include transition(transform .15s ease-in-out, $custom-forms-transition);
|
||||
}
|
||||
|
@ -220,11 +223,7 @@
|
|||
background: $custom-select-background;
|
||||
background-color: $custom-select-bg;
|
||||
border: $custom-select-border-width solid $custom-select-border-color;
|
||||
@if $enable-rounded {
|
||||
border-radius: $custom-select-border-radius;
|
||||
} @else {
|
||||
border-radius: 0;
|
||||
}
|
||||
@include border-radius($custom-select-border-radius, 0);
|
||||
@include box-shadow($custom-select-box-shadow);
|
||||
appearance: none;
|
||||
|
||||
|
|
|
@ -18,13 +18,7 @@
|
|||
border: $input-border-width solid $input-border-color;
|
||||
|
||||
// Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
|
||||
@if $enable-rounded {
|
||||
// Manually use the if/else instead of the mixin to account for iOS override
|
||||
border-radius: $input-border-radius;
|
||||
} @else {
|
||||
// Otherwise undo the iOS default
|
||||
border-radius: 0;
|
||||
}
|
||||
@include border-radius($input-border-radius, 0);
|
||||
|
||||
@include box-shadow($input-box-shadow);
|
||||
@include transition($input-transition);
|
||||
|
|
|
@ -297,6 +297,7 @@ label {
|
|||
//
|
||||
// Details at https://github.com/twbs/bootstrap/issues/24093
|
||||
button {
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
|
|
|
@ -13,6 +13,7 @@
|
|||
vertical-align: text-bottom;
|
||||
border: $spinner-border-width solid currentColor;
|
||||
border-right-color: transparent;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-radius: 50%;
|
||||
animation: spinner-border .75s linear infinite;
|
||||
}
|
||||
|
@ -42,6 +43,7 @@
|
|||
height: $spinner-height;
|
||||
vertical-align: text-bottom;
|
||||
background-color: currentColor;
|
||||
// stylelint-disable-next-line property-blacklist
|
||||
border-radius: 50%;
|
||||
opacity: 0;
|
||||
animation: spinner-grow .75s linear infinite;
|
||||
|
|
|
@ -1,9 +1,13 @@
|
|||
// stylelint-disable property-blacklist
|
||||
// Single side border-radius
|
||||
|
||||
@mixin border-radius($radius: $border-radius) {
|
||||
@mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
|
||||
@if $enable-rounded {
|
||||
border-radius: $radius;
|
||||
}
|
||||
@else if $fallback-border-radius != false {
|
||||
border-radius: $fallback-border-radius;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin border-top-radius($radius) {
|
||||
|
|
|
@ -103,9 +103,5 @@
|
|||
font-size: $font-size;
|
||||
line-height: $line-height;
|
||||
// Manually declare to provide an override to the browser default
|
||||
@if $enable-rounded {
|
||||
border-radius: $border-radius;
|
||||
} @else {
|
||||
border-radius: 0;
|
||||
}
|
||||
@include border-radius($border-radius, 0);
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
// stylelint-disable declaration-no-important
|
||||
// stylelint-disable property-blacklist, declaration-no-important
|
||||
|
||||
//
|
||||
// Border
|
||||
|
|
|
@ -23,7 +23,7 @@
|
|||
|
||||
@include media-breakpoint-up(sm) {
|
||||
max-width: 330px;
|
||||
border-radius: 4px;
|
||||
@include border-radius(4px);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -10,7 +10,7 @@
|
|||
overflow: hidden;
|
||||
color: $bd-purple;
|
||||
background-color: #f9f9f9;
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
|
||||
.inverse {
|
||||
color: $white;
|
||||
|
@ -79,7 +79,7 @@
|
|||
height: 4rem;
|
||||
margin-right: .25rem;
|
||||
margin-left: .25rem;
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
|
||||
@include media-breakpoint-up(md) {
|
||||
width: 6rem;
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
margin-bottom: 1.25rem;
|
||||
border: 1px solid #eee;
|
||||
border-left-width: .25rem;
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
|
||||
h4 {
|
||||
margin-top: 0;
|
||||
|
@ -20,7 +20,7 @@
|
|||
}
|
||||
|
||||
code {
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
}
|
||||
|
||||
+ .bd-callout {
|
||||
|
|
|
@ -28,7 +28,7 @@
|
|||
cursor: pointer;
|
||||
background-color: transparent;
|
||||
border: 0;
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
|
||||
&:hover {
|
||||
color: $white;
|
||||
|
|
|
@ -87,7 +87,7 @@
|
|||
height: 3rem;
|
||||
margin-bottom: .5rem;
|
||||
background-color: lighten($blue, 50%);
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
}
|
||||
|
||||
.bd-example-container-sidebar {
|
||||
|
@ -95,14 +95,14 @@
|
|||
width: 4rem;
|
||||
height: 8rem;
|
||||
background-color: lighten($blue, 25%);
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
}
|
||||
|
||||
.bd-example-container-body {
|
||||
height: 8rem;
|
||||
margin-right: 4.5rem;
|
||||
background-color: lighten($bd-purple, 25%);
|
||||
border-radius: .25rem;
|
||||
@include border-radius;
|
||||
}
|
||||
|
||||
.bd-example-container-fluid {
|
||||
|
|
Loading…
Reference in a new issue