comparison default/assets/scss/vendors/bourbon/library/_border-radius.scss @ 0:1d038bc9b3d2 default tip

Up:default
author Liny <dev@neowd.com>
date Sat, 31 May 2025 09:21:51 +0800
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:1d038bc9b3d2
1 @charset "UTF-8";
2
3 /// Provides a shorthand syntax to add `border-radius` to both the top-left and
4 /// top-right of an element.
5 ///
6 /// @argument {number (with unit)} $radii
7 ///
8 /// @example scss
9 /// .element {
10 /// @include border-top-radius(4px);
11 /// }
12 ///
13 /// // CSS Output
14 /// .element {
15 /// border-top-left-radius: 4px;
16 /// border-top-right-radius: 4px;
17 /// }
18
19 @mixin border-top-radius($radii) {
20 border-top-left-radius: $radii;
21 border-top-right-radius: $radii;
22 }
23
24 /// Provides a shorthand syntax to add `border-radius` to both the top-right and
25 /// bottom-right of an element.
26 ///
27 /// @argument {number (with unit)} $radii
28 ///
29 /// @example scss
30 /// .element {
31 /// @include border-right-radius(3px);
32 /// }
33 ///
34 /// // CSS Output
35 /// .element {
36 /// border-bottom-right-radius: 3px;
37 /// border-top-right-radius: 3px;
38 /// }
39
40 @mixin border-right-radius($radii) {
41 border-bottom-right-radius: $radii;
42 border-top-right-radius: $radii;
43 }
44
45 /// Provides a shorthand syntax to add `border-radius` to both the bottom-left
46 /// and bottom-right of an element.
47 ///
48 /// @argument {number (with unit)} $radii
49 ///
50 /// @example scss
51 /// .element {
52 /// @include border-bottom-radius(2px);
53 /// }
54 ///
55 /// // CSS Output
56 /// .element {
57 /// border-bottom-left-radius: 2px;
58 /// border-bottom-right-radius: 2px;
59 /// }
60
61 @mixin border-bottom-radius($radii) {
62 border-bottom-left-radius: $radii;
63 border-bottom-right-radius: $radii;
64 }
65
66 /// Provides a shorthand syntax to add `border-radius` to both the top-left
67 /// and bottom-left of an element.
68 ///
69 /// @argument {number (with unit)} $radii
70 ///
71 /// @example scss
72 /// .element {
73 /// @include border-left-radius(1px);
74 /// }
75 ///
76 /// // CSS Output
77 /// .element {
78 /// border-bottom-left-radius: 1px;
79 /// border-top-left-radius: 1px;
80 /// }
81
82 @mixin border-left-radius($radii) {
83 border-bottom-left-radius: $radii;
84 border-top-left-radius: $radii;
85 }