1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-08-21 12:51:52 +02:00

Add default parameters to each border radius mixin (#31571)

* Add default parameters to each border radius mixin

* Add border radius changes to migration guide

Co-authored-by: Jeremy Jackson <jeremy@librarymarket.com>
This commit is contained in:
Jeremy Jackson
2020-09-01 21:17:17 +00:00
committed by GitHub
parent 613a5e47f3
commit 1503aa18d1
2 changed files with 9 additions and 8 deletions

View File

@@ -23,53 +23,53 @@
} }
} }
@mixin border-top-radius($radius) { @mixin border-top-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-top-left-radius: valid-radius($radius); border-top-left-radius: valid-radius($radius);
border-top-right-radius: valid-radius($radius); border-top-right-radius: valid-radius($radius);
} }
} }
@mixin border-right-radius($radius) { @mixin border-right-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-top-right-radius: valid-radius($radius); border-top-right-radius: valid-radius($radius);
border-bottom-right-radius: valid-radius($radius); border-bottom-right-radius: valid-radius($radius);
} }
} }
@mixin border-bottom-radius($radius) { @mixin border-bottom-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-bottom-right-radius: valid-radius($radius); border-bottom-right-radius: valid-radius($radius);
border-bottom-left-radius: valid-radius($radius); border-bottom-left-radius: valid-radius($radius);
} }
} }
@mixin border-left-radius($radius) { @mixin border-left-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-top-left-radius: valid-radius($radius); border-top-left-radius: valid-radius($radius);
border-bottom-left-radius: valid-radius($radius); border-bottom-left-radius: valid-radius($radius);
} }
} }
@mixin border-top-left-radius($radius) { @mixin border-top-left-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-top-left-radius: valid-radius($radius); border-top-left-radius: valid-radius($radius);
} }
} }
@mixin border-top-right-radius($radius) { @mixin border-top-right-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-top-right-radius: valid-radius($radius); border-top-right-radius: valid-radius($radius);
} }
} }
@mixin border-bottom-right-radius($radius) { @mixin border-bottom-right-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-bottom-right-radius: valid-radius($radius); border-bottom-right-radius: valid-radius($radius);
} }
} }
@mixin border-bottom-left-radius($radius) { @mixin border-bottom-left-radius($radius: $border-radius) {
@if $enable-rounded { @if $enable-rounded {
border-bottom-left-radius: valid-radius($radius); border-bottom-left-radius: valid-radius($radius);
} }

View File

@@ -111,6 +111,7 @@ Changes to our source Sass files and compiled CSS.
- The `media-breakpoint-down()` uses the breakpoint itself instead of the next breakpoint. Use `media-breakpoint-down(lg)` instead of `media-breakpoint-down(md)` to target viewports smaller than the `lg` breakpoint. - The `media-breakpoint-down()` uses the breakpoint itself instead of the next breakpoint. Use `media-breakpoint-down(lg)` instead of `media-breakpoint-down(md)` to target viewports smaller than the `lg` breakpoint.
- The `media-breakpoint-between()` mixin's second parameter also uses the breakpoint itself instead of the next breakpoint. Use `media-between(sm, lg)` instead of `media-breakpoint-between(sm, md)` to target viewports between the `sm` and `lg` breakpoints. - The `media-breakpoint-between()` mixin's second parameter also uses the breakpoint itself instead of the next breakpoint. Use `media-between(sm, lg)` instead of `media-breakpoint-between(sm, md)` to target viewports between the `sm` and `lg` breakpoints.
- The `box-shadow()` mixin now better supports `none` and `null` with multiple arguments. Now you can pass multiple arguements with either value, and get the expected output. [See #30394](https://github.com/twbs/bootstrap/pull/30394). - The `box-shadow()` mixin now better supports `none` and `null` with multiple arguments. Now you can pass multiple arguements with either value, and get the expected output. [See #30394](https://github.com/twbs/bootstrap/pull/30394).
- Each `border-radius()` mixin now has a default value. You can now call these mixins without specifying a border radius value and the `$border-radius` variable will be used. [See #31571](https://github.com/twbs/bootstrap/pull/31571)
### JavaScript ### JavaScript