|
0
|
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 }
|
