@aortl/admin-css 0.13.2 → 0.14.1
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/dist/admin.css +249 -28
- package/dist/admin.min.css +1 -1
- package/dist/admin.scoped.css +247 -28
- package/dist/admin.scoped.min.css +44 -7
- package/package.json +1 -1
- package/src/components/card.css +9 -1
- package/src/components/chart.css +311 -0
- package/src/components/index.css +1 -0
package/dist/admin.scoped.css
CHANGED
|
@@ -103,28 +103,6 @@
|
|
|
103
103
|
syntax: "*";
|
|
104
104
|
inherits: false;
|
|
105
105
|
}
|
|
106
|
-
@property --tw-leading {
|
|
107
|
-
syntax: "*";
|
|
108
|
-
inherits: false;
|
|
109
|
-
}
|
|
110
|
-
@property --tw-font-weight {
|
|
111
|
-
syntax: "*";
|
|
112
|
-
inherits: false;
|
|
113
|
-
}
|
|
114
|
-
@property --tw-border-style {
|
|
115
|
-
syntax: "*";
|
|
116
|
-
inherits: false;
|
|
117
|
-
initial-value: solid;
|
|
118
|
-
}
|
|
119
|
-
@property --tw-outline-style {
|
|
120
|
-
syntax: "*";
|
|
121
|
-
inherits: false;
|
|
122
|
-
initial-value: solid;
|
|
123
|
-
}
|
|
124
|
-
@property --tw-duration {
|
|
125
|
-
syntax: "*";
|
|
126
|
-
inherits: false;
|
|
127
|
-
}
|
|
128
106
|
@property --tw-shadow {
|
|
129
107
|
syntax: "*";
|
|
130
108
|
inherits: false;
|
|
@@ -190,6 +168,28 @@
|
|
|
190
168
|
inherits: false;
|
|
191
169
|
initial-value: 0 0 #0000;
|
|
192
170
|
}
|
|
171
|
+
@property --tw-leading {
|
|
172
|
+
syntax: "*";
|
|
173
|
+
inherits: false;
|
|
174
|
+
}
|
|
175
|
+
@property --tw-font-weight {
|
|
176
|
+
syntax: "*";
|
|
177
|
+
inherits: false;
|
|
178
|
+
}
|
|
179
|
+
@property --tw-border-style {
|
|
180
|
+
syntax: "*";
|
|
181
|
+
inherits: false;
|
|
182
|
+
initial-value: solid;
|
|
183
|
+
}
|
|
184
|
+
@property --tw-outline-style {
|
|
185
|
+
syntax: "*";
|
|
186
|
+
inherits: false;
|
|
187
|
+
initial-value: solid;
|
|
188
|
+
}
|
|
189
|
+
@property --tw-duration {
|
|
190
|
+
syntax: "*";
|
|
191
|
+
inherits: false;
|
|
192
|
+
}
|
|
193
193
|
@property --tw-translate-x {
|
|
194
194
|
syntax: "*";
|
|
195
195
|
inherits: false;
|
|
@@ -249,11 +249,6 @@
|
|
|
249
249
|
--tw-numeric-figure: initial;
|
|
250
250
|
--tw-numeric-spacing: initial;
|
|
251
251
|
--tw-numeric-fraction: initial;
|
|
252
|
-
--tw-leading: initial;
|
|
253
|
-
--tw-font-weight: initial;
|
|
254
|
-
--tw-border-style: solid;
|
|
255
|
-
--tw-outline-style: solid;
|
|
256
|
-
--tw-duration: initial;
|
|
257
252
|
--tw-shadow: 0 0 #0000;
|
|
258
253
|
--tw-shadow-color: initial;
|
|
259
254
|
--tw-shadow-alpha: 100%;
|
|
@@ -268,6 +263,11 @@
|
|
|
268
263
|
--tw-ring-offset-width: 0px;
|
|
269
264
|
--tw-ring-offset-color: #fff;
|
|
270
265
|
--tw-ring-offset-shadow: 0 0 #0000;
|
|
266
|
+
--tw-leading: initial;
|
|
267
|
+
--tw-font-weight: initial;
|
|
268
|
+
--tw-border-style: solid;
|
|
269
|
+
--tw-outline-style: solid;
|
|
270
|
+
--tw-duration: initial;
|
|
271
271
|
--tw-translate-x: 0;
|
|
272
272
|
--tw-translate-y: 0;
|
|
273
273
|
--tw-translate-z: 0;
|
|
@@ -2452,7 +2452,7 @@
|
|
|
2452
2452
|
:scope._ao-card, :scope ._ao-card {
|
|
2453
2453
|
display: flex;
|
|
2454
2454
|
flex-direction: column;
|
|
2455
|
-
overflow:
|
|
2455
|
+
overflow: auto;
|
|
2456
2456
|
border-radius: var(--radius-xl);
|
|
2457
2457
|
border-style: var(--tw-border-style);
|
|
2458
2458
|
border-width: 1px;
|
|
@@ -2491,6 +2491,9 @@
|
|
|
2491
2491
|
align-items: center;
|
|
2492
2492
|
gap: calc(var(--spacing) * 1);
|
|
2493
2493
|
}
|
|
2494
|
+
:scope._ao-card-toolbar :is(i, svg), :scope ._ao-card-toolbar :is(i, svg) {
|
|
2495
|
+
font-size: 1.25rem;
|
|
2496
|
+
}
|
|
2494
2497
|
:scope._ao-card-description, :scope ._ao-card-description {
|
|
2495
2498
|
font-size: var(--text-sm);
|
|
2496
2499
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
@@ -4037,6 +4040,218 @@
|
|
|
4037
4040
|
white-space: pre;
|
|
4038
4041
|
word-wrap: normal;
|
|
4039
4042
|
}
|
|
4043
|
+
:scope._ao-chart, :scope ._ao-chart {
|
|
4044
|
+
--chart-max: 100;
|
|
4045
|
+
--chart-height: 8rem;
|
|
4046
|
+
--chart-size: 8rem;
|
|
4047
|
+
--chart-gap: 0.25rem;
|
|
4048
|
+
color: var(--color-primary);
|
|
4049
|
+
}
|
|
4050
|
+
:scope._ao-chart-success, :scope ._ao-chart-success {
|
|
4051
|
+
color: var(--color-success);
|
|
4052
|
+
}
|
|
4053
|
+
:scope._ao-chart-warning, :scope ._ao-chart-warning {
|
|
4054
|
+
color: var(--color-warning);
|
|
4055
|
+
}
|
|
4056
|
+
:scope._ao-chart-danger, :scope ._ao-chart-danger {
|
|
4057
|
+
color: var(--color-danger);
|
|
4058
|
+
}
|
|
4059
|
+
:scope._ao-chart-info, :scope ._ao-chart-info {
|
|
4060
|
+
color: var(--color-info);
|
|
4061
|
+
}
|
|
4062
|
+
:scope._ao-chart-bars, :scope ._ao-chart-bars {
|
|
4063
|
+
display: grid;
|
|
4064
|
+
grid-template-columns: auto 1fr auto;
|
|
4065
|
+
row-gap: var(--chart-gap);
|
|
4066
|
+
align-items: center;
|
|
4067
|
+
inline-size: 100%;
|
|
4068
|
+
}
|
|
4069
|
+
:scope._ao-chart-bar, :scope ._ao-chart-bar {
|
|
4070
|
+
display: grid;
|
|
4071
|
+
grid-template-columns: subgrid;
|
|
4072
|
+
grid-column: 1 / -1;
|
|
4073
|
+
align-items: center;
|
|
4074
|
+
}
|
|
4075
|
+
:scope._ao-chart-bar-label, :scope ._ao-chart-bar-label {
|
|
4076
|
+
font-size: var(--text-xs);
|
|
4077
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
4078
|
+
color: var(--color-text-muted);
|
|
4079
|
+
grid-column: 1;
|
|
4080
|
+
text-align: end;
|
|
4081
|
+
padding-inline-end: 0.5rem;
|
|
4082
|
+
white-space: nowrap;
|
|
4083
|
+
}
|
|
4084
|
+
:scope._ao-chart-bar-track, :scope ._ao-chart-bar-track {
|
|
4085
|
+
grid-column: 2;
|
|
4086
|
+
min-inline-size: 0;
|
|
4087
|
+
}
|
|
4088
|
+
:scope._ao-chart-bar-fill, :scope ._ao-chart-bar-fill {
|
|
4089
|
+
block-size: 0.75rem;
|
|
4090
|
+
inline-size: calc(var(--value) / var(--chart-max) * 100%);
|
|
4091
|
+
background: var(--bar-color, currentColor);
|
|
4092
|
+
border-radius: 2px;
|
|
4093
|
+
transition: inline-size 200ms ease, block-size 200ms ease;
|
|
4094
|
+
}
|
|
4095
|
+
:scope._ao-chart-bar-value, :scope ._ao-chart-bar-value {
|
|
4096
|
+
font-size: var(--text-xs);
|
|
4097
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
4098
|
+
color: var(--color-text-muted);
|
|
4099
|
+
--tw-numeric-spacing: tabular-nums;
|
|
4100
|
+
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
|
4101
|
+
grid-column: 3;
|
|
4102
|
+
text-align: end;
|
|
4103
|
+
padding-inline-start: 0.5rem;
|
|
4104
|
+
white-space: nowrap;
|
|
4105
|
+
}
|
|
4106
|
+
:scope._ao-chart:not(._ao-chart-values) ._ao-chart-bar-value, :scope ._ao-chart:not(._ao-chart-values) ._ao-chart-bar-value {
|
|
4107
|
+
display: none;
|
|
4108
|
+
}
|
|
4109
|
+
:scope._ao-chart-bars-vertical, :scope ._ao-chart-bars-vertical {
|
|
4110
|
+
display: flex;
|
|
4111
|
+
flex-direction: row;
|
|
4112
|
+
align-items: stretch;
|
|
4113
|
+
gap: var(--chart-gap);
|
|
4114
|
+
block-size: var(--chart-height);
|
|
4115
|
+
inline-size: 100%;
|
|
4116
|
+
}
|
|
4117
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar, :scope ._ao-chart-bars-vertical ._ao-chart-bar {
|
|
4118
|
+
display: flex;
|
|
4119
|
+
flex-direction: column;
|
|
4120
|
+
flex: 1 1 0;
|
|
4121
|
+
min-inline-size: 0;
|
|
4122
|
+
align-items: stretch;
|
|
4123
|
+
gap: 0.25rem;
|
|
4124
|
+
}
|
|
4125
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-value, :scope ._ao-chart-bars-vertical ._ao-chart-bar-value {
|
|
4126
|
+
order: 0;
|
|
4127
|
+
grid-column: auto;
|
|
4128
|
+
text-align: center;
|
|
4129
|
+
padding: 0;
|
|
4130
|
+
}
|
|
4131
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-track, :scope ._ao-chart-bars-vertical ._ao-chart-bar-track {
|
|
4132
|
+
order: 1;
|
|
4133
|
+
flex: 1 1 auto;
|
|
4134
|
+
min-block-size: 0;
|
|
4135
|
+
display: flex;
|
|
4136
|
+
flex-direction: column;
|
|
4137
|
+
justify-content: end;
|
|
4138
|
+
}
|
|
4139
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-fill, :scope ._ao-chart-bars-vertical ._ao-chart-bar-fill {
|
|
4140
|
+
inline-size: 100%;
|
|
4141
|
+
block-size: calc(var(--value) / var(--chart-max) * 100%);
|
|
4142
|
+
}
|
|
4143
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-label, :scope ._ao-chart-bars-vertical ._ao-chart-bar-label {
|
|
4144
|
+
order: 2;
|
|
4145
|
+
text-align: center;
|
|
4146
|
+
padding: 0;
|
|
4147
|
+
}
|
|
4148
|
+
:scope._ao-chart-stack, :scope ._ao-chart-stack {
|
|
4149
|
+
display: flex;
|
|
4150
|
+
flex-direction: row;
|
|
4151
|
+
inline-size: 100%;
|
|
4152
|
+
block-size: 0.75rem;
|
|
4153
|
+
border-radius: 9999px;
|
|
4154
|
+
overflow: hidden;
|
|
4155
|
+
background: var(--color-surface-strong);
|
|
4156
|
+
}
|
|
4157
|
+
:scope._ao-chart-segment, :scope ._ao-chart-segment {
|
|
4158
|
+
flex: var(--value) 1 0;
|
|
4159
|
+
min-inline-size: 0;
|
|
4160
|
+
background: var(--segment-color, currentColor);
|
|
4161
|
+
transition: flex-grow 200ms ease;
|
|
4162
|
+
}
|
|
4163
|
+
:scope._ao-chart-segment + ._ao-chart-segment, :scope ._ao-chart-segment + ._ao-chart-segment {
|
|
4164
|
+
box-shadow: -1px 0 0 0 var(--color-surface);
|
|
4165
|
+
}
|
|
4166
|
+
:scope._ao-chart-donut-figure, :scope ._ao-chart-donut-figure {
|
|
4167
|
+
position: relative;
|
|
4168
|
+
inline-size: var(--chart-size);
|
|
4169
|
+
aspect-ratio: 1;
|
|
4170
|
+
display: inline-grid;
|
|
4171
|
+
place-items: center;
|
|
4172
|
+
}
|
|
4173
|
+
:scope._ao-chart-donut, :scope ._ao-chart-donut {
|
|
4174
|
+
--donut-thickness: 33%;
|
|
4175
|
+
inline-size: var(--chart-size);
|
|
4176
|
+
aspect-ratio: 1;
|
|
4177
|
+
border-radius: 50%;
|
|
4178
|
+
background: conic-gradient(var(--donut-segments, currentColor 0 100%));
|
|
4179
|
+
-webkit-mask: radial-gradient( circle at center, transparent calc(50% - var(--donut-thickness)), #000 calc(50% - var(--donut-thickness)) );
|
|
4180
|
+
mask: radial-gradient( circle at center, transparent calc(50% - var(--donut-thickness)), #000 calc(50% - var(--donut-thickness)) );
|
|
4181
|
+
}
|
|
4182
|
+
:scope._ao-chart-donut-figure > ._ao-chart-donut, :scope ._ao-chart-donut-figure > ._ao-chart-donut {
|
|
4183
|
+
grid-area: 1 / 1;
|
|
4184
|
+
inline-size: 100%;
|
|
4185
|
+
}
|
|
4186
|
+
:scope._ao-chart-donut-pie, :scope ._ao-chart-donut-pie {
|
|
4187
|
+
--donut-thickness: 50%;
|
|
4188
|
+
}
|
|
4189
|
+
:scope._ao-chart-donut-center, :scope ._ao-chart-donut-center {
|
|
4190
|
+
text-align: center;
|
|
4191
|
+
font-size: var(--text-sm);
|
|
4192
|
+
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
4193
|
+
--tw-leading: var(--leading-tight);
|
|
4194
|
+
line-height: var(--leading-tight);
|
|
4195
|
+
--tw-font-weight: var(--font-weight-semibold);
|
|
4196
|
+
font-weight: var(--font-weight-semibold);
|
|
4197
|
+
--tw-numeric-spacing: tabular-nums;
|
|
4198
|
+
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
|
4199
|
+
grid-area: 1 / 1;
|
|
4200
|
+
z-index: 1;
|
|
4201
|
+
pointer-events: none;
|
|
4202
|
+
}
|
|
4203
|
+
:scope._ao-chart-legend, :scope ._ao-chart-legend {
|
|
4204
|
+
display: flex;
|
|
4205
|
+
flex-wrap: wrap;
|
|
4206
|
+
align-items: center;
|
|
4207
|
+
column-gap: calc(var(--spacing) * 3);
|
|
4208
|
+
row-gap: calc(var(--spacing) * 1);
|
|
4209
|
+
font-size: var(--text-xs);
|
|
4210
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
4211
|
+
color: var(--color-text-muted);
|
|
4212
|
+
list-style: none;
|
|
4213
|
+
margin: 0;
|
|
4214
|
+
padding: 0;
|
|
4215
|
+
}
|
|
4216
|
+
:scope._ao-chart-legend-item, :scope ._ao-chart-legend-item {
|
|
4217
|
+
display: inline-flex;
|
|
4218
|
+
align-items: center;
|
|
4219
|
+
gap: calc(var(--spacing) * 1.5);
|
|
4220
|
+
}
|
|
4221
|
+
:scope._ao-chart-legend-item::before, :scope ._ao-chart-legend-item::before {
|
|
4222
|
+
content: "";
|
|
4223
|
+
inline-size: 0.625rem;
|
|
4224
|
+
block-size: 0.625rem;
|
|
4225
|
+
border-radius: 2px;
|
|
4226
|
+
background: var(--legend-color, currentColor);
|
|
4227
|
+
flex-shrink: 0;
|
|
4228
|
+
}
|
|
4229
|
+
:scope._ao-chart-sm, :scope ._ao-chart-sm {
|
|
4230
|
+
--chart-height: 4rem;
|
|
4231
|
+
--chart-size: 4rem;
|
|
4232
|
+
}
|
|
4233
|
+
:scope._ao-chart-lg, :scope ._ao-chart-lg {
|
|
4234
|
+
--chart-height: 12rem;
|
|
4235
|
+
--chart-size: 12rem;
|
|
4236
|
+
}
|
|
4237
|
+
:scope._ao-chart-inline, :scope ._ao-chart-inline {
|
|
4238
|
+
display: inline-flex;
|
|
4239
|
+
vertical-align: middle;
|
|
4240
|
+
--chart-height: 1em;
|
|
4241
|
+
--chart-size: 1.25em;
|
|
4242
|
+
}
|
|
4243
|
+
:scope._ao-chart-inline ._ao-chart-stack, :scope ._ao-chart-inline ._ao-chart-stack {
|
|
4244
|
+
inline-size: 6em;
|
|
4245
|
+
block-size: 0.5em;
|
|
4246
|
+
}
|
|
4247
|
+
:scope._ao-chart-inline ._ao-chart-bars, :scope ._ao-chart-inline ._ao-chart-bars, :scope._ao-chart-inline._ao-chart-bars, :scope ._ao-chart-inline._ao-chart-bars {
|
|
4248
|
+
inline-size: 6em;
|
|
4249
|
+
}
|
|
4250
|
+
@media (prefers-reduced-motion: reduce) {
|
|
4251
|
+
:scope._ao-chart-bar-fill, :scope ._ao-chart-bar-fill, :scope._ao-chart-segment, :scope ._ao-chart-segment {
|
|
4252
|
+
transition: none;
|
|
4253
|
+
}
|
|
4254
|
+
}
|
|
4040
4255
|
:scope._ao-collapse, :scope ._ao-collapse {
|
|
4041
4256
|
visibility: collapse;
|
|
4042
4257
|
}
|
|
@@ -4127,6 +4342,10 @@
|
|
|
4127
4342
|
--tw-numeric-spacing: tabular-nums;
|
|
4128
4343
|
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
|
4129
4344
|
}
|
|
4345
|
+
:scope._ao-ring, :scope ._ao-ring {
|
|
4346
|
+
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
4347
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
4348
|
+
}
|
|
4130
4349
|
:scope._ao-select-all, :scope ._ao-select-all {
|
|
4131
4350
|
-webkit-user-select: all;
|
|
4132
4351
|
user-select: all;
|
|
@@ -18,11 +18,6 @@
|
|
|
18
18
|
@property --tw-numeric-figure{syntax:"*";inherits:false}
|
|
19
19
|
@property --tw-numeric-spacing{syntax:"*";inherits:false}
|
|
20
20
|
@property --tw-numeric-fraction{syntax:"*";inherits:false}
|
|
21
|
-
@property --tw-leading{syntax:"*";inherits:false}
|
|
22
|
-
@property --tw-font-weight{syntax:"*";inherits:false}
|
|
23
|
-
@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}
|
|
24
|
-
@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}
|
|
25
|
-
@property --tw-duration{syntax:"*";inherits:false}
|
|
26
21
|
@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
|
|
27
22
|
@property --tw-shadow-color{syntax:"*";inherits:false}
|
|
28
23
|
@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}
|
|
@@ -37,6 +32,11 @@
|
|
|
37
32
|
@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}
|
|
38
33
|
@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}
|
|
39
34
|
@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}
|
|
35
|
+
@property --tw-leading{syntax:"*";inherits:false}
|
|
36
|
+
@property --tw-font-weight{syntax:"*";inherits:false}
|
|
37
|
+
@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}
|
|
38
|
+
@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}
|
|
39
|
+
@property --tw-duration{syntax:"*";inherits:false}
|
|
40
40
|
@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}
|
|
41
41
|
@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}
|
|
42
42
|
@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}
|
|
@@ -63,7 +63,7 @@
|
|
|
63
63
|
:scope{color-scheme:light dark}
|
|
64
64
|
:scope[data-theme=dark], :scope [data-theme=dark]{color-scheme:dark}
|
|
65
65
|
:scope[data-theme=light], :scope [data-theme=light]{color-scheme:light}
|
|
66
|
-
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){:scope, :scope *, :scope:before, :scope :before, :scope:after, :scope :after, :scope::backdrop, :scope ::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-
|
|
66
|
+
@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){:scope, :scope *, :scope:before, :scope :before, :scope:after, :scope :after, :scope::backdrop, :scope ::backdrop{--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-ordinal:initial;--tw-slashed-zero:initial;--tw-numeric-figure:initial;--tw-numeric-spacing:initial;--tw-numeric-fraction:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-leading:initial;--tw-font-weight:initial;--tw-border-style:solid;--tw-outline-style:solid;--tw-duration:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-tracking:initial}}
|
|
67
67
|
:scope, :scope:host, :scope :host{--font-sans:"IBM Plex Sans", "IBM Plex Sans Fallback", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--font-mono:"IBM Plex Mono", "IBM Plex Mono Fallback", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace;--spacing:.25rem;--container-xs:20rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75 / 1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2 / 1.5);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--leading-tight:1.25;--leading-snug:1.375;--leading-relaxed:1.625;--radius-sm:.25rem;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-paper:#fff;--color-black:#0f0f0f;--color-base-50:#fafafa;--color-base-100:#f4f4f4;--color-base-150:#e7e7e7;--color-base-200:#d4d4d4;--color-base-300:#b3b3b3;--color-base-400:#9b9b9b;--color-base-500:#848484;--color-base-600:#6c6c6c;--color-base-700:#555;--color-base-800:#3e3e3e;--color-base-850:#333;--color-base-900:#272727;--color-base-950:#1b1b1b;--color-red-50:#ffe1d5;--color-red-100:#ffcabb;--color-red-150:#fdb2a2;--color-red-200:#f89a8a;--color-red-300:#e8705f;--color-red-400:#d14d41;--color-red-500:#c03e35;--color-red-600:#af3029;--color-red-700:#942822;--color-red-800:#6c201c;--color-red-850:#551b18;--color-red-900:#3e1715;--color-red-950:#261312;--color-orange-50:#ffe7ce;--color-orange-100:#fed3af;--color-orange-150:#fcc192;--color-orange-200:#f9ae77;--color-orange-300:#ec8b49;--color-orange-400:#da702c;--color-orange-500:#cb6120;--color-orange-600:#bc5215;--color-orange-700:#9d4310;--color-orange-800:#71320d;--color-orange-850:#59290d;--color-orange-900:#40200d;--color-orange-950:#27180e;--color-yellow-50:#faeec6;--color-yellow-100:#f6e2a0;--color-yellow-150:#f1d67e;--color-yellow-200:#eccb60;--color-yellow-300:#dfb431;--color-yellow-400:#d0a215;--color-yellow-500:#be9207;--color-yellow-600:#ad8301;--color-yellow-700:#8e6b01;--color-yellow-800:#664d01;--color-yellow-850:#503d02;--color-yellow-900:#3a2d04;--color-yellow-950:#241e08;--color-green-50:#edeecf;--color-green-100:#dde2b2;--color-green-150:#cdd597;--color-green-200:#bec97e;--color-green-300:#a0af54;--color-green-400:#879a39;--color-green-500:#768d21;--color-green-600:#66800b;--color-green-700:#536907;--color-green-800:#3d4c07;--color-green-850:#313d07;--color-green-900:#252d09;--color-green-950:#1a1e0c;--color-cyan-50:#ddf1e4;--color-cyan-100:#bfe8d9;--color-cyan-150:#a2dece;--color-cyan-200:#87d3c3;--color-cyan-300:#5abdac;--color-cyan-400:#3aa99f;--color-cyan-500:#2f968d;--color-cyan-600:#24837b;--color-cyan-700:#1c6c66;--color-cyan-800:#164f4a;--color-cyan-850:#143f3c;--color-cyan-900:#122f2c;--color-cyan-950:#101f1d;--color-blue-50:#e1eceb;--color-blue-100:#c6dde8;--color-blue-150:#abcfe2;--color-blue-200:#92bfdb;--color-blue-300:#66a0c8;--color-blue-400:#4385be;--color-blue-500:#3171b2;--color-blue-600:#205ea6;--color-blue-700:#1a4f8c;--color-blue-800:#163b66;--color-blue-850:#133051;--color-blue-900:#12253b;--color-blue-950:#101a24;--color-purple-50:#f0eaec;--color-purple-100:#e2d9e9;--color-purple-150:#d3cae6;--color-purple-200:#c4b9e0;--color-purple-300:#a699d0;--color-purple-400:#8b7ec8;--color-purple-500:#735eb5;--color-purple-600:#5e409d;--color-purple-700:#4f3685;--color-purple-800:#3c2a62;--color-purple-850:#31234e;--color-purple-900:#261c39;--color-purple-950:#1a1623;--color-magenta-50:#fee4e5;--color-magenta-100:#fccfda;--color-magenta-150:#f9b9cf;--color-magenta-200:#f4a4c2;--color-magenta-300:#e47da8;--color-magenta-400:#ce5d97;--color-magenta-500:#b74583;--color-magenta-600:#a02f6f;--color-magenta-700:#87285e;--color-magenta-800:#641f46;--color-magenta-850:#4f1b39;--color-magenta-900:#39172b;--color-magenta-950:#24131d;--color-surface:light-dark(var(--color-paper),var(--color-black));--color-surface-muted:light-dark(var(--color-base-50),var(--color-base-950));--color-surface-strong:light-dark(var(--color-base-100),var(--color-base-900));--color-text:light-dark(var(--color-black),var(--color-base-200));--color-text-muted:light-dark(var(--color-base-600),var(--color-base-500));--color-border:light-dark(var(--color-base-150),var(--color-base-850));--color-border-strong:light-dark(var(--color-base-300),var(--color-base-700));--color-code-surface:light-dark(var(--color-base-150),var(--color-base-950));--color-code-text:light-dark(var(--color-base-800),var(--color-base-200));--color-primary:light-dark(var(--color-blue-600),var(--color-blue-400));--color-primary-hover:light-dark(var(--color-blue-700),var(--color-blue-300));--color-primary-muted:light-dark(var(--color-blue-50),var(--color-blue-950));--color-primary-content:light-dark(var(--color-paper),var(--color-black));--color-system-accent:light-dark(var(--color-base-600),var(--color-base-400));--color-system-accent-hover:color-mix(in oklch, light-dark(var(--color-base-600),var(--color-base-400)), light-dark(var(--color-black),var(--color-base-200)) 12%)}
|
|
68
68
|
@supports (color:color-mix(in lab, red, red)){:scope, :scope:host, :scope :host{--color-system-accent-hover:color-mix(in oklch, var(--color-system-accent), var(--color-text) 12%)}}
|
|
69
69
|
:scope, :scope:host, :scope :host{--color-system-accent-muted:color-mix(in oklch, light-dark(var(--color-base-600),var(--color-base-400)) 12%, light-dark(var(--color-paper),var(--color-black)))}
|
|
@@ -434,11 +434,12 @@
|
|
|
434
434
|
:scope._ao-select-item[data-disabled], :scope ._ao-select-item[data-disabled]{cursor:not-allowed;opacity:.5}
|
|
435
435
|
:scope._ao-select-item-indicator, :scope ._ao-select-item-indicator{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4);color:var(--color-primary);justify-content:center;align-items:center;margin-left:auto;display:inline-flex}
|
|
436
436
|
:scope._ao-select-group-label, :scope ._ao-select-group-label{padding-inline:calc(var(--spacing) * 3);padding-top:calc(var(--spacing) * 2);padding-bottom:calc(var(--spacing) * 1);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide);color:var(--color-text-muted);text-transform:uppercase}
|
|
437
|
-
:scope._ao-card, :scope ._ao-card{border-radius:var(--radius-xl);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-border);background-color:var(--color-surface-muted);color:var(--color-text);--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);flex-direction:column;display:flex;overflow:
|
|
437
|
+
:scope._ao-card, :scope ._ao-card{border-radius:var(--radius-xl);border-style:var(--tw-border-style);border-width:1px;border-color:var(--color-border);background-color:var(--color-surface-muted);color:var(--color-text);--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);flex-direction:column;display:flex;overflow:auto}
|
|
438
438
|
:scope._ao-card-body, :scope ._ao-card-body{gap:calc(var(--spacing) * 3);padding:calc(var(--spacing) * 5);flex-direction:column;display:flex}
|
|
439
439
|
:scope._ao-card-title, :scope ._ao-card-title{align-items:center;gap:calc(var(--spacing) * 2);font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height));--tw-leading:var(--leading-tight);line-height:var(--leading-tight);--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);display:flex}
|
|
440
440
|
:scope._ao-card-header, :scope ._ao-card-header{align-items:center;gap:calc(var(--spacing) * 2);display:flex}
|
|
441
441
|
:scope._ao-card-toolbar, :scope ._ao-card-toolbar{margin-top:calc(var(--spacing) * -.5);align-items:center;gap:calc(var(--spacing) * 1);margin-left:auto;display:flex}
|
|
442
|
+
:scope._ao-card-toolbar :is(i,svg), :scope ._ao-card-toolbar :is(i,svg){font-size:1.25rem}
|
|
442
443
|
:scope._ao-card-description, :scope ._ao-card-description{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));color:var(--color-text-muted)}
|
|
443
444
|
:scope._ao-card-actions, :scope ._ao-card-actions{align-items:center;gap:calc(var(--spacing) * 2);padding-top:calc(var(--spacing) * 2);flex-wrap:wrap;margin-top:auto;display:flex}
|
|
444
445
|
:scope._ao-card-compact ._ao-card-body, :scope ._ao-card-compact ._ao-card-body{gap:calc(var(--spacing) * 2);padding:calc(var(--spacing) * 3)}
|
|
@@ -667,6 +668,41 @@
|
|
|
667
668
|
:scope._ao-tooltip-wrap:hover>._ao-tooltip, :scope ._ao-tooltip-wrap:hover>._ao-tooltip, :scope._ao-tooltip-wrap:focus-within>._ao-tooltip, :scope ._ao-tooltip-wrap:focus-within>._ao-tooltip{visibility:visible;opacity:1;transition:opacity .15s ease-out .2s,visibility 0s linear .2s}
|
|
668
669
|
:scope._ao-code-block, :scope ._ao-code-block{border-radius:var(--radius-lg);background-color:var(--color-code-surface);padding:calc(var(--spacing) * 3);font-family:var(--font-mono);font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));color:var(--color-code-text);white-space:pre-wrap;word-wrap:break-word;overflow:auto}
|
|
669
670
|
:scope._ao-code-block-nowrap, :scope ._ao-code-block-nowrap{white-space:pre;word-wrap:normal}
|
|
671
|
+
:scope._ao-chart, :scope ._ao-chart{--chart-max:100;--chart-height:8rem;--chart-size:8rem;--chart-gap:.25rem;color:var(--color-primary)}
|
|
672
|
+
:scope._ao-chart-success, :scope ._ao-chart-success{color:var(--color-success)}
|
|
673
|
+
:scope._ao-chart-warning, :scope ._ao-chart-warning{color:var(--color-warning)}
|
|
674
|
+
:scope._ao-chart-danger, :scope ._ao-chart-danger{color:var(--color-danger)}
|
|
675
|
+
:scope._ao-chart-info, :scope ._ao-chart-info{color:var(--color-info)}
|
|
676
|
+
:scope._ao-chart-bars, :scope ._ao-chart-bars{row-gap:var(--chart-gap);grid-template-columns:auto 1fr auto;align-items:center;inline-size:100%;display:grid}
|
|
677
|
+
:scope._ao-chart-bar, :scope ._ao-chart-bar{grid-template-columns:subgrid;grid-column:1/-1;align-items:center;display:grid}
|
|
678
|
+
:scope._ao-chart-bar-label, :scope ._ao-chart-bar-label{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));color:var(--color-text-muted);text-align:end;white-space:nowrap;grid-column:1;padding-inline-end:.5rem}
|
|
679
|
+
:scope._ao-chart-bar-track, :scope ._ao-chart-bar-track{grid-column:2;min-inline-size:0}
|
|
680
|
+
:scope._ao-chart-bar-fill, :scope ._ao-chart-bar-fill{block-size:.75rem;inline-size:calc(var(--value) / var(--chart-max) * 100%);background:var(--bar-color,currentColor);border-radius:2px;transition:inline-size .2s,block-size .2s}
|
|
681
|
+
:scope._ao-chart-bar-value, :scope ._ao-chart-bar-value{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));color:var(--color-text-muted);--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);text-align:end;white-space:nowrap;grid-column:3;padding-inline-start:.5rem}
|
|
682
|
+
:scope._ao-chart:not(._ao-chart-values) ._ao-chart-bar-value, :scope ._ao-chart:not(._ao-chart-values) ._ao-chart-bar-value{display:none}
|
|
683
|
+
:scope._ao-chart-bars-vertical, :scope ._ao-chart-bars-vertical{align-items:stretch;gap:var(--chart-gap);block-size:var(--chart-height);flex-direction:row;inline-size:100%;display:flex}
|
|
684
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar, :scope ._ao-chart-bars-vertical ._ao-chart-bar{flex-direction:column;flex:1 1 0;align-items:stretch;gap:.25rem;min-inline-size:0;display:flex}
|
|
685
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-value, :scope ._ao-chart-bars-vertical ._ao-chart-bar-value{text-align:center;order:0;grid-column:auto;padding:0}
|
|
686
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-track, :scope ._ao-chart-bars-vertical ._ao-chart-bar-track{flex-direction:column;flex:auto;order:1;justify-content:end;min-block-size:0;display:flex}
|
|
687
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-fill, :scope ._ao-chart-bars-vertical ._ao-chart-bar-fill{inline-size:100%;block-size:calc(var(--value) / var(--chart-max) * 100%)}
|
|
688
|
+
:scope._ao-chart-bars-vertical ._ao-chart-bar-label, :scope ._ao-chart-bars-vertical ._ao-chart-bar-label{text-align:center;order:2;padding:0}
|
|
689
|
+
:scope._ao-chart-stack, :scope ._ao-chart-stack{background:var(--color-surface-strong);border-radius:9999px;flex-direction:row;block-size:.75rem;inline-size:100%;display:flex;overflow:hidden}
|
|
690
|
+
:scope._ao-chart-segment, :scope ._ao-chart-segment{flex:var(--value) 1 0;background:var(--segment-color,currentColor);min-inline-size:0;transition:flex-grow .2s}
|
|
691
|
+
:scope._ao-chart-segment+._ao-chart-segment, :scope ._ao-chart-segment+._ao-chart-segment{box-shadow:-1px 0 0 0 var(--color-surface)}
|
|
692
|
+
:scope._ao-chart-donut-figure, :scope ._ao-chart-donut-figure{inline-size:var(--chart-size);aspect-ratio:1;place-items:center;display:inline-grid;position:relative}
|
|
693
|
+
:scope._ao-chart-donut, :scope ._ao-chart-donut{--donut-thickness:33%;inline-size:var(--chart-size);aspect-ratio:1;background:conic-gradient(var(--donut-segments,currentColor 0 100%));-webkit-mask:radial-gradient(circle at center, transparent calc(50% - var(--donut-thickness)), #000 calc(50% - var(--donut-thickness)));-webkit-mask:radial-gradient(circle at center, transparent calc(50% - var(--donut-thickness)), #000 calc(50% - var(--donut-thickness)));-webkit-mask:radial-gradient(circle at center, transparent calc(50% - var(--donut-thickness)), #000 calc(50% - var(--donut-thickness)));mask:radial-gradient(circle at center, transparent calc(50% - var(--donut-thickness)), #000 calc(50% - var(--donut-thickness)));border-radius:50%}
|
|
694
|
+
:scope._ao-chart-donut-figure>._ao-chart-donut, :scope ._ao-chart-donut-figure>._ao-chart-donut{grid-area:1/1;inline-size:100%}
|
|
695
|
+
:scope._ao-chart-donut-pie, :scope ._ao-chart-donut-pie{--donut-thickness:50%}
|
|
696
|
+
:scope._ao-chart-donut-center, :scope ._ao-chart-donut-center{text-align:center;font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height));--tw-leading:var(--leading-tight);line-height:var(--leading-tight);--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold);--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);z-index:1;pointer-events:none;grid-area:1/1}
|
|
697
|
+
:scope._ao-chart-legend, :scope ._ao-chart-legend{align-items:center;column-gap:calc(var(--spacing) * 3);row-gap:calc(var(--spacing) * 1);font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height));color:var(--color-text-muted);flex-wrap:wrap;margin:0;padding:0;list-style:none;display:flex}
|
|
698
|
+
:scope._ao-chart-legend-item, :scope ._ao-chart-legend-item{align-items:center;gap:calc(var(--spacing) * 1.5);display:inline-flex}
|
|
699
|
+
:scope._ao-chart-legend-item:before, :scope ._ao-chart-legend-item:before{content:"";background:var(--legend-color,currentColor);border-radius:2px;flex-shrink:0;block-size:.625rem;inline-size:.625rem}
|
|
700
|
+
:scope._ao-chart-sm, :scope ._ao-chart-sm{--chart-height:4rem;--chart-size:4rem}
|
|
701
|
+
:scope._ao-chart-lg, :scope ._ao-chart-lg{--chart-height:12rem;--chart-size:12rem}
|
|
702
|
+
:scope._ao-chart-inline, :scope ._ao-chart-inline{vertical-align:middle;--chart-height:1em;--chart-size:1.25em;display:inline-flex}
|
|
703
|
+
:scope._ao-chart-inline ._ao-chart-stack, :scope ._ao-chart-inline ._ao-chart-stack{block-size:.5em;inline-size:6em}
|
|
704
|
+
:scope._ao-chart-inline ._ao-chart-bars, :scope ._ao-chart-inline ._ao-chart-bars, :scope._ao-chart-inline._ao-chart-bars, :scope ._ao-chart-inline._ao-chart-bars{inline-size:6em}
|
|
705
|
+
@media (prefers-reduced-motion:reduce){:scope._ao-chart-bar-fill, :scope ._ao-chart-bar-fill, :scope._ao-chart-segment, :scope ._ao-chart-segment{transition:none}}
|
|
670
706
|
:scope._ao-collapse, :scope ._ao-collapse{visibility:collapse}
|
|
671
707
|
:scope._ao-visible, :scope ._ao-visible{visibility:visible}
|
|
672
708
|
:scope._ao-sr-only, :scope ._ao-sr-only{clip-path:inset(50%);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}
|
|
@@ -694,5 +730,6 @@
|
|
|
694
730
|
:scope._ao-rounded-md, :scope ._ao-rounded-md{border-radius:var(--radius-md)}
|
|
695
731
|
:scope._ao-text-right, :scope ._ao-text-right{text-align:right}
|
|
696
732
|
:scope._ao-tabular-nums, :scope ._ao-tabular-nums{--tw-numeric-spacing:tabular-nums;font-variant-numeric:var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,)}
|
|
733
|
+
:scope._ao-ring, :scope ._ao-ring{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}
|
|
697
734
|
:scope._ao-select-all, :scope ._ao-select-all{-webkit-user-select:all;user-select:all}
|
|
698
735
|
}
|
package/package.json
CHANGED
package/src/components/card.css
CHANGED
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
border border-border
|
|
6
6
|
rounded-xl
|
|
7
7
|
shadow-xs
|
|
8
|
-
overflow-
|
|
8
|
+
overflow-auto;
|
|
9
9
|
}
|
|
10
10
|
|
|
11
11
|
.card-body {
|
|
@@ -29,6 +29,14 @@
|
|
|
29
29
|
@apply flex items-center gap-1 ml-auto -mt-0.5;
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
+
/* Toolbar buttons run small (usually `btn-sm`, whose icons inherit `text-xs`);
|
|
33
|
+
bump the glyph to 1rem so the controls stay easy to scan and hit. Both
|
|
34
|
+
bundles size icons off `font-size` — the Tabler webfont (`<i>`) and React's
|
|
35
|
+
`size="1em"` SVG — so this single rule enlarges both identically. */
|
|
36
|
+
.card-toolbar :is(i, svg) {
|
|
37
|
+
font-size: 1.25rem;
|
|
38
|
+
}
|
|
39
|
+
|
|
32
40
|
.card-description {
|
|
33
41
|
@apply text-sm text-text-muted;
|
|
34
42
|
}
|