Experiments page.
[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / utils / bourbon / library / _border-radius.scss
1 @charset "UTF-8";
2
3 /// Provides a concise, one-line method for setting `border-radius` on both the
4 /// top-left and top-right of a box.
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 concise, one-line method for setting `border-radius` on both the
25 /// top-right and bottom-right of a box.
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 concise, one-line method for setting `border-radius` on both the
46 /// bottom-left and bottom-right of a box.
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 concise, one-line method for setting `border-radius` on both the
67 /// top-left and bottom-left of a box.
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 }