summaryrefslogtreecommitdiffstats
path: root/src/.old/objects
diff options
context:
space:
mode:
authorVolpeon <git@volpeon.ink>2024-06-25 17:39:03 +0200
committerVolpeon <git@volpeon.ink>2024-06-25 17:39:03 +0200
commit4de75e0f305b2cb4a026073440f2bac7c34df817 (patch)
tree628f71b6f917bb9357ae14d018149509db655e4e /src/.old/objects
parentUpdate (diff)
downloadiro-design-4de75e0f305b2cb4a026073440f2bac7c34df817.tar.gz
iro-design-4de75e0f305b2cb4a026073440f2bac7c34df817.tar.bz2
iro-design-4de75e0f305b2cb4a026073440f2bac7c34df817.zip
Focus indicator style
Diffstat (limited to 'src/.old/objects')
-rw-r--r--src/.old/objects/_table.scss167
1 files changed, 0 insertions, 167 deletions
diff --git a/src/.old/objects/_table.scss b/src/.old/objects/_table.scss
deleted file mode 100644
index 34512cb..0000000
--- a/src/.old/objects/_table.scss
+++ /dev/null
@@ -1,167 +0,0 @@
1@use 'iro-sass/src/index' as iro;
2@use '../functions' as fn;
3@use '../mixins' as mx;
4
5@include iro.props-namespace('table') {
6 @include iro.props-store((
7 --dims: (
8 --pad-x: fn.global-dim(--size --175),
9 --pad-y: fn.global-dim(--size --125),
10 --rounding: 3px,
11 --50: (
12 --pad-y: fn.global-dim(--size --75),
13 )
14 ),
15 ), 'dims');
16
17 @include iro.props-store((
18 --colors: (
19 --border: fn.global-color(--obj),
20 --heading: fn.global-color(--fg-hi),
21 --hover: fn.global-color(--obj-hi),
22 --press: fn.global-color(--obj),
23 --box: (
24 --bg: fn.global-color(--bg-hi2),
25 --hover: fn.global-color(--bg),
26 --press: fn.global-color(--obj-hi),
27 )
28 )
29 ), 'colors');
30
31 @include iro.bem-object(iro.props-namespace()) {
32 border-spacing: 0;
33 border-collapse: separate;
34
35 @include iro.bem-modifier('fixed') {
36 table-layout: fixed;
37 }
38
39 @include iro.bem-elem('head-cell') {
40 @include mx.set-font(--standard, (
41 --line-height: null,
42 --size: fn.global-dim(--font-size --50),
43 --weight: 500,
44 --transform: uppercase,
45 --spacing: .5px
46 ));
47
48 padding: fn.dim(--pad-y) fn.dim(--pad-x);
49 color: fn.color(--heading);
50 text-align: left;
51 }
52
53 @include iro.bem-elem('cell') {
54 padding: fn.dim(--pad-y) fn.dim(--pad-x);
55 border-width: 1px 0 0;
56 border-style: solid;
57 border-color: fn.color(--border);
58
59 @include iro.bem-modifier('divider') {
60 border-right-width: 1px;
61 }
62 }
63
64 @include iro.bem-elem('row') {
65 &:last-child {
66 @include iro.bem-elem('cell') {
67 border-bottom-width: 1px;
68 }
69 }
70 }
71
72 @include iro.bem-modifier('flush') {
73 @include iro.bem-elem('head-cell', 'cell') {
74 &:first-child {
75 padding-left: 0;
76 }
77
78 &:last-child {
79 padding-right: 0;
80 }
81 }
82 }
83
84 @include iro.bem-modifier('box') {
85 @include iro.bem-elem('cell') {
86 background-color: fn.color(--box --bg);
87
88 &:first-child {
89 border-left-width: 1px;
90 }
91
92 &:last-child {
93 border-right-width: 1px;
94 }
95 }
96
97 @include iro.bem-elem('row') {
98 &:first-child {
99 @include iro.bem-elem('cell') {
100 &:first-child {
101 border-top-left-radius: fn.dim(--rounding);
102 }
103
104 &:last-child {
105 border-top-right-radius: fn.dim(--rounding);
106 }
107 }
108 }
109
110 &:last-child {
111 @include iro.bem-elem('cell') {
112 &:first-child {
113 border-bottom-left-radius: fn.dim(--rounding);
114 }
115
116 &:last-child {
117 border-bottom-right-radius: fn.dim(--rounding);
118 }
119 }
120 }
121 }
122 }
123
124 @include iro.bem-modifier('interactive') {
125 @include iro.bem-elem('row') {
126 @include iro.bem-elem('cell') {
127 cursor: pointer;
128 }
129
130 &:hover {
131 @include iro.bem-elem('cell') {
132 background-color: fn.color(--hover);
133 }
134 }
135
136 &:active {
137 @include iro.bem-elem('cell') {
138 background-color: fn.color(--press);
139 }
140 }
141 }
142
143 @include iro.bem-modifier('box') {
144 @include iro.bem-elem('row') {
145 &:hover {
146 @include iro.bem-elem('cell') {
147 background-color: fn.color(--box --hover);
148 }
149 }
150
151 &:active {
152 @include iro.bem-elem('cell') {
153 background-color: fn.color(--box --press);
154 }
155 }
156 }
157 }
158 }
159
160 @include iro.bem-modifier('50') {
161 @include iro.bem-elem('head-cell', 'cell') {
162 padding-top: fn.dim(--50 --pad-y);
163 padding-bottom: fn.dim(--50 --pad-y);
164 }
165 }
166 }
167}