File tree Expand file tree Collapse file tree 1 file changed +45
-0
lines changed Expand file tree Collapse file tree 1 file changed +45
-0
lines changed Original file line number Diff line number Diff line change
1
+ <===> input.scss
2
+ $config: (
3
+ phone: (
4
+ break-point-width:0px,
5
+ break-point-name: xs
6
+ ),
7
+ tablet: (
8
+ break-point-width:600px,
9
+ break-point-name: sm
10
+ ),
11
+ laptop: (
12
+ break-point-width:900px,
13
+ break-point-name: md
14
+ ),
15
+ desktop: (
16
+ break-point-width:1200px,
17
+ break-point-name:lg
18
+ ),
19
+ );
20
+
21
+ @each $key, $map in $config {
22
+ $break-point-width: map_get($map, break-point-width);
23
+ $break-point-name: map_get($map, break-point-name);
24
+ $infix: if($break-point-width == 0px, null, -$break-point-name);
25
+ .foo#{$infix} {
26
+ content: '#{$break-point-name}';
27
+ }
28
+ }
29
+
30
+ <===> output.css
31
+ .foo {
32
+ content: "xs";
33
+ }
34
+
35
+ .foo-sm {
36
+ content: "sm";
37
+ }
38
+
39
+ .foo-md {
40
+ content: "md";
41
+ }
42
+
43
+ .foo-lg {
44
+ content: "lg";
45
+ }
You can’t perform that action at this time.
0 commit comments