@bomberstudios/css-library 1.1.3 → 1.1.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.css +32 -12
- package/index.html +2 -1
- package/package.json +1 -1
package/index.css
CHANGED
|
@@ -41,6 +41,10 @@
|
|
|
41
41
|
height: max-content;
|
|
42
42
|
}
|
|
43
43
|
|
|
44
|
+
html {
|
|
45
|
+
interpolate-size: allow-keywords;
|
|
46
|
+
}
|
|
47
|
+
|
|
44
48
|
html,
|
|
45
49
|
body {
|
|
46
50
|
height: 100%;
|
|
@@ -57,59 +61,75 @@ body {
|
|
|
57
61
|
|
|
58
62
|
/* Layout */
|
|
59
63
|
hstack,
|
|
60
|
-
vstack
|
|
64
|
+
vstack,
|
|
65
|
+
.hstack,
|
|
66
|
+
.vstack {
|
|
61
67
|
display: flex;
|
|
62
68
|
gap: var(--gap);
|
|
63
69
|
}
|
|
64
70
|
|
|
65
|
-
hstack
|
|
71
|
+
hstack,
|
|
72
|
+
.hstack {
|
|
66
73
|
flex-direction: row;
|
|
67
74
|
align-items: center;
|
|
68
75
|
}
|
|
69
|
-
vstack
|
|
76
|
+
vstack,
|
|
77
|
+
.vstack {
|
|
70
78
|
flex-direction: column;
|
|
71
79
|
}
|
|
72
80
|
|
|
73
81
|
hstack[align='center'],
|
|
74
|
-
vstack[align='center']
|
|
82
|
+
vstack[align='center'],
|
|
83
|
+
.hstack[align='center'],
|
|
84
|
+
.vstack[align='center'] {
|
|
75
85
|
justify-content: center;
|
|
76
86
|
}
|
|
77
87
|
hstack[align='right'],
|
|
78
|
-
vstack[align='right']
|
|
88
|
+
vstack[align='right'],
|
|
89
|
+
.hstack[align='right'],
|
|
90
|
+
.vstack[align='right'] {
|
|
79
91
|
align-items: end;
|
|
80
92
|
justify-content: flex-end;
|
|
81
93
|
}
|
|
82
|
-
vstack[align='right'] >
|
|
94
|
+
vstack[align='right'] > *,
|
|
95
|
+
.vstack[align='right'] > * {
|
|
83
96
|
width: 100%;
|
|
84
97
|
}
|
|
85
98
|
hstack[align='space-between'],
|
|
86
|
-
vstack[align='space-between']
|
|
99
|
+
vstack[align='space-between'],
|
|
100
|
+
.hstack[align='space-between'],
|
|
101
|
+
.vstack[align='space-between'] {
|
|
87
102
|
justify-content: space-between;
|
|
88
103
|
}
|
|
89
104
|
/* TODO: top and bottom alignment */
|
|
90
105
|
|
|
91
|
-
zstack
|
|
106
|
+
zstack,
|
|
107
|
+
.zstack {
|
|
92
108
|
display: grid;
|
|
93
109
|
align-items: center;
|
|
94
110
|
justify-items: center;
|
|
95
111
|
}
|
|
96
|
-
zstack >
|
|
112
|
+
zstack > *,
|
|
113
|
+
.zstack > * {
|
|
97
114
|
display: flex;
|
|
98
115
|
align-items: center;
|
|
99
116
|
justify-content: center;
|
|
100
117
|
grid-area: 1/1/1/1;
|
|
101
118
|
}
|
|
102
119
|
|
|
103
|
-
divider
|
|
120
|
+
divider,
|
|
121
|
+
.divider {
|
|
104
122
|
background-color: var(--subtle);
|
|
105
123
|
}
|
|
106
124
|
|
|
107
|
-
vstack divider
|
|
125
|
+
vstack divider,
|
|
126
|
+
.vstack .divider {
|
|
108
127
|
width: 100%;
|
|
109
128
|
height: 1px;
|
|
110
129
|
}
|
|
111
130
|
|
|
112
|
-
hstack divider
|
|
131
|
+
hstack divider,
|
|
132
|
+
.hstack .divider {
|
|
113
133
|
width: 1px;
|
|
114
134
|
height: 100%;
|
|
115
135
|
}
|
package/index.html
CHANGED