Mercurial > nebulaweb3
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 } |