summaryrefslogtreecommitdiffstats
path: root/src/objects/_table.scss
diff options
context:
space:
mode:
Diffstat (limited to 'src/objects/_table.scss')
-rw-r--r--src/objects/_table.scss232
1 files changed, 116 insertions, 116 deletions
diff --git a/src/objects/_table.scss b/src/objects/_table.scss
index 2b63737..9e4891d 100644
--- a/src/objects/_table.scss
+++ b/src/objects/_table.scss
@@ -7,141 +7,141 @@
7@use 'table.vars' as vars; 7@use 'table.vars' as vars;
8 8
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 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 bem.modifier('fixed') { 16 @include bem.modifier('fixed') {
17 table-layout: fixed; 17 table-layout: fixed;
18 } 18 }
19 19
20 @include 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);
24 font-size: props.get(vars.$heading--font-size); 24 font-size: props.get(vars.$heading--font-size);
25 font-weight: props.get(vars.$heading--font-weight); 25 font-weight: props.get(vars.$heading--font-weight);
26 color: props.get(vars.$heading-color); 26 color: props.get(vars.$heading-color);
27 text-align: start; 27 text-align: start;
28 text-transform: props.get(vars.$heading--text-transform); 28 text-transform: props.get(vars.$heading--text-transform);
29 letter-spacing: props.get(vars.$heading--letter-spacing); 29 letter-spacing: props.get(vars.$heading--letter-spacing);
30 } 30 }
31 31
32 @include 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);
36 border-style: solid; 36 border-style: solid;
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 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 bem.elem('row') { 45 @include bem.elem('row') {
46 &:last-child { 46 &:last-child {
47 @include 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 bem.modifier('flush') { 53 @include bem.modifier('flush') {
54 @include 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 }
58 58
59 &:last-child { 59 &:last-child {
60 padding-inline-end: 0; 60 padding-inline-end: 0;
61 } 61 }
62 } 62 }
63 } 63 }
64 64
65 @include bem.modifier('box') { 65 @include bem.modifier('box') {
66 @include 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 {
70 border-inline-start-width: props.get(vars.$border-width); 70 border-inline-start-width: props.get(vars.$border-width);
71 } 71 }
72 72
73 &:last-child { 73 &:last-child {
74 border-inline-end-width: props.get(vars.$border-width); 74 border-inline-end-width: props.get(vars.$border-width);
75 } 75 }
76 } 76 }
77 77
78 @include bem.elem('row') { 78 @include bem.elem('row') {
79 &:first-child { 79 &:first-child {
80 @include 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 }
84 84
85 &:last-child { 85 &:last-child {
86 border-start-end-radius: props.get(vars.$rounding); 86 border-start-end-radius: props.get(vars.$rounding);
87 } 87 }
88 } 88 }
89 } 89 }
90 90
91 &:last-child { 91 &:last-child {
92 @include 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 }
96 96
97 &:last-child { 97 &:last-child {
98 border-end-end-radius: props.get(vars.$rounding); 98 border-end-end-radius: props.get(vars.$rounding);
99 } 99 }
100 } 100 }
101 } 101 }
102 } 102 }
103 } 103 }
104 104
105 @include bem.modifier('interactive') { 105 @include bem.modifier('interactive') {
106 @include bem.elem('row') { 106 @include bem.elem('row') {
107 @include bem.elem('cell') { 107 @include bem.elem('cell') {
108 cursor: pointer; 108 cursor: pointer;
109 } 109 }
110 110
111 &:hover { 111 &:hover {
112 @include 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 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 bem.modifier('box') { 124 @include bem.modifier('box') {
125 @include bem.elem('row') { 125 @include bem.elem('row') {
126 &:hover { 126 &:hover {
127 @include 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 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 }
137 } 137 }
138 } 138 }
139 } 139 }
140 140
141 @include bem.modifier('sm') { 141 @include bem.modifier('sm') {
142 @include 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 }
146 } 146 }
147} 147}
generated by cgit v1.3.1 (git 2.54.0) at 2026-07-22 08:17:08 +0000