diff options
Diffstat (limited to 'src/objects/_table.scss')
-rw-r--r-- | src/objects/_table.scss | 52 |
1 files changed, 26 insertions, 26 deletions
diff --git a/src/objects/_table.scss b/src/objects/_table.scss index 491db20..c0a7360 100644 --- a/src/objects/_table.scss +++ b/src/objects/_table.scss | |||
@@ -1,5 +1,5 @@ | |||
1 | @use 'sass:meta'; | 1 | @use 'sass:meta'; |
2 | @use 'iro-sass/src/iro-sass' as iro; | 2 | @use 'iro-sass/src/bem' as bem; |
3 | @use 'iro-sass/src/props'; | 3 | @use 'iro-sass/src/props'; |
4 | @use '../props' as *; | 4 | @use '../props' as *; |
5 | 5 | ||
@@ -9,15 +9,15 @@ | |||
9 | @mixin styles { | 9 | @mixin styles { |
10 | @include materialize-at-root(meta.module-variables('vars')); | 10 | @include materialize-at-root(meta.module-variables('vars')); |
11 | 11 | ||
12 | @include iro.bem-object('table') { | 12 | @include bem.object('table') { |
13 | border-spacing: 0; | 13 | border-spacing: 0; |
14 | border-collapse: separate; | 14 | border-collapse: separate; |
15 | 15 | ||
16 | @include iro.bem-modifier('fixed') { | 16 | @include bem.modifier('fixed') { |
17 | table-layout: fixed; | 17 | table-layout: fixed; |
18 | } | 18 | } |
19 | 19 | ||
20 | @include iro.bem-elem('head-cell') { | 20 | @include bem.elem('head-cell') { |
21 | padding-block: props.get(vars.$pad-b); | 21 | padding-block: props.get(vars.$pad-b); |
22 | padding-inline: props.get(vars.$pad-i); | 22 | padding-inline: props.get(vars.$pad-i); |
23 | font-family: props.get(vars.$heading--font-family); | 23 | font-family: props.get(vars.$heading--font-family); |
@@ -29,7 +29,7 @@ | |||
29 | letter-spacing: props.get(vars.$heading--letter-spacing); | 29 | letter-spacing: props.get(vars.$heading--letter-spacing); |
30 | } | 30 | } |
31 | 31 | ||
32 | @include iro.bem-elem('cell') { | 32 | @include bem.elem('cell') { |
33 | padding-block: props.get(vars.$pad-b); | 33 | padding-block: props.get(vars.$pad-b); |
34 | padding-inline: props.get(vars.$pad-i); | 34 | padding-inline: props.get(vars.$pad-i); |
35 | border-color: props.get(vars.$border-color); | 35 | border-color: props.get(vars.$border-color); |
@@ -37,21 +37,21 @@ | |||
37 | border-width: 0; | 37 | border-width: 0; |
38 | border-block-start-width: props.get(vars.$border-width); | 38 | border-block-start-width: props.get(vars.$border-width); |
39 | 39 | ||
40 | @include iro.bem-modifier('divider') { | 40 | @include bem.modifier('divider') { |
41 | border-inline-end-width: props.get(vars.$border-width); | 41 | border-inline-end-width: props.get(vars.$border-width); |
42 | } | 42 | } |
43 | } | 43 | } |
44 | 44 | ||
45 | @include iro.bem-elem('row') { | 45 | @include bem.elem('row') { |
46 | &:last-child { | 46 | &:last-child { |
47 | @include iro.bem-elem('cell') { | 47 | @include bem.elem('cell') { |
48 | border-block-end-width: props.get(vars.$border-width); | 48 | border-block-end-width: props.get(vars.$border-width); |
49 | } | 49 | } |
50 | } | 50 | } |
51 | } | 51 | } |
52 | 52 | ||
53 | @include iro.bem-modifier('flush') { | 53 | @include bem.modifier('flush') { |
54 | @include iro.bem-elem('head-cell', 'cell') { | 54 | @include bem.elem('head-cell', 'cell') { |
55 | &:first-child { | 55 | &:first-child { |
56 | padding-inline-start: 0; | 56 | padding-inline-start: 0; |
57 | } | 57 | } |
@@ -62,8 +62,8 @@ | |||
62 | } | 62 | } |
63 | } | 63 | } |
64 | 64 | ||
65 | @include iro.bem-modifier('box') { | 65 | @include bem.modifier('box') { |
66 | @include iro.bem-elem('cell') { | 66 | @include bem.elem('cell') { |
67 | background-color: props.get(vars.$box--bg-color); | 67 | background-color: props.get(vars.$box--bg-color); |
68 | 68 | ||
69 | &:first-child { | 69 | &:first-child { |
@@ -75,9 +75,9 @@ | |||
75 | } | 75 | } |
76 | } | 76 | } |
77 | 77 | ||
78 | @include iro.bem-elem('row') { | 78 | @include bem.elem('row') { |
79 | &:first-child { | 79 | &:first-child { |
80 | @include iro.bem-elem('cell') { | 80 | @include bem.elem('cell') { |
81 | &:first-child { | 81 | &:first-child { |
82 | border-start-start-radius: props.get(vars.$rounding); | 82 | border-start-start-radius: props.get(vars.$rounding); |
83 | } | 83 | } |
@@ -89,7 +89,7 @@ | |||
89 | } | 89 | } |
90 | 90 | ||
91 | &:last-child { | 91 | &:last-child { |
92 | @include iro.bem-elem('cell') { | 92 | @include bem.elem('cell') { |
93 | &:first-child { | 93 | &:first-child { |
94 | border-end-start-radius: props.get(vars.$rounding); | 94 | border-end-start-radius: props.get(vars.$rounding); |
95 | } | 95 | } |
@@ -102,35 +102,35 @@ | |||
102 | } | 102 | } |
103 | } | 103 | } |
104 | 104 | ||
105 | @include iro.bem-modifier('interactive') { | 105 | @include bem.modifier('interactive') { |
106 | @include iro.bem-elem('row') { | 106 | @include bem.elem('row') { |
107 | @include iro.bem-elem('cell') { | 107 | @include bem.elem('cell') { |
108 | cursor: pointer; | 108 | cursor: pointer; |
109 | } | 109 | } |
110 | 110 | ||
111 | &:hover { | 111 | &:hover { |
112 | @include iro.bem-elem('cell') { | 112 | @include bem.elem('cell') { |
113 | background-color: props.get(vars.$hover--bg-color); | 113 | background-color: props.get(vars.$hover--bg-color); |
114 | } | 114 | } |
115 | } | 115 | } |
116 | 116 | ||
117 | &:active { | 117 | &:active { |
118 | @include iro.bem-elem('cell') { | 118 | @include bem.elem('cell') { |
119 | background-color: props.get(vars.$active--bg-color); | 119 | background-color: props.get(vars.$active--bg-color); |
120 | } | 120 | } |
121 | } | 121 | } |
122 | } | 122 | } |
123 | 123 | ||
124 | @include iro.bem-modifier('box') { | 124 | @include bem.modifier('box') { |
125 | @include iro.bem-elem('row') { | 125 | @include bem.elem('row') { |
126 | &:hover { | 126 | &:hover { |
127 | @include iro.bem-elem('cell') { | 127 | @include bem.elem('cell') { |
128 | background-color: props.get(vars.$box--hover--bg-color); | 128 | background-color: props.get(vars.$box--hover--bg-color); |
129 | } | 129 | } |
130 | } | 130 | } |
131 | 131 | ||
132 | &:active { | 132 | &:active { |
133 | @include iro.bem-elem('cell') { | 133 | @include bem.elem('cell') { |
134 | background-color: props.get(vars.$box--active--bg-color); | 134 | background-color: props.get(vars.$box--active--bg-color); |
135 | } | 135 | } |
136 | } | 136 | } |
@@ -138,8 +138,8 @@ | |||
138 | } | 138 | } |
139 | } | 139 | } |
140 | 140 | ||
141 | @include iro.bem-modifier('sm') { | 141 | @include bem.modifier('sm') { |
142 | @include iro.bem-elem('head-cell', 'cell') { | 142 | @include bem.elem('head-cell', 'cell') { |
143 | padding-block: props.get(vars.$pad-b--sm); | 143 | padding-block: props.get(vars.$pad-b--sm); |
144 | } | 144 | } |
145 | } | 145 | } |