1
0
Fork 0
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:
Martijn Cuppens 2018-12-23 08:11:11 +01:00 committed by XhmikosR
parent 6a5a1b073d
commit 39b14c9806
14 changed files with 40 additions and 35 deletions

View file

@ -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",

View file

@ -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 {

View file

@ -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;

View file

@ -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);

View file

@ -297,6 +297,7 @@ label {
//
// Details at https://github.com/twbs/bootstrap/issues/24093
button {
// stylelint-disable-next-line property-blacklist
border-radius: 0;
}

View file

@ -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;

View file

@ -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) {

View file

@ -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);
}

View file

@ -1,4 +1,4 @@
// stylelint-disable declaration-no-important
// stylelint-disable property-blacklist, declaration-no-important
//
// Border

View file

@ -23,7 +23,7 @@
@include media-breakpoint-up(sm) {
max-width: 330px;
border-radius: 4px;
@include border-radius(4px);
}
}

View file

@ -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;

View file

@ -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 {

View file

@ -28,7 +28,7 @@
cursor: pointer;
background-color: transparent;
border: 0;
border-radius: .25rem;
@include border-radius;
&:hover {
color: $white;

View file

@ -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 {