summaryrefslogtreecommitdiffstats
path: root/src/.old
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
parentUpdate (diff)
downloadiro-design-4de75e0f305b2cb4a026073440f2bac7c34df817.tar.gz
iro-design-4de75e0f305b2cb4a026073440f2bac7c34df817.tar.bz2
iro-design-4de75e0f305b2cb4a026073440f2bac7c34df817.zip
Focus indicator style
Diffstat (limited to 'src/.old')
-rw-r--r--src/.old/objects/_table.scss167
-rw-r--r--src/.old/scopes/_tables.scss114
2 files changed, 0 insertions, 281 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}
diff --git a/src/.old/scopes/_tables.scss b/src/.old/scopes/_tables.scss
deleted file mode 100644
index f78e81b..0000000
--- a/src/.old/scopes/_tables.scss
+++ /dev/null
@@ -1,114 +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('tables') {
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 --margin-top: fn.global-dim(--paragraph --margin-top),
12 ),
13 ), 'dims');
14
15 @include iro.props-store((
16 --colors: (
17 --border: fn.global-color(--obj),
18 --heading: fn.global-color(--fg-hi),
19 --box: (
20 --bg: fn.global-color(--bg-hi2),
21 )
22 )
23 ), 'colors');
24
25 @include iro.bem-scope(iro.props-namespace()) {
26 table {
27 margin-top: fn.dim(--margin-top);
28 border-spacing: 0;
29 border-collapse: separate;
30 }
31
32 th {
33 @include mx.set-font(--standard, (
34 --line-height: null,
35 --size: fn.global-dim(--font-size --50),
36 --weight: 500,
37 --transform: uppercase,
38 --spacing: .5px
39 ));
40
41 padding: fn.dim(--pad-y) fn.dim(--pad-x);
42 color: fn.color(--heading);
43 text-align: left;
44 }
45
46 td {
47 padding: fn.dim(--pad-y) fn.dim(--pad-x);
48 border-width: 1px 0 0;
49 border-style: solid;
50 border-color: fn.color(--border);
51 }
52
53 tr {
54 &:last-child {
55 td {
56 border-bottom-width: 1px;
57 }
58 }
59 }
60
61 @include iro.bem-modifier('flush') {
62 th,
63 td {
64 &:first-child {
65 padding-left: 0;
66 }
67
68 &:last-child {
69 padding-right: 0;
70 }
71 }
72 }
73
74 @include iro.bem-modifier('box') {
75 td {
76 background-color: fn.color(--box --bg);
77
78 &:first-child {
79 border-left-width: 1px;
80 }
81
82 &:last-child {
83 border-right-width: 1px;
84 }
85 }
86
87 tr {
88 &:first-child {
89 td {
90 &:first-child {
91 border-top-left-radius: fn.dim(--rounding);
92 }
93
94 &:last-child {
95 border-top-right-radius: fn.dim(--rounding);
96 }
97 }
98 }
99
100 &:last-child {
101 td {
102 &:first-child {
103 border-bottom-left-radius: fn.dim(--rounding);
104 }
105
106 &:last-child {
107 border-bottom-right-radius: fn.dim(--rounding);
108 }
109 }
110 }
111 }
112 }
113 }
114}
generated by cgit v1.2.3-70-g09d2 (git 2.47.0) at 2024-11-11 03:26:10 +0000