diff options
Diffstat (limited to 'src_old/scopes/_tables.scss')
-rw-r--r-- | src_old/scopes/_tables.scss | 115 |
1 files changed, 115 insertions, 0 deletions
diff --git a/src_old/scopes/_tables.scss b/src_old/scopes/_tables.scss new file mode 100644 index 0000000..9b2124d --- /dev/null +++ b/src_old/scopes/_tables.scss | |||
@@ -0,0 +1,115 @@ | |||
1 | @use 'iro-sass/src/index' as iro; | ||
2 | @use '../functions' as fn; | ||
3 | @use '../mixins' as mx; | ||
4 | |||
5 | @include iro.props-namespace('tables') { | ||
6 | @include iro.props-store(( | ||
7 | --dims: ( | ||
8 | --pad-i: fn.foreign-dim(--table, --pad-i), | ||
9 | --pad-b: fn.foreign-dim(--table, --pad-b), | ||
10 | --rounding: fn.foreign-dim(--table, --rounding), | ||
11 | --border: fn.foreign-dim(--table, --border), | ||
12 | --margin-bs: fn.global-dim(--paragraph --margin-bs), | ||
13 | ), | ||
14 | --colors: ( | ||
15 | --border: fn.foreign-color(--table, --border), | ||
16 | --heading: fn.foreign-color(--table, --heading), | ||
17 | --box: ( | ||
18 | --bg: fn.foreign-color(--table, --box --bg), | ||
19 | ) | ||
20 | ) | ||
21 | )); | ||
22 | |||
23 | @include iro.bem-scope(iro.props-namespace()) { | ||
24 | table { | ||
25 | margin-block-start: fn.dim(--margin-bs); | ||
26 | border-spacing: 0; | ||
27 | border-collapse: separate; | ||
28 | } | ||
29 | |||
30 | th { | ||
31 | @include mx.set-font(--standard, ( | ||
32 | --line-height: null, | ||
33 | --size: fn.global-dim(--font-size --50), | ||
34 | --weight: bold, | ||
35 | --transform: uppercase, | ||
36 | --spacing: .5px | ||
37 | )); | ||
38 | |||
39 | padding-block: fn.dim(--pad-b); | ||
40 | padding-inline: fn.dim(--pad-i); | ||
41 | color: fn.color(--heading); | ||
42 | text-align: start; | ||
43 | } | ||
44 | |||
45 | td { | ||
46 | padding-block: fn.dim(--pad-b); | ||
47 | padding-inline: fn.dim(--pad-i); | ||
48 | border-width: 0; | ||
49 | border-block-start-width: fn.dim(--border); | ||
50 | border-style: solid; | ||
51 | border-color: fn.color(--border); | ||
52 | } | ||
53 | |||
54 | tr { | ||
55 | &:last-child { | ||
56 | td { | ||
57 | border-block-end-width: fn.dim(--border); | ||
58 | } | ||
59 | } | ||
60 | } | ||
61 | |||
62 | @include iro.bem-modifier('flush') { | ||
63 | th, | ||
64 | td { | ||
65 | &:first-child { | ||
66 | padding-inline-start: 0; | ||
67 | } | ||
68 | |||
69 | &:last-child { | ||
70 | padding-inline-end: 0; | ||
71 | } | ||
72 | } | ||
73 | } | ||
74 | |||
75 | @include iro.bem-modifier('box') { | ||
76 | td { | ||
77 | background-color: fn.color(--box --bg); | ||
78 | |||
79 | &:first-child { | ||
80 | border-inline-start-width: fn.dim(--border); | ||
81 | } | ||
82 | |||
83 | &:last-child { | ||
84 | border-inline-end-width: fn.dim(--border); | ||
85 | } | ||
86 | } | ||
87 | |||
88 | tr { | ||
89 | &:first-child { | ||
90 | td { | ||
91 | &:first-child { | ||
92 | border-start-start-radius: fn.dim(--rounding); | ||
93 | } | ||
94 | |||
95 | &:last-child { | ||
96 | border-start-end-radius: fn.dim(--rounding); | ||
97 | } | ||
98 | } | ||
99 | } | ||
100 | |||
101 | &:last-child { | ||
102 | td { | ||
103 | &:first-child { | ||
104 | border-end-start-radius: fn.dim(--rounding); | ||
105 | } | ||
106 | |||
107 | &:last-child { | ||
108 | border-end-end-radius: fn.dim(--rounding); | ||
109 | } | ||
110 | } | ||
111 | } | ||
112 | } | ||
113 | } | ||
114 | } | ||
115 | } | ||