_border-radius.scss 2.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. // stylelint-disable property-disallowed-list
  2. // Single side border-radius
  3. // Helper function to replace negative values with 0
  4. @function valid-radius($radius) {
  5. $return: ();
  6. @each $value in $radius {
  7. @if type-of($value) == number {
  8. $return: append($return, max($value, 0));
  9. } @else {
  10. $return: append($return, $value);
  11. }
  12. }
  13. @return $return;
  14. }
  15. // scss-docs-start border-radius-mixins
  16. @mixin border-radius($radius: $border-radius, $fallback-border-radius: false) {
  17. @if $enable-rounded {
  18. border-radius: valid-radius($radius);
  19. }
  20. @else if $fallback-border-radius != false {
  21. border-radius: $fallback-border-radius;
  22. }
  23. }
  24. @mixin border-top-radius($radius: $border-radius) {
  25. @if $enable-rounded {
  26. border-top-left-radius: valid-radius($radius);
  27. border-top-right-radius: valid-radius($radius);
  28. }
  29. }
  30. @mixin border-end-radius($radius: $border-radius) {
  31. @if $enable-rounded {
  32. border-top-right-radius: valid-radius($radius);
  33. border-bottom-right-radius: valid-radius($radius);
  34. }
  35. }
  36. @mixin border-bottom-radius($radius: $border-radius) {
  37. @if $enable-rounded {
  38. border-bottom-right-radius: valid-radius($radius);
  39. border-bottom-left-radius: valid-radius($radius);
  40. }
  41. }
  42. @mixin border-start-radius($radius: $border-radius) {
  43. @if $enable-rounded {
  44. border-top-left-radius: valid-radius($radius);
  45. border-bottom-left-radius: valid-radius($radius);
  46. }
  47. }
  48. @mixin border-top-start-radius($radius: $border-radius) {
  49. @if $enable-rounded {
  50. border-top-left-radius: valid-radius($radius);
  51. }
  52. }
  53. @mixin border-top-end-radius($radius: $border-radius) {
  54. @if $enable-rounded {
  55. border-top-right-radius: valid-radius($radius);
  56. }
  57. }
  58. @mixin border-bottom-end-radius($radius: $border-radius) {
  59. @if $enable-rounded {
  60. border-bottom-right-radius: valid-radius($radius);
  61. }
  62. }
  63. @mixin border-bottom-start-radius($radius: $border-radius) {
  64. @if $enable-rounded {
  65. border-bottom-left-radius: valid-radius($radius);
  66. }
  67. }
  68. // scss-docs-end border-radius-mixins