@leftium/nimble.css 0.11.0 → 0.12.0
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/nimble-base.css +9 -0
- package/dist/nimble-base.min.css +1 -1
- package/dist/nimble-core.css +45 -1
- package/dist/nimble-core.min.css +1 -1
- package/dist/nimble-progress.css +0 -65
- package/dist/nimble-progress.min.css +1 -1
- package/dist/nimble.css +45 -66
- package/dist/nimble.min.css +1 -1
- package/package.json +1 -1
- package/src/_buttons.scss +20 -14
- package/src/_code.scss +2 -2
- package/src/_config.scss +4 -4
- package/src/_details.scss +9 -8
- package/src/_dialog.scss +23 -2
- package/src/_document.scss +3 -2
- package/src/_forms.scss +37 -23
- package/src/_grid-columns.scss +1 -0
- package/src/_layout-utilities.scss +14 -0
- package/src/_links.scss +1 -1
- package/src/_media.scss +2 -2
- package/src/_meter.scss +2 -2
- package/src/_print.scss +1 -1
- package/src/_progress.scss +4 -73
- package/src/_reset.scss +2 -2
- package/src/_select.scss +3 -2
- package/src/_tables.scss +3 -2
- package/src/_typography.scss +36 -20
package/dist/nimble-base.css
CHANGED
|
@@ -47,6 +47,7 @@
|
|
|
47
47
|
display: grid;
|
|
48
48
|
grid-template-columns: 1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;
|
|
49
49
|
min-height: 100dvh;
|
|
50
|
+
padding-block: var(--nc-spacing);
|
|
50
51
|
position: relative;
|
|
51
52
|
}
|
|
52
53
|
::selection {
|
|
@@ -118,6 +119,14 @@
|
|
|
118
119
|
margin-top: 0;
|
|
119
120
|
margin-bottom: var(--nc-spacing);
|
|
120
121
|
}
|
|
122
|
+
body > :first-child,
|
|
123
|
+
body > :first-child > :first-child {
|
|
124
|
+
margin-top: 0;
|
|
125
|
+
}
|
|
126
|
+
body > :nth-last-child(1 of :not(script, style, dialog)),
|
|
127
|
+
body > :nth-last-child(1 of :not(script, style, dialog)) > :last-child {
|
|
128
|
+
margin-bottom: 0;
|
|
129
|
+
}
|
|
121
130
|
ul, ol {
|
|
122
131
|
padding-inline-start: 1.5em;
|
|
123
132
|
}
|
package/dist/nimble-base.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer nimble.reset;@layer nimble.base{:root{color-scheme:light dark;--nc-surface-hue:250;--nc-surface-1:light-dark(oklch(.985 .002 var(--nc-surface-hue)),oklch(.17 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-2:light-dark(oklch(.955 .002 var(--nc-surface-hue)),oklch(.2 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-3:light-dark(oklch(.925 .002 var(--nc-surface-hue)),oklch(.23 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-4:light-dark(oklch(.885 .002 var(--nc-surface-hue)),oklch(.27 .005 calc(var(--nc-surface-hue) + 10)));--nc-text:light-dark(oklch(.28 .005 var(--nc-surface-hue)),oklch(.86 .005 var(--nc-surface-hue)));--nc-border:light-dark(oklch(.83 .005 var(--nc-surface-hue)),oklch(.28 .005 calc(var(--nc-surface-hue) + 10)));--nc-primary:light-dark(oklch(50% .2 250),oklch(60% .2 250));--nc-primary-hover:light-dark(oklch(from var(--nc-primary) calc(l - .1) c h),oklch(from var(--nc-primary) calc(l + .1) c h));--nc-primary-focus:oklch(from var(--nc-primary) l c h / .4);--nc-primary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-secondary:light-dark(oklch(45% .05 250),oklch(60% .05 250));--nc-secondary-hover:light-dark(oklch(from var(--nc-secondary) calc(l - .1) c h),oklch(from var(--nc-secondary) calc(l + .1) c h));--nc-secondary-focus:oklch(from var(--nc-secondary) l c h / .3);--nc-secondary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-valid:light-dark(oklch(52% .17 145),oklch(65% .2 145));--nc-invalid:light-dark(oklch(55% .22 25),oklch(65% .22 25));--nc-font-sans:system-ui, sans-serif;--nc-font-mono:ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;--nc-spacing:1rem;--nc-radius:.25rem;--nc-content-width:60ch;--nc-content-shadow-gap:1rem;--nc-content-shadow:0 0 .15rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .02),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .015)), 0 0 .3rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .03),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .02)), 0 0 .75rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .025)), 0 0 1.35rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .03)), 0 0 2.5rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .05),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .035)), 0 0 6rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .06),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .04)), 0 0 0rem .0625rem light-dark(oklch(.55 .01 var(--nc-surface-hue) / .015),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .01))}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}html{font-family:var(--nc-font-sans);color:var(--nc-text);background-color:var(--nc-surface-1);scrollbar-gutter:stable;font-size:100%;line-height:1.5}body{grid-template-columns:1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;min-height:100dvh;display:grid;position:relative}::selection{background-color:var(--nc-primary-focus);color:var(--nc-text)}h1{margin-top:0;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:2rem;font-weight:700;line-height:1.1}h2{margin-top:2rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.75rem;font-weight:700;line-height:1.15}h3{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.5rem;font-weight:700;line-height:1.2}h4{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.25rem;font-weight:700;line-height:1.3}h5{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.125rem;font-weight:700;line-height:1.4}h6{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1rem;font-weight:700;line-height:1.5}@media (width<=720px){h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.3rem}}p,ul,ol,dl,blockquote,pre,table,figure,form,fieldset{margin-top:0;margin-bottom:var(--nc-spacing)}ul,ol{padding-inline-start:1.5em}:where(li){margin-bottom:.25em}:where(li)>:where(ul,ol){margin-bottom:0}dt{font-weight:600}dd{margin-inline-start:1.5em;margin-bottom:.5em}blockquote{margin-block:var(--nc-spacing);padding:.25em var(--nc-spacing);border-inline-start:.25rem solid var(--nc-border);margin-inline:0;font-style:italic}:where(blockquote) footer,:where(blockquote) cite{color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.9em;font-style:normal}hr{background-color:color-mix(in oklch, var(--nc-border), transparent 40%);height:1px;margin:var(--nc-spacing) 0;border:none}mark{color:light-dark(inherit,oklch(95% .01 85));background-color:light-dark(#fde68a,oklch(55% .12 85));border-radius:2px;padding:.1em .25em}address{font-style:normal}}
|
|
1
|
+
@layer nimble.reset;@layer nimble.base{:root{color-scheme:light dark;--nc-surface-hue:250;--nc-surface-1:light-dark(oklch(.985 .002 var(--nc-surface-hue)),oklch(.17 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-2:light-dark(oklch(.955 .002 var(--nc-surface-hue)),oklch(.2 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-3:light-dark(oklch(.925 .002 var(--nc-surface-hue)),oklch(.23 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-4:light-dark(oklch(.885 .002 var(--nc-surface-hue)),oklch(.27 .005 calc(var(--nc-surface-hue) + 10)));--nc-text:light-dark(oklch(.28 .005 var(--nc-surface-hue)),oklch(.86 .005 var(--nc-surface-hue)));--nc-border:light-dark(oklch(.83 .005 var(--nc-surface-hue)),oklch(.28 .005 calc(var(--nc-surface-hue) + 10)));--nc-primary:light-dark(oklch(50% .2 250),oklch(60% .2 250));--nc-primary-hover:light-dark(oklch(from var(--nc-primary) calc(l - .1) c h),oklch(from var(--nc-primary) calc(l + .1) c h));--nc-primary-focus:oklch(from var(--nc-primary) l c h / .4);--nc-primary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-secondary:light-dark(oklch(45% .05 250),oklch(60% .05 250));--nc-secondary-hover:light-dark(oklch(from var(--nc-secondary) calc(l - .1) c h),oklch(from var(--nc-secondary) calc(l + .1) c h));--nc-secondary-focus:oklch(from var(--nc-secondary) l c h / .3);--nc-secondary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-valid:light-dark(oklch(52% .17 145),oklch(65% .2 145));--nc-invalid:light-dark(oklch(55% .22 25),oklch(65% .22 25));--nc-font-sans:system-ui, sans-serif;--nc-font-mono:ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;--nc-spacing:1rem;--nc-radius:.25rem;--nc-content-width:60ch;--nc-content-shadow-gap:1rem;--nc-content-shadow:0 0 .15rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .02),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .015)), 0 0 .3rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .03),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .02)), 0 0 .75rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .025)), 0 0 1.35rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .03)), 0 0 2.5rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .05),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .035)), 0 0 6rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .06),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .04)), 0 0 0rem .0625rem light-dark(oklch(.55 .01 var(--nc-surface-hue) / .015),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .01))}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}html{font-family:var(--nc-font-sans);color:var(--nc-text);background-color:var(--nc-surface-1);scrollbar-gutter:stable;font-size:100%;line-height:1.5}body{grid-template-columns:1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;min-height:100dvh;padding-block:var(--nc-spacing);display:grid;position:relative}::selection{background-color:var(--nc-primary-focus);color:var(--nc-text)}h1{margin-top:0;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:2rem;font-weight:700;line-height:1.1}h2{margin-top:2rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.75rem;font-weight:700;line-height:1.15}h3{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.5rem;font-weight:700;line-height:1.2}h4{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.25rem;font-weight:700;line-height:1.3}h5{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.125rem;font-weight:700;line-height:1.4}h6{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1rem;font-weight:700;line-height:1.5}@media (width<=720px){h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.3rem}}p,ul,ol,dl,blockquote,pre,table,figure,form,fieldset{margin-top:0;margin-bottom:var(--nc-spacing)}body>:first-child,body>:first-child>:first-child{margin-top:0}body>:nth-last-child(1 of :not(script,style,dialog)),body>:nth-last-child(1 of :not(script,style,dialog))>:last-child{margin-bottom:0}ul,ol{padding-inline-start:1.5em}:where(li){margin-bottom:.25em}:where(li)>:where(ul,ol){margin-bottom:0}dt{font-weight:600}dd{margin-inline-start:1.5em;margin-bottom:.5em}blockquote{margin-block:var(--nc-spacing);padding:.25em var(--nc-spacing);border-inline-start:.25rem solid var(--nc-border);margin-inline:0;font-style:italic}:where(blockquote) footer,:where(blockquote) cite{color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.9em;font-style:normal}hr{background-color:color-mix(in oklch, var(--nc-border), transparent 40%);height:1px;margin:var(--nc-spacing) 0;border:none}mark{color:light-dark(inherit,oklch(95% .01 85));background-color:light-dark(#fde68a,oklch(55% .12 85));border-radius:2px;padding:.1em .25em}address{font-style:normal}}
|
package/dist/nimble-core.css
CHANGED
|
@@ -168,6 +168,7 @@
|
|
|
168
168
|
display: grid;
|
|
169
169
|
grid-template-columns: 1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;
|
|
170
170
|
min-height: 100dvh;
|
|
171
|
+
padding-block: var(--nc-spacing);
|
|
171
172
|
position: relative;
|
|
172
173
|
}
|
|
173
174
|
::selection {
|
|
@@ -215,6 +216,17 @@
|
|
|
215
216
|
box-shadow: none;
|
|
216
217
|
position: relative;
|
|
217
218
|
}
|
|
219
|
+
.grid {
|
|
220
|
+
display: grid;
|
|
221
|
+
grid-template-columns: 1fr;
|
|
222
|
+
gap: var(--nc-spacing);
|
|
223
|
+
margin-bottom: var(--nc-spacing);
|
|
224
|
+
}
|
|
225
|
+
@media (min-width: 720px) {
|
|
226
|
+
.grid {
|
|
227
|
+
grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
|
|
228
|
+
}
|
|
229
|
+
}
|
|
218
230
|
.wide {
|
|
219
231
|
grid-column: 1/-1;
|
|
220
232
|
box-shadow: none;
|
|
@@ -316,6 +328,14 @@
|
|
|
316
328
|
margin-top: 0;
|
|
317
329
|
margin-bottom: var(--nc-spacing);
|
|
318
330
|
}
|
|
331
|
+
body > :first-child,
|
|
332
|
+
body > :first-child > :first-child {
|
|
333
|
+
margin-top: 0;
|
|
334
|
+
}
|
|
335
|
+
body > :nth-last-child(1 of :not(script, style, dialog)),
|
|
336
|
+
body > :nth-last-child(1 of :not(script, style, dialog)) > :last-child {
|
|
337
|
+
margin-bottom: 0;
|
|
338
|
+
}
|
|
319
339
|
ul, ol {
|
|
320
340
|
padding-inline-start: 1.5em;
|
|
321
341
|
}
|
|
@@ -397,6 +417,9 @@
|
|
|
397
417
|
margin: 0;
|
|
398
418
|
transition: background-color 0.2s, border-color 0.2s;
|
|
399
419
|
}
|
|
420
|
+
:where(button, [type=submit], [type=reset], [type=button], [role=button]) {
|
|
421
|
+
margin-block-end: 0.25em;
|
|
422
|
+
}
|
|
400
423
|
:where(button, [type=submit], [type=reset], [type=button], [role=button]):hover {
|
|
401
424
|
background-color: var(--nc-primary-hover);
|
|
402
425
|
border-color: var(--nc-primary-hover);
|
|
@@ -431,7 +454,7 @@
|
|
|
431
454
|
}
|
|
432
455
|
:where([role=group]) {
|
|
433
456
|
display: inline-flex;
|
|
434
|
-
margin-bottom:
|
|
457
|
+
margin-bottom: 0.25em;
|
|
435
458
|
}
|
|
436
459
|
[role=group] > * {
|
|
437
460
|
border-radius: 0;
|
|
@@ -546,6 +569,9 @@
|
|
|
546
569
|
width: 100%;
|
|
547
570
|
margin-bottom: var(--nc-spacing);
|
|
548
571
|
}
|
|
572
|
+
:where(p, div) > :where(input, select, textarea):nth-last-child(1 of :not(datalist, script, style)) {
|
|
573
|
+
margin-bottom: 0;
|
|
574
|
+
}
|
|
549
575
|
:where(input, select, textarea):focus-visible {
|
|
550
576
|
border-color: var(--nc-primary);
|
|
551
577
|
box-shadow: 0 0 0 2px var(--nc-primary-focus);
|
|
@@ -587,6 +613,10 @@
|
|
|
587
613
|
min-width: 0;
|
|
588
614
|
max-width: 100%;
|
|
589
615
|
}
|
|
616
|
+
:where(fieldset) > :nth-last-child(1 of :not(datalist, script, style)),
|
|
617
|
+
:where(fieldset) > :nth-last-child(1 of :not(datalist, script, style)) > :nth-last-child(1 of :not(datalist, script, style)) {
|
|
618
|
+
margin-bottom: 0;
|
|
619
|
+
}
|
|
590
620
|
:where(legend) {
|
|
591
621
|
font-weight: 600;
|
|
592
622
|
padding-inline: 0.25em;
|
|
@@ -874,8 +904,22 @@
|
|
|
874
904
|
border: 1px solid var(--nc-border);
|
|
875
905
|
border-radius: var(--nc-radius);
|
|
876
906
|
max-width: min(90vw, 40rem);
|
|
907
|
+
max-height: 85vh;
|
|
877
908
|
padding: var(--nc-spacing);
|
|
878
909
|
}
|
|
910
|
+
:where(dialog[open]) {
|
|
911
|
+
position: fixed;
|
|
912
|
+
inset: 0;
|
|
913
|
+
margin: auto;
|
|
914
|
+
}
|
|
915
|
+
:where(dialog:has(> article)) {
|
|
916
|
+
background: none;
|
|
917
|
+
border: none;
|
|
918
|
+
padding: 0;
|
|
919
|
+
}
|
|
920
|
+
:where(dialog > article) {
|
|
921
|
+
margin-bottom: 0;
|
|
922
|
+
}
|
|
879
923
|
dialog::backdrop {
|
|
880
924
|
background: rgba(0, 0, 0, 0.5);
|
|
881
925
|
backdrop-filter: blur(4px);
|
package/dist/nimble-core.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer nimble.reset{:where(:not(progress)),:where(),:where(){box-sizing:border-box;background-repeat:no-repeat}:where(html){-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5}:where(body){margin:0}:where(h1){margin-block:.67em;font-size:2em}:where(hr){height:0;color:inherit}:where(nav) :where(ol,ul){padding:0;list-style-type:none}:where(pre){font-family:monospace;font-size:1em}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace;font-size:1em}:where(small){font-size:80%}:where(sub,sup){vertical-align:baseline;font-size:75%;line-height:0;position:relative}:where(sub){bottom:-.25em}:where(sup){top:-.5em}:where(iframe){border-style:none}:where(table){border-collapse:collapse;text-indent:0;border-color:currentColor}:where(button,input,select,textarea){font:inherit;letter-spacing:inherit}:where(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){resize:vertical;overflow:auto}:where([type=search]){-webkit-appearance:textfield;outline-offset:-2px}:where(){-webkit-appearance:none}:where(),:where(){height:auto}:where(){-webkit-appearance:button;font:inherit}:where(summary){display:list-item}:where(a,area,button,input,label,select,summary,textarea,[tabindex]){touch-action:manipulation;-webkit-tap-highlight-color:transparent}:where([aria-busy=true]){cursor:progress}:where([aria-disabled=true],[disabled]){cursor:not-allowed}@media (prefers-reduced-motion:reduce){:where(*),:where(),:where(){scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}@layer nimble.base{:root{color-scheme:light dark;--nc-surface-hue:250;--nc-surface-1:light-dark(oklch(.985 .002 var(--nc-surface-hue)),oklch(.17 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-2:light-dark(oklch(.955 .002 var(--nc-surface-hue)),oklch(.2 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-3:light-dark(oklch(.925 .002 var(--nc-surface-hue)),oklch(.23 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-4:light-dark(oklch(.885 .002 var(--nc-surface-hue)),oklch(.27 .005 calc(var(--nc-surface-hue) + 10)));--nc-text:light-dark(oklch(.28 .005 var(--nc-surface-hue)),oklch(.86 .005 var(--nc-surface-hue)));--nc-border:light-dark(oklch(.83 .005 var(--nc-surface-hue)),oklch(.28 .005 calc(var(--nc-surface-hue) + 10)));--nc-primary:light-dark(oklch(50% .2 250),oklch(60% .2 250));--nc-primary-hover:light-dark(oklch(from var(--nc-primary) calc(l - .1) c h),oklch(from var(--nc-primary) calc(l + .1) c h));--nc-primary-focus:oklch(from var(--nc-primary) l c h / .4);--nc-primary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-secondary:light-dark(oklch(45% .05 250),oklch(60% .05 250));--nc-secondary-hover:light-dark(oklch(from var(--nc-secondary) calc(l - .1) c h),oklch(from var(--nc-secondary) calc(l + .1) c h));--nc-secondary-focus:oklch(from var(--nc-secondary) l c h / .3);--nc-secondary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-valid:light-dark(oklch(52% .17 145),oklch(65% .2 145));--nc-invalid:light-dark(oklch(55% .22 25),oklch(65% .22 25));--nc-font-sans:system-ui, sans-serif;--nc-font-mono:ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;--nc-spacing:1rem;--nc-radius:.25rem;--nc-content-width:60ch;--nc-content-shadow-gap:1rem;--nc-content-shadow:0 0 .15rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .02),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .015)), 0 0 .3rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .03),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .02)), 0 0 .75rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .025)), 0 0 1.35rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .03)), 0 0 2.5rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .05),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .035)), 0 0 6rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .06),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .04)), 0 0 0rem .0625rem light-dark(oklch(.55 .01 var(--nc-surface-hue) / .015),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .01))}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}html{font-family:var(--nc-font-sans);color:var(--nc-text);background-color:var(--nc-surface-1);scrollbar-gutter:stable;font-size:100%;line-height:1.5}body{grid-template-columns:1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;min-height:100dvh;display:grid;position:relative}::selection{background-color:var(--nc-primary-focus);color:var(--nc-text)}body>*,body>[style*="display: contents"]>*{grid-column:3;min-width:0}@media (width>=720px){body:before{content:"";width:min(calc(var(--nc-content-width) + 2 * var(--nc-content-shadow-gap)), calc(100% - 2 * var(--nc-spacing)));box-shadow:var(--nc-content-shadow);pointer-events:none;z-index:-1;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}}}@layer nimble.utilities{.container{max-width:var(--nc-content-width);padding-inline:var(--nc-spacing);margin-inline:auto}.fluid{max-width:none;padding-inline:var(--nc-spacing);display:block}.full-bleed{box-shadow:none;grid-column:1/-1;position:relative}.wide{box-shadow:none;width:100%;max-width:1200px;padding-inline:var(--nc-spacing);grid-column:1/-1;margin-inline:auto}}@media print{body{color:#000;background:#fff}a[href]:after{content:" (" attr(href) ")";color:#555;font-size:.85em}a[href^=\#]:after,a[href^=javascript\:]:after{content:none}pre,blockquote{page-break-inside:avoid}h2,h3,h4{page-break-after:avoid}img{max-width:100%!important}@page{margin:2cm}}@scope(:root) to (.no-nimble){@layer nimble.base{h1{margin-top:0;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:2rem;font-weight:700;line-height:1.1}h2{margin-top:2rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.75rem;font-weight:700;line-height:1.15}h3{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.5rem;font-weight:700;line-height:1.2}h4{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.25rem;font-weight:700;line-height:1.3}h5{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.125rem;font-weight:700;line-height:1.4}h6{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1rem;font-weight:700;line-height:1.5}@media (width<=720px){h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.3rem}}p,ul,ol,dl,blockquote,pre,table,figure,form,fieldset{margin-top:0;margin-bottom:var(--nc-spacing)}ul,ol{padding-inline-start:1.5em}:where(li){margin-bottom:.25em}:where(li)>:where(ul,ol){margin-bottom:0}dt{font-weight:600}dd{margin-inline-start:1.5em;margin-bottom:.5em}blockquote{margin-block:var(--nc-spacing);padding:.25em var(--nc-spacing);border-inline-start:.25rem solid var(--nc-border);margin-inline:0;font-style:italic}:where(blockquote) footer,:where(blockquote) cite{color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.9em;font-style:normal}hr{background-color:color-mix(in oklch, var(--nc-border), transparent 40%);height:1px;margin:var(--nc-spacing) 0;border:none}mark{color:light-dark(inherit,oklch(95% .01 85));background-color:light-dark(#fde68a,oklch(55% .12 85));border-radius:2px;padding:.1em .25em}address{font-style:normal}:where(a:not([role=button])){color:var(--nc-primary);text-underline-offset:.15em;text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);transition:color .2s,text-decoration-color .2s}:where(a:not([role=button])):visited{color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310));-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%);text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%)}:where(a:not([role=button])):hover{color:var(--nc-primary-hover);-webkit-text-decoration-color:var(--nc-primary-hover);text-decoration-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]){--_btn-padding-v:.5em;--_btn-padding-h:1em;padding:var(--_btn-padding-v) var(--_btn-padding-h);background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;text-align:center;margin:0;font-size:1rem;line-height:1.5;text-decoration:none;transition:background-color .2s,border-color .2s;display:inline-block}:where(button,[type=submit],[type=reset],[type=button],[role=button]):hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]):focus-visible{box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where([type=reset]){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}:where([type=reset]):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}:where([type=reset]):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}:where(button,[type=submit],[type=reset],[type=button],[role=button]).inline{--_btn-padding-v:.05em;--_btn-padding-h:.4em;vertical-align:baseline;margin:.1em .15em;font-size:.875em}:where(button,[type=submit],[type=reset],[type=button],[role=button]):disabled{opacity:.5;cursor:not-allowed;pointer-events:none}:where([role=group]){margin-bottom:var(--nc-spacing);display:inline-flex}[role=group]>*{border-radius:0;margin:0;position:relative}[role=group]>*+*{--_divider:""}[role=group]>*+:before{content:var(--_divider);inset-inline-start:0;pointer-events:none;background:#ffffff4d;width:1px;position:absolute;top:20%;bottom:20%}[role=group]>:not(.secondary):not(.outline)+.secondary,[role=group]>.secondary+:not(.secondary):not(.outline),[role=group]>:not(.secondary):not(.outline)+.outline,[role=group]>.outline+:not(.secondary):not(.outline),[role=group]>.secondary+.outline,[role=group]>.outline+.secondary,[role=group]>input+*,[role=group]>select+*{--_divider:none}[role=group]>:first-child{border-start-start-radius:var(--nc-radius);border-end-start-radius:var(--nc-radius)}[role=group]>:last-child{border-start-end-radius:var(--nc-radius);border-end-end-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline))){border:1px solid var(--nc-primary);border-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline)))>.outline{border:none}[role=group]>.outline+.outline:before{background:var(--nc-primary)}[role=search] [role=group]>:first-child{border-start-start-radius:5rem;border-end-start-radius:5rem;padding-inline-start:1.25em}[role=search] [role=group]>:last-child{border-start-end-radius:5rem;border-end-end-radius:5rem;padding-inline-end:1.25em}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset]),select,textarea){--_input-bg:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);background-color:var(--_input-bg);border:1px solid var(--nc-border);border-radius:var(--nc-radius);min-height:calc(2.5em + 2px);color:var(--nc-text);font:inherit;padding:.5em .75em;font-size:1rem;transition:border-color .2s,box-shadow .2s}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset],[type=date],[type=month],[type=week],[type=time],[type=datetime-local]),select,textarea){width:100%;margin-bottom:var(--nc-spacing)}:where(input,select,textarea):focus-visible{border-color:var(--nc-primary);box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)+:where(small){margin-top:calc(var(--nc-spacing) * -.75);margin-bottom:var(--nc-spacing);color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.875em;display:block}:where(input,select,textarea)[aria-invalid=false]{border-color:var(--nc-valid)}:where(input,select,textarea)[aria-invalid=true]{border-color:var(--nc-invalid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=false]+:where(small){color:var(--nc-valid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=true]+:where(small){color:var(--nc-invalid)}:where(label){margin-bottom:.25em;display:block}:where(label:has(+input,+select,+textarea)){font-weight:600}:where(label:has(+[type=file],+[type=range])){margin-bottom:.5em}:where(fieldset){border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);min-width:0;max-width:100%}:where(legend){padding-inline:.25em;font-weight:600}:where([type=checkbox],[type=radio]){accent-color:var(--nc-primary);width:1.125em;height:1.125em;margin:0}:where(label:has([type=checkbox],[type=radio])){align-items:center;gap:.35em;margin-bottom:.5em;display:flex}:where(label:has([type=checkbox],[type=radio]):last-child){margin-bottom:0}:where([type=search]){border-radius:5rem;padding-inline:1.25em}:where([type=range]){accent-color:var(--nc-primary);width:100%;margin-bottom:var(--nc-spacing)}:where(input[list]){width:auto}:where([type=file]){color:var(--nc-text);font:inherit;cursor:pointer;max-width:100%;margin-bottom:var(--nc-spacing)}:where([type=file])::file-selector-button{margin-right:.75em;background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;margin-inline-end:.75em;padding:.5em 1em;transition:background-color .2s,border-color .2s}:where([type=file])::file-selector-button:hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where([type=date],[type=month],[type=week],[type=time],[type=datetime-local]){min-width:10em;margin-bottom:var(--nc-spacing)}:where([type=color]){--_color-size:calc(1em * 1.5 + 1em + 2px);margin-bottom:var(--nc-spacing);--_color-pad:.25em;height:var(--_color-size);width:calc((var(--_color-size) - 2 * var(--_color-pad)) * 1.618 + 2 * var(--_color-pad));padding:var(--_color-pad);background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);border:1px solid var(--nc-border);border-radius:var(--nc-radius);cursor:pointer}:where([type=color])::-webkit-color-swatch-wrapper{padding:0}:where([type=color])::-webkit-color-swatch{border-radius:calc(var(--nc-radius) * .5);border:none}:where(label:has([type=checkbox][role=switch])){align-items:center;gap:.5em;display:flex}:where([type=checkbox][role=switch]){appearance:none;background-color:var(--nc-border);cursor:pointer;border-radius:1em;flex-shrink:0;width:2.5em;height:1.25em;margin:0;transition:background-color .2s;position:relative}:where([type=checkbox][role=switch]):before{content:"";background-color:#fff;border-radius:50%;width:calc(1.25em - 4px);height:calc(1.25em - 4px);transition:transform .2s;position:absolute;top:2px;left:2px}:where([type=checkbox][role=switch]):checked{background-color:var(--nc-primary)}:where([type=checkbox][role=switch]):checked:before{transform:translate(1.25em)}:where(table){border-collapse:collapse;width:100%}:where(th,td){border-bottom:1px solid color-mix(in oklch, var(--nc-border), transparent 40%);text-align:start;padding:.5em .75em}:where(thead th,thead td){background-color:var(--nc-surface-2);text-wrap:balance;border-bottom-width:2px;font-weight:600}:where(figure:has(table)){overflow-x:auto}:where(code,kbd,samp){font-family:var(--nc-font-mono);background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:.15em .35em;font-size:.875em}:where(pre){background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:var(--nc-spacing);overflow-x:auto}:where(pre code){font-size:inherit;background:0 0;padding:0}:where(kbd){border:1px solid var(--nc-border);border-bottom-width:2px}:where(img,video,canvas,svg){max-width:100%;height:auto}:where(figure){margin:0}:where(figcaption){color:color-mix(in oklch, var(--nc-text), transparent 40%);margin-top:.5em;font-size:.9em}:where(article){background-color:var(--nc-surface-1);border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);margin-bottom:var(--nc-spacing)}:where(article>header),:where(article>footer){background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);padding:var(--nc-spacing)}:where(article>header){margin:calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1) var(--nc-spacing);border-bottom:1px solid var(--nc-border);border-radius:var(--nc-radius) var(--nc-radius) 0 0}:where(article>footer){margin:var(--nc-spacing) calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1);border-top:1px solid var(--nc-border);border-radius:0 0 var(--nc-radius) var(--nc-radius)}:where(article)>:last-child:not(footer),:where(article>header,article>footer)>:last-child{margin-bottom:0}:where(article>header,article>footer)>h1,:where(article>header,article>footer)>h2,:where(article>header,article>footer)>h3,:where(article>header,article>footer)>h4,:where(article>header,article>footer)>h5,:where(article>header,article>footer)>h6{margin-top:0;margin-bottom:0}:where(details){border:1px solid var(--nc-border);border-radius:var(--nc-radius);margin-bottom:.5em;padding:0 1em}:where(summary){cursor:pointer;margin:0 -1em;padding:.5em 1em;font-weight:600;list-style-type:"▶ "}:where(details[open]>summary){list-style-type:"▼ "}:where(summary[role=button]){width:auto;margin:0 -1em;list-style:none;display:block}:where(summary[role=button]):before{content:"▶ ";vertical-align:middle;font-size:.75em;transition:transform .2s;display:inline-block}:where(details[open]>summary[role=button]):before{transform:rotate(90deg)}:where(details[open]){padding-bottom:.5em}:where(dialog){background-color:var(--nc-surface-4);border:1px solid var(--nc-border);border-radius:var(--nc-radius);max-width:min(90vw,40rem);padding:var(--nc-spacing)}dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;animation:.2s nc-backdrop-in}@keyframes nc-backdrop-in{0%{opacity:0}}}@layer nimble.utilities{.secondary:not(a:not([role=button])){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}.secondary:not(a:not([role=button])):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}.secondary:not(a:not([role=button])):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}a:not([role=button]).secondary{color:var(--nc-secondary);-webkit-text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%)}a:not([role=button]).secondary:hover{color:var(--nc-secondary-hover);-webkit-text-decoration-color:var(--nc-secondary-hover);text-decoration-color:var(--nc-secondary-hover)}.outline:not(a:not([role=button])){color:var(--nc-primary);background-color:#0000}.outline:not(a:not([role=button])):hover{background-color:var(--nc-primary-focus);color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}.striped :where(tbody tr:nth-child(2n)){background-color:var(--nc-surface-2)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.overflow-auto{overflow:auto}}[type=date],[type=month],[type=week],[type=time],[type=datetime-local]{appearance:none}details :last-child:last-child{margin-bottom:0}@supports selector(details::details-content){details::details-content{transition:opacity .3s ease, content-visibility .3s ease allow-discrete;opacity:0}details[open]::details-content{opacity:1}@supports (interpolate-size:allow-keywords){details{interpolate-size:allow-keywords}details::details-content{transition:height .3s ease, opacity .3s ease, content-visibility .3s ease allow-discrete;height:0;overflow:clip}details[open]::details-content{height:auto}}}}
|
|
1
|
+
@layer nimble.reset{:where(:not(progress)),:where(),:where(){box-sizing:border-box;background-repeat:no-repeat}:where(html){-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5}:where(body){margin:0}:where(h1){margin-block:.67em;font-size:2em}:where(hr){height:0;color:inherit}:where(nav) :where(ol,ul){padding:0;list-style-type:none}:where(pre){font-family:monospace;font-size:1em}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace;font-size:1em}:where(small){font-size:80%}:where(sub,sup){vertical-align:baseline;font-size:75%;line-height:0;position:relative}:where(sub){bottom:-.25em}:where(sup){top:-.5em}:where(iframe){border-style:none}:where(table){border-collapse:collapse;text-indent:0;border-color:currentColor}:where(button,input,select,textarea){font:inherit;letter-spacing:inherit}:where(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){resize:vertical;overflow:auto}:where([type=search]){-webkit-appearance:textfield;outline-offset:-2px}:where(){-webkit-appearance:none}:where(),:where(){height:auto}:where(){-webkit-appearance:button;font:inherit}:where(summary){display:list-item}:where(a,area,button,input,label,select,summary,textarea,[tabindex]){touch-action:manipulation;-webkit-tap-highlight-color:transparent}:where([aria-busy=true]){cursor:progress}:where([aria-disabled=true],[disabled]){cursor:not-allowed}@media (prefers-reduced-motion:reduce){:where(*),:where(),:where(){scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}@layer nimble.base{:root{color-scheme:light dark;--nc-surface-hue:250;--nc-surface-1:light-dark(oklch(.985 .002 var(--nc-surface-hue)),oklch(.17 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-2:light-dark(oklch(.955 .002 var(--nc-surface-hue)),oklch(.2 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-3:light-dark(oklch(.925 .002 var(--nc-surface-hue)),oklch(.23 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-4:light-dark(oklch(.885 .002 var(--nc-surface-hue)),oklch(.27 .005 calc(var(--nc-surface-hue) + 10)));--nc-text:light-dark(oklch(.28 .005 var(--nc-surface-hue)),oklch(.86 .005 var(--nc-surface-hue)));--nc-border:light-dark(oklch(.83 .005 var(--nc-surface-hue)),oklch(.28 .005 calc(var(--nc-surface-hue) + 10)));--nc-primary:light-dark(oklch(50% .2 250),oklch(60% .2 250));--nc-primary-hover:light-dark(oklch(from var(--nc-primary) calc(l - .1) c h),oklch(from var(--nc-primary) calc(l + .1) c h));--nc-primary-focus:oklch(from var(--nc-primary) l c h / .4);--nc-primary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-secondary:light-dark(oklch(45% .05 250),oklch(60% .05 250));--nc-secondary-hover:light-dark(oklch(from var(--nc-secondary) calc(l - .1) c h),oklch(from var(--nc-secondary) calc(l + .1) c h));--nc-secondary-focus:oklch(from var(--nc-secondary) l c h / .3);--nc-secondary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-valid:light-dark(oklch(52% .17 145),oklch(65% .2 145));--nc-invalid:light-dark(oklch(55% .22 25),oklch(65% .22 25));--nc-font-sans:system-ui, sans-serif;--nc-font-mono:ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;--nc-spacing:1rem;--nc-radius:.25rem;--nc-content-width:60ch;--nc-content-shadow-gap:1rem;--nc-content-shadow:0 0 .15rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .02),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .015)), 0 0 .3rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .03),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .02)), 0 0 .75rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .025)), 0 0 1.35rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .03)), 0 0 2.5rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .05),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .035)), 0 0 6rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .06),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .04)), 0 0 0rem .0625rem light-dark(oklch(.55 .01 var(--nc-surface-hue) / .015),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .01))}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}html{font-family:var(--nc-font-sans);color:var(--nc-text);background-color:var(--nc-surface-1);scrollbar-gutter:stable;font-size:100%;line-height:1.5}body{grid-template-columns:1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;min-height:100dvh;padding-block:var(--nc-spacing);display:grid;position:relative}::selection{background-color:var(--nc-primary-focus);color:var(--nc-text)}body>*,body>[style*="display: contents"]>*{grid-column:3;min-width:0}@media (width>=720px){body:before{content:"";width:min(calc(var(--nc-content-width) + 2 * var(--nc-content-shadow-gap)), calc(100% - 2 * var(--nc-spacing)));box-shadow:var(--nc-content-shadow);pointer-events:none;z-index:-1;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}}}@layer nimble.utilities{.container{max-width:var(--nc-content-width);padding-inline:var(--nc-spacing);margin-inline:auto}.fluid{max-width:none;padding-inline:var(--nc-spacing);display:block}.full-bleed{box-shadow:none;grid-column:1/-1;position:relative}.grid{gap:var(--nc-spacing);margin-bottom:var(--nc-spacing);grid-template-columns:1fr;display:grid}@media (width>=720px){.grid{grid-template-columns:repeat(auto-fit,minmax(0%,1fr))}}.wide{box-shadow:none;width:100%;max-width:1200px;padding-inline:var(--nc-spacing);grid-column:1/-1;margin-inline:auto}}@media print{body{color:#000;background:#fff}a[href]:after{content:" (" attr(href) ")";color:#555;font-size:.85em}a[href^=\#]:after,a[href^=javascript\:]:after{content:none}pre,blockquote{page-break-inside:avoid}h2,h3,h4{page-break-after:avoid}img{max-width:100%!important}@page{margin:2cm}}@scope(:root) to (.no-nimble){@layer nimble.base{h1{margin-top:0;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:2rem;font-weight:700;line-height:1.1}h2{margin-top:2rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.75rem;font-weight:700;line-height:1.15}h3{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.5rem;font-weight:700;line-height:1.2}h4{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.25rem;font-weight:700;line-height:1.3}h5{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.125rem;font-weight:700;line-height:1.4}h6{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1rem;font-weight:700;line-height:1.5}@media (width<=720px){h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.3rem}}p,ul,ol,dl,blockquote,pre,table,figure,form,fieldset{margin-top:0;margin-bottom:var(--nc-spacing)}body>:first-child,body>:first-child>:first-child{margin-top:0}body>:nth-last-child(1 of :not(script,style,dialog)),body>:nth-last-child(1 of :not(script,style,dialog))>:last-child{margin-bottom:0}ul,ol{padding-inline-start:1.5em}:where(li){margin-bottom:.25em}:where(li)>:where(ul,ol){margin-bottom:0}dt{font-weight:600}dd{margin-inline-start:1.5em;margin-bottom:.5em}blockquote{margin-block:var(--nc-spacing);padding:.25em var(--nc-spacing);border-inline-start:.25rem solid var(--nc-border);margin-inline:0;font-style:italic}:where(blockquote) footer,:where(blockquote) cite{color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.9em;font-style:normal}hr{background-color:color-mix(in oklch, var(--nc-border), transparent 40%);height:1px;margin:var(--nc-spacing) 0;border:none}mark{color:light-dark(inherit,oklch(95% .01 85));background-color:light-dark(#fde68a,oklch(55% .12 85));border-radius:2px;padding:.1em .25em}address{font-style:normal}:where(a:not([role=button])){color:var(--nc-primary);text-underline-offset:.15em;text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);transition:color .2s,text-decoration-color .2s}:where(a:not([role=button])):visited{color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310));-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%);text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%)}:where(a:not([role=button])):hover{color:var(--nc-primary-hover);-webkit-text-decoration-color:var(--nc-primary-hover);text-decoration-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]){--_btn-padding-v:.5em;--_btn-padding-h:1em;padding:var(--_btn-padding-v) var(--_btn-padding-h);background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;text-align:center;margin:0;margin-block-end:.25em;font-size:1rem;line-height:1.5;text-decoration:none;transition:background-color .2s,border-color .2s;display:inline-block}:where(button,[type=submit],[type=reset],[type=button],[role=button]):hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]):focus-visible{box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where([type=reset]){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}:where([type=reset]):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}:where([type=reset]):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}:where(button,[type=submit],[type=reset],[type=button],[role=button]).inline{--_btn-padding-v:.05em;--_btn-padding-h:.4em;vertical-align:baseline;margin:.1em .15em;font-size:.875em}:where(button,[type=submit],[type=reset],[type=button],[role=button]):disabled{opacity:.5;cursor:not-allowed;pointer-events:none}:where([role=group]){margin-bottom:.25em;display:inline-flex}[role=group]>*{border-radius:0;margin:0;position:relative}[role=group]>*+*{--_divider:""}[role=group]>*+:before{content:var(--_divider);inset-inline-start:0;pointer-events:none;background:#ffffff4d;width:1px;position:absolute;top:20%;bottom:20%}[role=group]>:not(.secondary):not(.outline)+.secondary,[role=group]>.secondary+:not(.secondary):not(.outline),[role=group]>:not(.secondary):not(.outline)+.outline,[role=group]>.outline+:not(.secondary):not(.outline),[role=group]>.secondary+.outline,[role=group]>.outline+.secondary,[role=group]>input+*,[role=group]>select+*{--_divider:none}[role=group]>:first-child{border-start-start-radius:var(--nc-radius);border-end-start-radius:var(--nc-radius)}[role=group]>:last-child{border-start-end-radius:var(--nc-radius);border-end-end-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline))){border:1px solid var(--nc-primary);border-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline)))>.outline{border:none}[role=group]>.outline+.outline:before{background:var(--nc-primary)}[role=search] [role=group]>:first-child{border-start-start-radius:5rem;border-end-start-radius:5rem;padding-inline-start:1.25em}[role=search] [role=group]>:last-child{border-start-end-radius:5rem;border-end-end-radius:5rem;padding-inline-end:1.25em}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset]),select,textarea){--_input-bg:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);background-color:var(--_input-bg);border:1px solid var(--nc-border);border-radius:var(--nc-radius);min-height:calc(2.5em + 2px);color:var(--nc-text);font:inherit;padding:.5em .75em;font-size:1rem;transition:border-color .2s,box-shadow .2s}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset],[type=date],[type=month],[type=week],[type=time],[type=datetime-local]),select,textarea){width:100%;margin-bottom:var(--nc-spacing)}:where(p,div)>:where(input,select,textarea):nth-last-child(1 of :not(datalist,script,style)){margin-bottom:0}:where(input,select,textarea):focus-visible{border-color:var(--nc-primary);box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)+:where(small){margin-top:calc(var(--nc-spacing) * -.75);margin-bottom:var(--nc-spacing);color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.875em;display:block}:where(input,select,textarea)[aria-invalid=false]{border-color:var(--nc-valid)}:where(input,select,textarea)[aria-invalid=true]{border-color:var(--nc-invalid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=false]+:where(small){color:var(--nc-valid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=true]+:where(small){color:var(--nc-invalid)}:where(label){margin-bottom:.25em;display:block}:where(label:has(+input,+select,+textarea)){font-weight:600}:where(label:has(+[type=file],+[type=range])){margin-bottom:.5em}:where(fieldset){border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);min-width:0;max-width:100%}:where(fieldset)>:nth-last-child(1 of :not(datalist,script,style)),:where(fieldset)>:nth-last-child(1 of :not(datalist,script,style))>:nth-last-child(1 of :not(datalist,script,style)){margin-bottom:0}:where(legend){padding-inline:.25em;font-weight:600}:where([type=checkbox],[type=radio]){accent-color:var(--nc-primary);width:1.125em;height:1.125em;margin:0}:where(label:has([type=checkbox],[type=radio])){align-items:center;gap:.35em;margin-bottom:.5em;display:flex}:where(label:has([type=checkbox],[type=radio]):last-child){margin-bottom:0}:where([type=search]){border-radius:5rem;padding-inline:1.25em}:where([type=range]){accent-color:var(--nc-primary);width:100%;margin-bottom:var(--nc-spacing)}:where(input[list]){width:auto}:where([type=file]){color:var(--nc-text);font:inherit;cursor:pointer;max-width:100%;margin-bottom:var(--nc-spacing)}:where([type=file])::file-selector-button{margin-right:.75em;background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;margin-inline-end:.75em;padding:.5em 1em;transition:background-color .2s,border-color .2s}:where([type=file])::file-selector-button:hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where([type=date],[type=month],[type=week],[type=time],[type=datetime-local]){min-width:10em;margin-bottom:var(--nc-spacing)}:where([type=color]){--_color-size:calc(1em * 1.5 + 1em + 2px);margin-bottom:var(--nc-spacing);--_color-pad:.25em;height:var(--_color-size);width:calc((var(--_color-size) - 2 * var(--_color-pad)) * 1.618 + 2 * var(--_color-pad));padding:var(--_color-pad);background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);border:1px solid var(--nc-border);border-radius:var(--nc-radius);cursor:pointer}:where([type=color])::-webkit-color-swatch-wrapper{padding:0}:where([type=color])::-webkit-color-swatch{border-radius:calc(var(--nc-radius) * .5);border:none}:where(label:has([type=checkbox][role=switch])){align-items:center;gap:.5em;display:flex}:where([type=checkbox][role=switch]){appearance:none;background-color:var(--nc-border);cursor:pointer;border-radius:1em;flex-shrink:0;width:2.5em;height:1.25em;margin:0;transition:background-color .2s;position:relative}:where([type=checkbox][role=switch]):before{content:"";background-color:#fff;border-radius:50%;width:calc(1.25em - 4px);height:calc(1.25em - 4px);transition:transform .2s;position:absolute;top:2px;left:2px}:where([type=checkbox][role=switch]):checked{background-color:var(--nc-primary)}:where([type=checkbox][role=switch]):checked:before{transform:translate(1.25em)}:where(table){border-collapse:collapse;width:100%}:where(th,td){border-bottom:1px solid color-mix(in oklch, var(--nc-border), transparent 40%);text-align:start;padding:.5em .75em}:where(thead th,thead td){background-color:var(--nc-surface-2);text-wrap:balance;border-bottom-width:2px;font-weight:600}:where(figure:has(table)){overflow-x:auto}:where(code,kbd,samp){font-family:var(--nc-font-mono);background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:.15em .35em;font-size:.875em}:where(pre){background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:var(--nc-spacing);overflow-x:auto}:where(pre code){font-size:inherit;background:0 0;padding:0}:where(kbd){border:1px solid var(--nc-border);border-bottom-width:2px}:where(img,video,canvas,svg){max-width:100%;height:auto}:where(figure){margin:0}:where(figcaption){color:color-mix(in oklch, var(--nc-text), transparent 40%);margin-top:.5em;font-size:.9em}:where(article){background-color:var(--nc-surface-1);border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);margin-bottom:var(--nc-spacing)}:where(article>header),:where(article>footer){background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);padding:var(--nc-spacing)}:where(article>header){margin:calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1) var(--nc-spacing);border-bottom:1px solid var(--nc-border);border-radius:var(--nc-radius) var(--nc-radius) 0 0}:where(article>footer){margin:var(--nc-spacing) calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1);border-top:1px solid var(--nc-border);border-radius:0 0 var(--nc-radius) var(--nc-radius)}:where(article)>:last-child:not(footer),:where(article>header,article>footer)>:last-child{margin-bottom:0}:where(article>header,article>footer)>h1,:where(article>header,article>footer)>h2,:where(article>header,article>footer)>h3,:where(article>header,article>footer)>h4,:where(article>header,article>footer)>h5,:where(article>header,article>footer)>h6{margin-top:0;margin-bottom:0}:where(details){border:1px solid var(--nc-border);border-radius:var(--nc-radius);margin-bottom:.5em;padding:0 1em}:where(summary){cursor:pointer;margin:0 -1em;padding:.5em 1em;font-weight:600;list-style-type:"▶ "}:where(details[open]>summary){list-style-type:"▼ "}:where(summary[role=button]){width:auto;margin:0 -1em;list-style:none;display:block}:where(summary[role=button]):before{content:"▶ ";vertical-align:middle;font-size:.75em;transition:transform .2s;display:inline-block}:where(details[open]>summary[role=button]):before{transform:rotate(90deg)}:where(details[open]){padding-bottom:.5em}:where(dialog){background-color:var(--nc-surface-4);border:1px solid var(--nc-border);border-radius:var(--nc-radius);max-width:min(90vw,40rem);max-height:85vh;padding:var(--nc-spacing)}:where(dialog[open]){margin:auto;position:fixed;inset:0}:where(dialog:has(>article)){background:0 0;border:none;padding:0}:where(dialog>article){margin-bottom:0}dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;animation:.2s nc-backdrop-in}@keyframes nc-backdrop-in{0%{opacity:0}}}@layer nimble.utilities{.secondary:not(a:not([role=button])){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}.secondary:not(a:not([role=button])):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}.secondary:not(a:not([role=button])):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}a:not([role=button]).secondary{color:var(--nc-secondary);-webkit-text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%)}a:not([role=button]).secondary:hover{color:var(--nc-secondary-hover);-webkit-text-decoration-color:var(--nc-secondary-hover);text-decoration-color:var(--nc-secondary-hover)}.outline:not(a:not([role=button])){color:var(--nc-primary);background-color:#0000}.outline:not(a:not([role=button])):hover{background-color:var(--nc-primary-focus);color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}.striped :where(tbody tr:nth-child(2n)){background-color:var(--nc-surface-2)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.overflow-auto{overflow:auto}}[type=date],[type=month],[type=week],[type=time],[type=datetime-local]{appearance:none}details :last-child:last-child{margin-bottom:0}@supports selector(details::details-content){details::details-content{transition:opacity .3s ease, content-visibility .3s ease allow-discrete;opacity:0}details[open]::details-content{opacity:1}@supports (interpolate-size:allow-keywords){details{interpolate-size:allow-keywords}details::details-content{transition:height .3s ease, opacity .3s ease, content-visibility .3s ease allow-discrete;height:0;overflow:clip}details[open]::details-content{height:auto}}}}
|
package/dist/nimble-progress.css
CHANGED
|
@@ -1,71 +1,6 @@
|
|
|
1
1
|
@layer nimble.reset, nimble.base;
|
|
2
2
|
@layer nimble.base {
|
|
3
3
|
:where(progress) {
|
|
4
|
-
-webkit-appearance: none;
|
|
5
|
-
appearance: none;
|
|
6
|
-
position: relative;
|
|
7
4
|
width: 100%;
|
|
8
|
-
height: 0.5rem;
|
|
9
|
-
overflow: hidden;
|
|
10
|
-
border: 0;
|
|
11
|
-
border-radius: var(--nc-radius);
|
|
12
|
-
background-color: var(--nc-surface-3);
|
|
13
|
-
color: var(--nc-primary);
|
|
14
|
-
}
|
|
15
|
-
:where(progress)::-webkit-progress-bar {
|
|
16
|
-
border-radius: var(--nc-radius);
|
|
17
|
-
background-color: var(--nc-surface-3);
|
|
18
|
-
}
|
|
19
|
-
:where(progress)::-webkit-progress-value {
|
|
20
|
-
background-color: var(--nc-primary);
|
|
21
|
-
border-radius: var(--nc-radius);
|
|
22
|
-
transition: inline-size 0.3s ease;
|
|
23
|
-
}
|
|
24
|
-
:where(progress)::-moz-progress-bar {
|
|
25
|
-
background-color: var(--nc-primary);
|
|
26
|
-
border-radius: var(--nc-radius);
|
|
27
|
-
}
|
|
28
|
-
:where(progress):not([value]) {
|
|
29
|
-
--nc-progress-track:
|
|
30
|
-
linear-gradient(to right,
|
|
31
|
-
var(--nc-surface-3) 0%,
|
|
32
|
-
var(--nc-primary) 25%,
|
|
33
|
-
var(--nc-primary) 25%,
|
|
34
|
-
var(--nc-surface-3) 50%,
|
|
35
|
-
var(--nc-surface-3) 50%,
|
|
36
|
-
var(--nc-primary) 75%,
|
|
37
|
-
var(--nc-primary) 75%,
|
|
38
|
-
var(--nc-surface-3) 100%);
|
|
39
|
-
--nc-progress-track-size: 200% 100%;
|
|
40
|
-
}
|
|
41
|
-
@media (prefers-reduced-motion: no-preference) {
|
|
42
|
-
@supports selector(progress::after) {
|
|
43
|
-
:where(progress):not([value])::after {
|
|
44
|
-
content: "";
|
|
45
|
-
position: absolute;
|
|
46
|
-
inset: 0;
|
|
47
|
-
background: var(--nc-progress-track);
|
|
48
|
-
background-size: var(--nc-progress-track-size);
|
|
49
|
-
animation: nc-progress-indeterminate 12s linear infinite;
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
:where(progress):not([value])::-webkit-progress-bar {
|
|
53
|
-
background: var(--nc-progress-track);
|
|
54
|
-
background-size: var(--nc-progress-track-size);
|
|
55
|
-
animation: nc-progress-indeterminate 12s linear infinite;
|
|
56
|
-
}
|
|
57
|
-
:where(progress):not([value])::-moz-progress-bar {
|
|
58
|
-
background: var(--nc-progress-track);
|
|
59
|
-
background-size: var(--nc-progress-track-size);
|
|
60
|
-
animation: nc-progress-indeterminate 12s linear infinite;
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
@keyframes nc-progress-indeterminate {
|
|
64
|
-
from {
|
|
65
|
-
background-position: 0% 0%;
|
|
66
|
-
}
|
|
67
|
-
to {
|
|
68
|
-
background-position: -200% 0%;
|
|
69
|
-
}
|
|
70
5
|
}
|
|
71
6
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer nimble.reset;@layer nimble.base{:where(progress){
|
|
1
|
+
@layer nimble.reset;@layer nimble.base{:where(progress){width:100%}}
|
package/dist/nimble.css
CHANGED
|
@@ -168,6 +168,7 @@
|
|
|
168
168
|
display: grid;
|
|
169
169
|
grid-template-columns: 1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;
|
|
170
170
|
min-height: 100dvh;
|
|
171
|
+
padding-block: var(--nc-spacing);
|
|
171
172
|
position: relative;
|
|
172
173
|
}
|
|
173
174
|
::selection {
|
|
@@ -215,6 +216,17 @@
|
|
|
215
216
|
box-shadow: none;
|
|
216
217
|
position: relative;
|
|
217
218
|
}
|
|
219
|
+
.grid {
|
|
220
|
+
display: grid;
|
|
221
|
+
grid-template-columns: 1fr;
|
|
222
|
+
gap: var(--nc-spacing);
|
|
223
|
+
margin-bottom: var(--nc-spacing);
|
|
224
|
+
}
|
|
225
|
+
@media (min-width: 720px) {
|
|
226
|
+
.grid {
|
|
227
|
+
grid-template-columns: repeat(auto-fit, minmax(0%, 1fr));
|
|
228
|
+
}
|
|
229
|
+
}
|
|
218
230
|
.wide {
|
|
219
231
|
grid-column: 1/-1;
|
|
220
232
|
box-shadow: none;
|
|
@@ -316,6 +328,14 @@
|
|
|
316
328
|
margin-top: 0;
|
|
317
329
|
margin-bottom: var(--nc-spacing);
|
|
318
330
|
}
|
|
331
|
+
body > :first-child,
|
|
332
|
+
body > :first-child > :first-child {
|
|
333
|
+
margin-top: 0;
|
|
334
|
+
}
|
|
335
|
+
body > :nth-last-child(1 of :not(script, style, dialog)),
|
|
336
|
+
body > :nth-last-child(1 of :not(script, style, dialog)) > :last-child {
|
|
337
|
+
margin-bottom: 0;
|
|
338
|
+
}
|
|
319
339
|
ul, ol {
|
|
320
340
|
padding-inline-start: 1.5em;
|
|
321
341
|
}
|
|
@@ -397,6 +417,9 @@
|
|
|
397
417
|
margin: 0;
|
|
398
418
|
transition: background-color 0.2s, border-color 0.2s;
|
|
399
419
|
}
|
|
420
|
+
:where(button, [type=submit], [type=reset], [type=button], [role=button]) {
|
|
421
|
+
margin-block-end: 0.25em;
|
|
422
|
+
}
|
|
400
423
|
:where(button, [type=submit], [type=reset], [type=button], [role=button]):hover {
|
|
401
424
|
background-color: var(--nc-primary-hover);
|
|
402
425
|
border-color: var(--nc-primary-hover);
|
|
@@ -431,7 +454,7 @@
|
|
|
431
454
|
}
|
|
432
455
|
:where([role=group]) {
|
|
433
456
|
display: inline-flex;
|
|
434
|
-
margin-bottom:
|
|
457
|
+
margin-bottom: 0.25em;
|
|
435
458
|
}
|
|
436
459
|
[role=group] > * {
|
|
437
460
|
border-radius: 0;
|
|
@@ -546,6 +569,9 @@
|
|
|
546
569
|
width: 100%;
|
|
547
570
|
margin-bottom: var(--nc-spacing);
|
|
548
571
|
}
|
|
572
|
+
:where(p, div) > :where(input, select, textarea):nth-last-child(1 of :not(datalist, script, style)) {
|
|
573
|
+
margin-bottom: 0;
|
|
574
|
+
}
|
|
549
575
|
:where(input, select, textarea):focus-visible {
|
|
550
576
|
border-color: var(--nc-primary);
|
|
551
577
|
box-shadow: 0 0 0 2px var(--nc-primary-focus);
|
|
@@ -587,6 +613,10 @@
|
|
|
587
613
|
min-width: 0;
|
|
588
614
|
max-width: 100%;
|
|
589
615
|
}
|
|
616
|
+
:where(fieldset) > :nth-last-child(1 of :not(datalist, script, style)),
|
|
617
|
+
:where(fieldset) > :nth-last-child(1 of :not(datalist, script, style)) > :nth-last-child(1 of :not(datalist, script, style)) {
|
|
618
|
+
margin-bottom: 0;
|
|
619
|
+
}
|
|
590
620
|
:where(legend) {
|
|
591
621
|
font-weight: 600;
|
|
592
622
|
padding-inline: 0.25em;
|
|
@@ -874,8 +904,22 @@
|
|
|
874
904
|
border: 1px solid var(--nc-border);
|
|
875
905
|
border-radius: var(--nc-radius);
|
|
876
906
|
max-width: min(90vw, 40rem);
|
|
907
|
+
max-height: 85vh;
|
|
877
908
|
padding: var(--nc-spacing);
|
|
878
909
|
}
|
|
910
|
+
:where(dialog[open]) {
|
|
911
|
+
position: fixed;
|
|
912
|
+
inset: 0;
|
|
913
|
+
margin: auto;
|
|
914
|
+
}
|
|
915
|
+
:where(dialog:has(> article)) {
|
|
916
|
+
background: none;
|
|
917
|
+
border: none;
|
|
918
|
+
padding: 0;
|
|
919
|
+
}
|
|
920
|
+
:where(dialog > article) {
|
|
921
|
+
margin-bottom: 0;
|
|
922
|
+
}
|
|
879
923
|
dialog::backdrop {
|
|
880
924
|
background: rgba(0, 0, 0, 0.5);
|
|
881
925
|
backdrop-filter: blur(4px);
|
|
@@ -908,72 +952,7 @@
|
|
|
908
952
|
}
|
|
909
953
|
@layer nimble.base {
|
|
910
954
|
:where(progress) {
|
|
911
|
-
-webkit-appearance: none;
|
|
912
|
-
appearance: none;
|
|
913
|
-
position: relative;
|
|
914
955
|
width: 100%;
|
|
915
|
-
height: 0.5rem;
|
|
916
|
-
overflow: hidden;
|
|
917
|
-
border: 0;
|
|
918
|
-
border-radius: var(--nc-radius);
|
|
919
|
-
background-color: var(--nc-surface-3);
|
|
920
|
-
color: var(--nc-primary);
|
|
921
|
-
}
|
|
922
|
-
:where(progress)::-webkit-progress-bar {
|
|
923
|
-
border-radius: var(--nc-radius);
|
|
924
|
-
background-color: var(--nc-surface-3);
|
|
925
|
-
}
|
|
926
|
-
:where(progress)::-webkit-progress-value {
|
|
927
|
-
background-color: var(--nc-primary);
|
|
928
|
-
border-radius: var(--nc-radius);
|
|
929
|
-
transition: inline-size 0.3s ease;
|
|
930
|
-
}
|
|
931
|
-
:where(progress)::-moz-progress-bar {
|
|
932
|
-
background-color: var(--nc-primary);
|
|
933
|
-
border-radius: var(--nc-radius);
|
|
934
|
-
}
|
|
935
|
-
:where(progress):not([value]) {
|
|
936
|
-
--nc-progress-track:
|
|
937
|
-
linear-gradient(to right,
|
|
938
|
-
var(--nc-surface-3) 0%,
|
|
939
|
-
var(--nc-primary) 25%,
|
|
940
|
-
var(--nc-primary) 25%,
|
|
941
|
-
var(--nc-surface-3) 50%,
|
|
942
|
-
var(--nc-surface-3) 50%,
|
|
943
|
-
var(--nc-primary) 75%,
|
|
944
|
-
var(--nc-primary) 75%,
|
|
945
|
-
var(--nc-surface-3) 100%);
|
|
946
|
-
--nc-progress-track-size: 200% 100%;
|
|
947
|
-
}
|
|
948
|
-
@media (prefers-reduced-motion: no-preference) {
|
|
949
|
-
@supports selector(progress::after) {
|
|
950
|
-
:where(progress):not([value])::after {
|
|
951
|
-
content: "";
|
|
952
|
-
position: absolute;
|
|
953
|
-
inset: 0;
|
|
954
|
-
background: var(--nc-progress-track);
|
|
955
|
-
background-size: var(--nc-progress-track-size);
|
|
956
|
-
animation: nc-progress-indeterminate 12s linear infinite;
|
|
957
|
-
}
|
|
958
|
-
}
|
|
959
|
-
:where(progress):not([value])::-webkit-progress-bar {
|
|
960
|
-
background: var(--nc-progress-track);
|
|
961
|
-
background-size: var(--nc-progress-track-size);
|
|
962
|
-
animation: nc-progress-indeterminate 12s linear infinite;
|
|
963
|
-
}
|
|
964
|
-
:where(progress):not([value])::-moz-progress-bar {
|
|
965
|
-
background: var(--nc-progress-track);
|
|
966
|
-
background-size: var(--nc-progress-track-size);
|
|
967
|
-
animation: nc-progress-indeterminate 12s linear infinite;
|
|
968
|
-
}
|
|
969
|
-
}
|
|
970
|
-
@keyframes nc-progress-indeterminate {
|
|
971
|
-
from {
|
|
972
|
-
background-position: 0% 0%;
|
|
973
|
-
}
|
|
974
|
-
to {
|
|
975
|
-
background-position: -200% 0%;
|
|
976
|
-
}
|
|
977
956
|
}
|
|
978
957
|
}
|
|
979
958
|
@layer nimble.base {
|
package/dist/nimble.min.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
@layer nimble.reset{:where(:not(progress)),:where(),:where(){box-sizing:border-box;background-repeat:no-repeat}:where(html){-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5}:where(body){margin:0}:where(h1){margin-block:.67em;font-size:2em}:where(hr){height:0;color:inherit}:where(nav) :where(ol,ul){padding:0;list-style-type:none}:where(pre){font-family:monospace;font-size:1em}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace;font-size:1em}:where(small){font-size:80%}:where(sub,sup){vertical-align:baseline;font-size:75%;line-height:0;position:relative}:where(sub){bottom:-.25em}:where(sup){top:-.5em}:where(iframe){border-style:none}:where(table){border-collapse:collapse;text-indent:0;border-color:currentColor}:where(button,input,select,textarea){font:inherit;letter-spacing:inherit}:where(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){resize:vertical;overflow:auto}:where([type=search]){-webkit-appearance:textfield;outline-offset:-2px}:where(){-webkit-appearance:none}:where(),:where(){height:auto}:where(){-webkit-appearance:button;font:inherit}:where(summary){display:list-item}:where(a,area,button,input,label,select,summary,textarea,[tabindex]){touch-action:manipulation;-webkit-tap-highlight-color:transparent}:where([aria-busy=true]){cursor:progress}:where([aria-disabled=true],[disabled]){cursor:not-allowed}@media (prefers-reduced-motion:reduce){:where(*),:where(),:where(){scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}@layer nimble.base{:root{color-scheme:light dark;--nc-surface-hue:250;--nc-surface-1:light-dark(oklch(.985 .002 var(--nc-surface-hue)),oklch(.17 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-2:light-dark(oklch(.955 .002 var(--nc-surface-hue)),oklch(.2 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-3:light-dark(oklch(.925 .002 var(--nc-surface-hue)),oklch(.23 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-4:light-dark(oklch(.885 .002 var(--nc-surface-hue)),oklch(.27 .005 calc(var(--nc-surface-hue) + 10)));--nc-text:light-dark(oklch(.28 .005 var(--nc-surface-hue)),oklch(.86 .005 var(--nc-surface-hue)));--nc-border:light-dark(oklch(.83 .005 var(--nc-surface-hue)),oklch(.28 .005 calc(var(--nc-surface-hue) + 10)));--nc-primary:light-dark(oklch(50% .2 250),oklch(60% .2 250));--nc-primary-hover:light-dark(oklch(from var(--nc-primary) calc(l - .1) c h),oklch(from var(--nc-primary) calc(l + .1) c h));--nc-primary-focus:oklch(from var(--nc-primary) l c h / .4);--nc-primary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-secondary:light-dark(oklch(45% .05 250),oklch(60% .05 250));--nc-secondary-hover:light-dark(oklch(from var(--nc-secondary) calc(l - .1) c h),oklch(from var(--nc-secondary) calc(l + .1) c h));--nc-secondary-focus:oklch(from var(--nc-secondary) l c h / .3);--nc-secondary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-valid:light-dark(oklch(52% .17 145),oklch(65% .2 145));--nc-invalid:light-dark(oklch(55% .22 25),oklch(65% .22 25));--nc-font-sans:system-ui, sans-serif;--nc-font-mono:ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;--nc-spacing:1rem;--nc-radius:.25rem;--nc-content-width:60ch;--nc-content-shadow-gap:1rem;--nc-content-shadow:0 0 .15rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .02),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .015)), 0 0 .3rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .03),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .02)), 0 0 .75rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .025)), 0 0 1.35rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .03)), 0 0 2.5rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .05),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .035)), 0 0 6rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .06),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .04)), 0 0 0rem .0625rem light-dark(oklch(.55 .01 var(--nc-surface-hue) / .015),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .01))}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}html{font-family:var(--nc-font-sans);color:var(--nc-text);background-color:var(--nc-surface-1);scrollbar-gutter:stable;font-size:100%;line-height:1.5}body{grid-template-columns:1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;min-height:100dvh;display:grid;position:relative}::selection{background-color:var(--nc-primary-focus);color:var(--nc-text)}body>*,body>[style*="display: contents"]>*{grid-column:3;min-width:0}@media (width>=720px){body:before{content:"";width:min(calc(var(--nc-content-width) + 2 * var(--nc-content-shadow-gap)), calc(100% - 2 * var(--nc-spacing)));box-shadow:var(--nc-content-shadow);pointer-events:none;z-index:-1;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}}}@layer nimble.utilities{.container{max-width:var(--nc-content-width);padding-inline:var(--nc-spacing);margin-inline:auto}.fluid{max-width:none;padding-inline:var(--nc-spacing);display:block}.full-bleed{box-shadow:none;grid-column:1/-1;position:relative}.wide{box-shadow:none;width:100%;max-width:1200px;padding-inline:var(--nc-spacing);grid-column:1/-1;margin-inline:auto}}@media print{body{color:#000;background:#fff}a[href]:after{content:" (" attr(href) ")";color:#555;font-size:.85em}a[href^=\#]:after,a[href^=javascript\:]:after{content:none}pre,blockquote{page-break-inside:avoid}h2,h3,h4{page-break-after:avoid}img{max-width:100%!important}@page{margin:2cm}}@scope(:root) to (.no-nimble){@layer nimble.base{h1{margin-top:0;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:2rem;font-weight:700;line-height:1.1}h2{margin-top:2rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.75rem;font-weight:700;line-height:1.15}h3{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.5rem;font-weight:700;line-height:1.2}h4{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.25rem;font-weight:700;line-height:1.3}h5{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.125rem;font-weight:700;line-height:1.4}h6{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1rem;font-weight:700;line-height:1.5}@media (width<=720px){h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.3rem}}p,ul,ol,dl,blockquote,pre,table,figure,form,fieldset{margin-top:0;margin-bottom:var(--nc-spacing)}ul,ol{padding-inline-start:1.5em}:where(li){margin-bottom:.25em}:where(li)>:where(ul,ol){margin-bottom:0}dt{font-weight:600}dd{margin-inline-start:1.5em;margin-bottom:.5em}blockquote{margin-block:var(--nc-spacing);padding:.25em var(--nc-spacing);border-inline-start:.25rem solid var(--nc-border);margin-inline:0;font-style:italic}:where(blockquote) footer,:where(blockquote) cite{color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.9em;font-style:normal}hr{background-color:color-mix(in oklch, var(--nc-border), transparent 40%);height:1px;margin:var(--nc-spacing) 0;border:none}mark{color:light-dark(inherit,oklch(95% .01 85));background-color:light-dark(#fde68a,oklch(55% .12 85));border-radius:2px;padding:.1em .25em}address{font-style:normal}:where(a:not([role=button])){color:var(--nc-primary);text-underline-offset:.15em;text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);transition:color .2s,text-decoration-color .2s}:where(a:not([role=button])):visited{color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310));-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%);text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%)}:where(a:not([role=button])):hover{color:var(--nc-primary-hover);-webkit-text-decoration-color:var(--nc-primary-hover);text-decoration-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]){--_btn-padding-v:.5em;--_btn-padding-h:1em;padding:var(--_btn-padding-v) var(--_btn-padding-h);background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;text-align:center;margin:0;font-size:1rem;line-height:1.5;text-decoration:none;transition:background-color .2s,border-color .2s;display:inline-block}:where(button,[type=submit],[type=reset],[type=button],[role=button]):hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]):focus-visible{box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where([type=reset]){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}:where([type=reset]):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}:where([type=reset]):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}:where(button,[type=submit],[type=reset],[type=button],[role=button]).inline{--_btn-padding-v:.05em;--_btn-padding-h:.4em;vertical-align:baseline;margin:.1em .15em;font-size:.875em}:where(button,[type=submit],[type=reset],[type=button],[role=button]):disabled{opacity:.5;cursor:not-allowed;pointer-events:none}:where([role=group]){margin-bottom:var(--nc-spacing);display:inline-flex}[role=group]>*{border-radius:0;margin:0;position:relative}[role=group]>*+*{--_divider:""}[role=group]>*+:before{content:var(--_divider);inset-inline-start:0;pointer-events:none;background:#ffffff4d;width:1px;position:absolute;top:20%;bottom:20%}[role=group]>:not(.secondary):not(.outline)+.secondary,[role=group]>.secondary+:not(.secondary):not(.outline),[role=group]>:not(.secondary):not(.outline)+.outline,[role=group]>.outline+:not(.secondary):not(.outline),[role=group]>.secondary+.outline,[role=group]>.outline+.secondary,[role=group]>input+*,[role=group]>select+*{--_divider:none}[role=group]>:first-child{border-start-start-radius:var(--nc-radius);border-end-start-radius:var(--nc-radius)}[role=group]>:last-child{border-start-end-radius:var(--nc-radius);border-end-end-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline))){border:1px solid var(--nc-primary);border-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline)))>.outline{border:none}[role=group]>.outline+.outline:before{background:var(--nc-primary)}[role=search] [role=group]>:first-child{border-start-start-radius:5rem;border-end-start-radius:5rem;padding-inline-start:1.25em}[role=search] [role=group]>:last-child{border-start-end-radius:5rem;border-end-end-radius:5rem;padding-inline-end:1.25em}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset]),select,textarea){--_input-bg:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);background-color:var(--_input-bg);border:1px solid var(--nc-border);border-radius:var(--nc-radius);min-height:calc(2.5em + 2px);color:var(--nc-text);font:inherit;padding:.5em .75em;font-size:1rem;transition:border-color .2s,box-shadow .2s}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset],[type=date],[type=month],[type=week],[type=time],[type=datetime-local]),select,textarea){width:100%;margin-bottom:var(--nc-spacing)}:where(input,select,textarea):focus-visible{border-color:var(--nc-primary);box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)+:where(small){margin-top:calc(var(--nc-spacing) * -.75);margin-bottom:var(--nc-spacing);color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.875em;display:block}:where(input,select,textarea)[aria-invalid=false]{border-color:var(--nc-valid)}:where(input,select,textarea)[aria-invalid=true]{border-color:var(--nc-invalid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=false]+:where(small){color:var(--nc-valid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=true]+:where(small){color:var(--nc-invalid)}:where(label){margin-bottom:.25em;display:block}:where(label:has(+input,+select,+textarea)){font-weight:600}:where(label:has(+[type=file],+[type=range])){margin-bottom:.5em}:where(fieldset){border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);min-width:0;max-width:100%}:where(legend){padding-inline:.25em;font-weight:600}:where([type=checkbox],[type=radio]){accent-color:var(--nc-primary);width:1.125em;height:1.125em;margin:0}:where(label:has([type=checkbox],[type=radio])){align-items:center;gap:.35em;margin-bottom:.5em;display:flex}:where(label:has([type=checkbox],[type=radio]):last-child){margin-bottom:0}:where([type=search]){border-radius:5rem;padding-inline:1.25em}:where([type=range]){accent-color:var(--nc-primary);width:100%;margin-bottom:var(--nc-spacing)}:where(input[list]){width:auto}:where([type=file]){color:var(--nc-text);font:inherit;cursor:pointer;max-width:100%;margin-bottom:var(--nc-spacing)}:where([type=file])::file-selector-button{margin-right:.75em;background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;margin-inline-end:.75em;padding:.5em 1em;transition:background-color .2s,border-color .2s}:where([type=file])::file-selector-button:hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where([type=date],[type=month],[type=week],[type=time],[type=datetime-local]){min-width:10em;margin-bottom:var(--nc-spacing)}:where([type=color]){--_color-size:calc(1em * 1.5 + 1em + 2px);margin-bottom:var(--nc-spacing);--_color-pad:.25em;height:var(--_color-size);width:calc((var(--_color-size) - 2 * var(--_color-pad)) * 1.618 + 2 * var(--_color-pad));padding:var(--_color-pad);background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);border:1px solid var(--nc-border);border-radius:var(--nc-radius);cursor:pointer}:where([type=color])::-webkit-color-swatch-wrapper{padding:0}:where([type=color])::-webkit-color-swatch{border-radius:calc(var(--nc-radius) * .5);border:none}:where(label:has([type=checkbox][role=switch])){align-items:center;gap:.5em;display:flex}:where([type=checkbox][role=switch]){appearance:none;background-color:var(--nc-border);cursor:pointer;border-radius:1em;flex-shrink:0;width:2.5em;height:1.25em;margin:0;transition:background-color .2s;position:relative}:where([type=checkbox][role=switch]):before{content:"";background-color:#fff;border-radius:50%;width:calc(1.25em - 4px);height:calc(1.25em - 4px);transition:transform .2s;position:absolute;top:2px;left:2px}:where([type=checkbox][role=switch]):checked{background-color:var(--nc-primary)}:where([type=checkbox][role=switch]):checked:before{transform:translate(1.25em)}:where(table){border-collapse:collapse;width:100%}:where(th,td){border-bottom:1px solid color-mix(in oklch, var(--nc-border), transparent 40%);text-align:start;padding:.5em .75em}:where(thead th,thead td){background-color:var(--nc-surface-2);text-wrap:balance;border-bottom-width:2px;font-weight:600}:where(figure:has(table)){overflow-x:auto}:where(code,kbd,samp){font-family:var(--nc-font-mono);background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:.15em .35em;font-size:.875em}:where(pre){background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:var(--nc-spacing);overflow-x:auto}:where(pre code){font-size:inherit;background:0 0;padding:0}:where(kbd){border:1px solid var(--nc-border);border-bottom-width:2px}:where(img,video,canvas,svg){max-width:100%;height:auto}:where(figure){margin:0}:where(figcaption){color:color-mix(in oklch, var(--nc-text), transparent 40%);margin-top:.5em;font-size:.9em}:where(article){background-color:var(--nc-surface-1);border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);margin-bottom:var(--nc-spacing)}:where(article>header),:where(article>footer){background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);padding:var(--nc-spacing)}:where(article>header){margin:calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1) var(--nc-spacing);border-bottom:1px solid var(--nc-border);border-radius:var(--nc-radius) var(--nc-radius) 0 0}:where(article>footer){margin:var(--nc-spacing) calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1);border-top:1px solid var(--nc-border);border-radius:0 0 var(--nc-radius) var(--nc-radius)}:where(article)>:last-child:not(footer),:where(article>header,article>footer)>:last-child{margin-bottom:0}:where(article>header,article>footer)>h1,:where(article>header,article>footer)>h2,:where(article>header,article>footer)>h3,:where(article>header,article>footer)>h4,:where(article>header,article>footer)>h5,:where(article>header,article>footer)>h6{margin-top:0;margin-bottom:0}:where(details){border:1px solid var(--nc-border);border-radius:var(--nc-radius);margin-bottom:.5em;padding:0 1em}:where(summary){cursor:pointer;margin:0 -1em;padding:.5em 1em;font-weight:600;list-style-type:"▶ "}:where(details[open]>summary){list-style-type:"▼ "}:where(summary[role=button]){width:auto;margin:0 -1em;list-style:none;display:block}:where(summary[role=button]):before{content:"▶ ";vertical-align:middle;font-size:.75em;transition:transform .2s;display:inline-block}:where(details[open]>summary[role=button]):before{transform:rotate(90deg)}:where(details[open]){padding-bottom:.5em}:where(dialog){background-color:var(--nc-surface-4);border:1px solid var(--nc-border);border-radius:var(--nc-radius);max-width:min(90vw,40rem);padding:var(--nc-spacing)}dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;animation:.2s nc-backdrop-in}@keyframes nc-backdrop-in{0%{opacity:0}}:where(progress){appearance:none;border-radius:var(--nc-radius);background-color:var(--nc-surface-3);width:100%;height:.5rem;color:var(--nc-primary);border:0;position:relative;overflow:hidden}:where(progress)::-webkit-progress-bar{border-radius:var(--nc-radius);background-color:var(--nc-surface-3)}:where(progress)::-webkit-progress-value{background-color:var(--nc-primary);border-radius:var(--nc-radius);transition:inline-size .3s}:where(progress)::-moz-progress-bar{background-color:var(--nc-primary);border-radius:var(--nc-radius)}:where(progress):not([value]){--nc-progress-track:linear-gradient(to right, var(--nc-surface-3) 0%, var(--nc-primary) 25%, var(--nc-primary) 25%, var(--nc-surface-3) 50%, var(--nc-surface-3) 50%, var(--nc-primary) 75%, var(--nc-primary) 75%, var(--nc-surface-3) 100%);--nc-progress-track-size:200% 100%}@media (prefers-reduced-motion:no-preference){@supports selector(progress::after){:where(progress):not([value]):after{content:"";background:var(--nc-progress-track);background-size:var(--nc-progress-track-size);animation:12s linear infinite nc-progress-indeterminate;position:absolute;inset:0}}:where(progress):not([value])::-webkit-progress-bar{background:var(--nc-progress-track);background-size:var(--nc-progress-track-size);animation:12s linear infinite nc-progress-indeterminate}:where(progress):not([value])::-moz-progress-bar{background:var(--nc-progress-track);background-size:var(--nc-progress-track-size);animation:12s linear infinite nc-progress-indeterminate}}@keyframes nc-progress-indeterminate{0%{background-position:0 0}to{background-position:-200% 0}}:where(meter){appearance:none;border-radius:var(--nc-radius);background-color:var(--nc-surface-3);border:0;width:100%;height:.5rem;overflow:hidden}:where(meter)::-webkit-meter-bar{border-radius:var(--nc-radius);background-color:var(--nc-surface-3);border:0;height:.5rem}:where(meter)::-webkit-meter-optimum-value{background-color:var(--nc-valid);border-radius:var(--nc-radius)}:where(meter)::-webkit-meter-suboptimum-value{background-color:var(--nc-primary);border-radius:var(--nc-radius)}:where(meter)::-webkit-meter-even-less-good-value{background-color:var(--nc-invalid);border-radius:var(--nc-radius)}:where(meter)::-moz-meter-bar{background-color:var(--nc-primary);border-radius:var(--nc-radius)}:where(meter):-moz-meter-optimum::-moz-meter-bar{background-color:var(--nc-valid)}:where(meter):-moz-meter-sub-optimum::-moz-meter-bar{background-color:var(--nc-primary)}:where(meter):-moz-meter-sub-sub-optimum::-moz-meter-bar{background-color:var(--nc-invalid)}@supports (appearance:base-select){:where(select){appearance:base-select}:where(select)::picker(select){appearance:base-select}:where(select)::picker-icon{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2l6 6 6-6'/%3E%3C/svg%3E");transition:rotate .4s}:where(select):open::picker-icon{rotate:180deg}:where(select)::picker(select){position-area:block-end;position-try-order:normal;position-try-fallbacks:flip-block;border:1px solid var(--nc-border);border-radius:var(--nc-radius);background-color:var(--nc-surface-1);opacity:0;transition:opacity .2s, overlay .2s allow-discrete, display .2s allow-discrete;padding:.25em}:where(select):open::picker(select){opacity:1}@starting-style{:where(select):open::picker(select){opacity:0}}:where(select) option{border-radius:var(--nc-radius);padding:.5em .75em;transition:background-color .15s}:where(select) option:hover{background-color:var(--nc-surface-2)}:where(select) option:checked{font-weight:600}}}@layer nimble.utilities{.secondary:not(a:not([role=button])){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}.secondary:not(a:not([role=button])):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}.secondary:not(a:not([role=button])):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}a:not([role=button]).secondary{color:var(--nc-secondary);-webkit-text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%)}a:not([role=button]).secondary:hover{color:var(--nc-secondary-hover);-webkit-text-decoration-color:var(--nc-secondary-hover);text-decoration-color:var(--nc-secondary-hover)}.outline:not(a:not([role=button])){color:var(--nc-primary);background-color:#0000}.outline:not(a:not([role=button])):hover{background-color:var(--nc-primary-focus);color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}.striped :where(tbody tr:nth-child(2n)){background-color:var(--nc-surface-2)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.overflow-auto{overflow:auto}}[type=date],[type=month],[type=week],[type=time],[type=datetime-local]{appearance:none}details :last-child:last-child{margin-bottom:0}@supports selector(details::details-content){details::details-content{transition:opacity .3s ease, content-visibility .3s ease allow-discrete;opacity:0}details[open]::details-content{opacity:1}@supports (interpolate-size:allow-keywords){details{interpolate-size:allow-keywords}details::details-content{transition:height .3s ease, opacity .3s ease, content-visibility .3s ease allow-discrete;height:0;overflow:clip}details[open]::details-content{height:auto}}}}
|
|
1
|
+
@layer nimble.reset{:where(:not(progress)),:where(),:where(){box-sizing:border-box;background-repeat:no-repeat}:where(html){-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5}:where(body){margin:0}:where(h1){margin-block:.67em;font-size:2em}:where(hr){height:0;color:inherit}:where(nav) :where(ol,ul){padding:0;list-style-type:none}:where(pre){font-family:monospace;font-size:1em}:where(abbr[title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}:where(b,strong){font-weight:bolder}:where(code,kbd,samp){font-family:monospace;font-size:1em}:where(small){font-size:80%}:where(sub,sup){vertical-align:baseline;font-size:75%;line-height:0;position:relative}:where(sub){bottom:-.25em}:where(sup){top:-.5em}:where(iframe){border-style:none}:where(table){border-collapse:collapse;text-indent:0;border-color:currentColor}:where(button,input,select,textarea){font:inherit;letter-spacing:inherit}:where(button,[type=button],[type=reset],[type=submit]){-webkit-appearance:button}:where(fieldset){border:1px solid #a0a0a0}:where(progress){vertical-align:baseline}:where(textarea){resize:vertical;overflow:auto}:where([type=search]){-webkit-appearance:textfield;outline-offset:-2px}:where(){-webkit-appearance:none}:where(),:where(){height:auto}:where(){-webkit-appearance:button;font:inherit}:where(summary){display:list-item}:where(a,area,button,input,label,select,summary,textarea,[tabindex]){touch-action:manipulation;-webkit-tap-highlight-color:transparent}:where([aria-busy=true]){cursor:progress}:where([aria-disabled=true],[disabled]){cursor:not-allowed}@media (prefers-reduced-motion:reduce){:where(*),:where(),:where(){scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}}@layer nimble.base{:root{color-scheme:light dark;--nc-surface-hue:250;--nc-surface-1:light-dark(oklch(.985 .002 var(--nc-surface-hue)),oklch(.17 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-2:light-dark(oklch(.955 .002 var(--nc-surface-hue)),oklch(.2 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-3:light-dark(oklch(.925 .002 var(--nc-surface-hue)),oklch(.23 .005 calc(var(--nc-surface-hue) + 10)));--nc-surface-4:light-dark(oklch(.885 .002 var(--nc-surface-hue)),oklch(.27 .005 calc(var(--nc-surface-hue) + 10)));--nc-text:light-dark(oklch(.28 .005 var(--nc-surface-hue)),oklch(.86 .005 var(--nc-surface-hue)));--nc-border:light-dark(oklch(.83 .005 var(--nc-surface-hue)),oklch(.28 .005 calc(var(--nc-surface-hue) + 10)));--nc-primary:light-dark(oklch(50% .2 250),oklch(60% .2 250));--nc-primary-hover:light-dark(oklch(from var(--nc-primary) calc(l - .1) c h),oklch(from var(--nc-primary) calc(l + .1) c h));--nc-primary-focus:oklch(from var(--nc-primary) l c h / .4);--nc-primary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-secondary:light-dark(oklch(45% .05 250),oklch(60% .05 250));--nc-secondary-hover:light-dark(oklch(from var(--nc-secondary) calc(l - .1) c h),oklch(from var(--nc-secondary) calc(l + .1) c h));--nc-secondary-focus:oklch(from var(--nc-secondary) l c h / .3);--nc-secondary-contrast:light-dark(#fff,oklch(15% .005 250));--nc-valid:light-dark(oklch(52% .17 145),oklch(65% .2 145));--nc-invalid:light-dark(oklch(55% .22 25),oklch(65% .22 25));--nc-font-sans:system-ui, sans-serif;--nc-font-mono:ui-monospace, Cascadia Code, Source Code Pro, Menlo, Consolas, DejaVu Sans Mono, monospace;--nc-spacing:1rem;--nc-radius:.25rem;--nc-content-width:60ch;--nc-content-shadow-gap:1rem;--nc-content-shadow:0 0 .15rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .02),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .015)), 0 0 .3rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .03),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .02)), 0 0 .75rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .025)), 0 0 1.35rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .04),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .03)), 0 0 2.5rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .05),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .035)), 0 0 6rem 0 light-dark(oklch(.55 .01 var(--nc-surface-hue) / .06),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .04)), 0 0 0rem .0625rem light-dark(oklch(.55 .01 var(--nc-surface-hue) / .015),oklch(.85 .01 calc(var(--nc-surface-hue) + 10) / .01))}[data-theme=dark]{color-scheme:dark}[data-theme=light]{color-scheme:light}html{font-family:var(--nc-font-sans);color:var(--nc-text);background-color:var(--nc-surface-1);scrollbar-gutter:stable;font-size:100%;line-height:1.5}body{grid-template-columns:1fr var(--nc-content-shadow-gap) min(var(--nc-content-width), calc(100% - 2 * var(--nc-spacing) - 2 * var(--nc-content-shadow-gap))) var(--nc-content-shadow-gap) 1fr;min-height:100dvh;padding-block:var(--nc-spacing);display:grid;position:relative}::selection{background-color:var(--nc-primary-focus);color:var(--nc-text)}body>*,body>[style*="display: contents"]>*{grid-column:3;min-width:0}@media (width>=720px){body:before{content:"";width:min(calc(var(--nc-content-width) + 2 * var(--nc-content-shadow-gap)), calc(100% - 2 * var(--nc-spacing)));box-shadow:var(--nc-content-shadow);pointer-events:none;z-index:-1;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%)}}}@layer nimble.utilities{.container{max-width:var(--nc-content-width);padding-inline:var(--nc-spacing);margin-inline:auto}.fluid{max-width:none;padding-inline:var(--nc-spacing);display:block}.full-bleed{box-shadow:none;grid-column:1/-1;position:relative}.grid{gap:var(--nc-spacing);margin-bottom:var(--nc-spacing);grid-template-columns:1fr;display:grid}@media (width>=720px){.grid{grid-template-columns:repeat(auto-fit,minmax(0%,1fr))}}.wide{box-shadow:none;width:100%;max-width:1200px;padding-inline:var(--nc-spacing);grid-column:1/-1;margin-inline:auto}}@media print{body{color:#000;background:#fff}a[href]:after{content:" (" attr(href) ")";color:#555;font-size:.85em}a[href^=\#]:after,a[href^=javascript\:]:after{content:none}pre,blockquote{page-break-inside:avoid}h2,h3,h4{page-break-after:avoid}img{max-width:100%!important}@page{margin:2cm}}@scope(:root) to (.no-nimble){@layer nimble.base{h1{margin-top:0;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:2rem;font-weight:700;line-height:1.1}h2{margin-top:2rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.75rem;font-weight:700;line-height:1.15}h3{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.5rem;font-weight:700;line-height:1.2}h4{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.25rem;font-weight:700;line-height:1.3}h5{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1.125rem;font-weight:700;line-height:1.4}h6{margin-top:1.5rem;margin-bottom:var(--nc-spacing);text-wrap:balance;font-size:1rem;font-weight:700;line-height:1.5}@media (width<=720px){h1{font-size:1.75rem}h2{font-size:1.5rem}h3{font-size:1.3rem}}p,ul,ol,dl,blockquote,pre,table,figure,form,fieldset{margin-top:0;margin-bottom:var(--nc-spacing)}body>:first-child,body>:first-child>:first-child{margin-top:0}body>:nth-last-child(1 of :not(script,style,dialog)),body>:nth-last-child(1 of :not(script,style,dialog))>:last-child{margin-bottom:0}ul,ol{padding-inline-start:1.5em}:where(li){margin-bottom:.25em}:where(li)>:where(ul,ol){margin-bottom:0}dt{font-weight:600}dd{margin-inline-start:1.5em;margin-bottom:.5em}blockquote{margin-block:var(--nc-spacing);padding:.25em var(--nc-spacing);border-inline-start:.25rem solid var(--nc-border);margin-inline:0;font-style:italic}:where(blockquote) footer,:where(blockquote) cite{color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.9em;font-style:normal}hr{background-color:color-mix(in oklch, var(--nc-border), transparent 40%);height:1px;margin:var(--nc-spacing) 0;border:none}mark{color:light-dark(inherit,oklch(95% .01 85));background-color:light-dark(#fde68a,oklch(55% .12 85));border-radius:2px;padding:.1em .25em}address{font-style:normal}:where(a:not([role=button])){color:var(--nc-primary);text-underline-offset:.15em;text-decoration:underline;-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-primary), transparent 50%);transition:color .2s,text-decoration-color .2s}:where(a:not([role=button])):visited{color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310));-webkit-text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%);text-decoration-color:color-mix(in oklch, var(--nc-primary) 40%, oklch(38% .15 310) 30%)}:where(a:not([role=button])):hover{color:var(--nc-primary-hover);-webkit-text-decoration-color:var(--nc-primary-hover);text-decoration-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]){--_btn-padding-v:.5em;--_btn-padding-h:1em;padding:var(--_btn-padding-v) var(--_btn-padding-h);background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;text-align:center;margin:0;margin-block-end:.25em;font-size:1rem;line-height:1.5;text-decoration:none;transition:background-color .2s,border-color .2s;display:inline-block}:where(button,[type=submit],[type=reset],[type=button],[role=button]):hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where(button,[type=submit],[type=reset],[type=button],[role=button]):focus-visible{box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where([type=reset]){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}:where([type=reset]):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}:where([type=reset]):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}:where(button,[type=submit],[type=reset],[type=button],[role=button]).inline{--_btn-padding-v:.05em;--_btn-padding-h:.4em;vertical-align:baseline;margin:.1em .15em;font-size:.875em}:where(button,[type=submit],[type=reset],[type=button],[role=button]):disabled{opacity:.5;cursor:not-allowed;pointer-events:none}:where([role=group]){margin-bottom:.25em;display:inline-flex}[role=group]>*{border-radius:0;margin:0;position:relative}[role=group]>*+*{--_divider:""}[role=group]>*+:before{content:var(--_divider);inset-inline-start:0;pointer-events:none;background:#ffffff4d;width:1px;position:absolute;top:20%;bottom:20%}[role=group]>:not(.secondary):not(.outline)+.secondary,[role=group]>.secondary+:not(.secondary):not(.outline),[role=group]>:not(.secondary):not(.outline)+.outline,[role=group]>.outline+:not(.secondary):not(.outline),[role=group]>.secondary+.outline,[role=group]>.outline+.secondary,[role=group]>input+*,[role=group]>select+*{--_divider:none}[role=group]>:first-child{border-start-start-radius:var(--nc-radius);border-end-start-radius:var(--nc-radius)}[role=group]>:last-child{border-start-end-radius:var(--nc-radius);border-end-end-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline))){border:1px solid var(--nc-primary);border-radius:var(--nc-radius)}[role=group]:has(.outline):not(:has(>:not(.outline)))>.outline{border:none}[role=group]>.outline+.outline:before{background:var(--nc-primary)}[role=search] [role=group]>:first-child{border-start-start-radius:5rem;border-end-start-radius:5rem;padding-inline-start:1.25em}[role=search] [role=group]>:last-child{border-start-end-radius:5rem;border-end-end-radius:5rem;padding-inline-end:1.25em}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset]),select,textarea){--_input-bg:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);background-color:var(--_input-bg);border:1px solid var(--nc-border);border-radius:var(--nc-radius);min-height:calc(2.5em + 2px);color:var(--nc-text);font:inherit;padding:.5em .75em;font-size:1rem;transition:border-color .2s,box-shadow .2s}:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset],[type=date],[type=month],[type=week],[type=time],[type=datetime-local]),select,textarea){width:100%;margin-bottom:var(--nc-spacing)}:where(p,div)>:where(input,select,textarea):nth-last-child(1 of :not(datalist,script,style)){margin-bottom:0}:where(input,select,textarea):focus-visible{border-color:var(--nc-primary);box-shadow:0 0 0 2px var(--nc-primary-focus);outline:none}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)+:where(small){margin-top:calc(var(--nc-spacing) * -.75);margin-bottom:var(--nc-spacing);color:color-mix(in oklch, var(--nc-text), transparent 40%);font-size:.875em;display:block}:where(input,select,textarea)[aria-invalid=false]{border-color:var(--nc-valid)}:where(input,select,textarea)[aria-invalid=true]{border-color:var(--nc-invalid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=false]+:where(small){color:var(--nc-valid)}:where(input:not([type=submit],[type=button],[type=reset]),select,textarea)[aria-invalid=true]+:where(small){color:var(--nc-invalid)}:where(label){margin-bottom:.25em;display:block}:where(label:has(+input,+select,+textarea)){font-weight:600}:where(label:has(+[type=file],+[type=range])){margin-bottom:.5em}:where(fieldset){border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);min-width:0;max-width:100%}:where(fieldset)>:nth-last-child(1 of :not(datalist,script,style)),:where(fieldset)>:nth-last-child(1 of :not(datalist,script,style))>:nth-last-child(1 of :not(datalist,script,style)){margin-bottom:0}:where(legend){padding-inline:.25em;font-weight:600}:where([type=checkbox],[type=radio]){accent-color:var(--nc-primary);width:1.125em;height:1.125em;margin:0}:where(label:has([type=checkbox],[type=radio])){align-items:center;gap:.35em;margin-bottom:.5em;display:flex}:where(label:has([type=checkbox],[type=radio]):last-child){margin-bottom:0}:where([type=search]){border-radius:5rem;padding-inline:1.25em}:where([type=range]){accent-color:var(--nc-primary);width:100%;margin-bottom:var(--nc-spacing)}:where(input[list]){width:auto}:where([type=file]){color:var(--nc-text);font:inherit;cursor:pointer;max-width:100%;margin-bottom:var(--nc-spacing)}:where([type=file])::file-selector-button{margin-right:.75em;background-color:var(--nc-primary);color:var(--nc-primary-contrast);border:1px solid var(--nc-primary);border-radius:var(--nc-radius);font:inherit;cursor:pointer;margin-inline-end:.75em;padding:.5em 1em;transition:background-color .2s,border-color .2s}:where([type=file])::file-selector-button:hover{background-color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}:where([type=date],[type=month],[type=week],[type=time],[type=datetime-local]){min-width:10em;margin-bottom:var(--nc-spacing)}:where([type=color]){--_color-size:calc(1em * 1.5 + 1em + 2px);margin-bottom:var(--nc-spacing);--_color-pad:.25em;height:var(--_color-size);width:calc((var(--_color-size) - 2 * var(--_color-pad)) * 1.618 + 2 * var(--_color-pad));padding:var(--_color-pad);background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);border:1px solid var(--nc-border);border-radius:var(--nc-radius);cursor:pointer}:where([type=color])::-webkit-color-swatch-wrapper{padding:0}:where([type=color])::-webkit-color-swatch{border-radius:calc(var(--nc-radius) * .5);border:none}:where(label:has([type=checkbox][role=switch])){align-items:center;gap:.5em;display:flex}:where([type=checkbox][role=switch]){appearance:none;background-color:var(--nc-border);cursor:pointer;border-radius:1em;flex-shrink:0;width:2.5em;height:1.25em;margin:0;transition:background-color .2s;position:relative}:where([type=checkbox][role=switch]):before{content:"";background-color:#fff;border-radius:50%;width:calc(1.25em - 4px);height:calc(1.25em - 4px);transition:transform .2s;position:absolute;top:2px;left:2px}:where([type=checkbox][role=switch]):checked{background-color:var(--nc-primary)}:where([type=checkbox][role=switch]):checked:before{transform:translate(1.25em)}:where(table){border-collapse:collapse;width:100%}:where(th,td){border-bottom:1px solid color-mix(in oklch, var(--nc-border), transparent 40%);text-align:start;padding:.5em .75em}:where(thead th,thead td){background-color:var(--nc-surface-2);text-wrap:balance;border-bottom-width:2px;font-weight:600}:where(figure:has(table)){overflow-x:auto}:where(code,kbd,samp){font-family:var(--nc-font-mono);background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:.15em .35em;font-size:.875em}:where(pre){background-color:var(--nc-surface-2);border-radius:var(--nc-radius);padding:var(--nc-spacing);overflow-x:auto}:where(pre code){font-size:inherit;background:0 0;padding:0}:where(kbd){border:1px solid var(--nc-border);border-bottom-width:2px}:where(img,video,canvas,svg){max-width:100%;height:auto}:where(figure){margin:0}:where(figcaption){color:color-mix(in oklch, var(--nc-text), transparent 40%);margin-top:.5em;font-size:.9em}:where(article){background-color:var(--nc-surface-1);border:1px solid var(--nc-border);border-radius:var(--nc-radius);padding:var(--nc-spacing);margin-bottom:var(--nc-spacing)}:where(article>header),:where(article>footer){background-color:color-mix(in oklch, var(--nc-surface-1), var(--nc-surface-2) 20%);padding:var(--nc-spacing)}:where(article>header){margin:calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1) var(--nc-spacing);border-bottom:1px solid var(--nc-border);border-radius:var(--nc-radius) var(--nc-radius) 0 0}:where(article>footer){margin:var(--nc-spacing) calc(var(--nc-spacing) * -1) calc(var(--nc-spacing) * -1);border-top:1px solid var(--nc-border);border-radius:0 0 var(--nc-radius) var(--nc-radius)}:where(article)>:last-child:not(footer),:where(article>header,article>footer)>:last-child{margin-bottom:0}:where(article>header,article>footer)>h1,:where(article>header,article>footer)>h2,:where(article>header,article>footer)>h3,:where(article>header,article>footer)>h4,:where(article>header,article>footer)>h5,:where(article>header,article>footer)>h6{margin-top:0;margin-bottom:0}:where(details){border:1px solid var(--nc-border);border-radius:var(--nc-radius);margin-bottom:.5em;padding:0 1em}:where(summary){cursor:pointer;margin:0 -1em;padding:.5em 1em;font-weight:600;list-style-type:"▶ "}:where(details[open]>summary){list-style-type:"▼ "}:where(summary[role=button]){width:auto;margin:0 -1em;list-style:none;display:block}:where(summary[role=button]):before{content:"▶ ";vertical-align:middle;font-size:.75em;transition:transform .2s;display:inline-block}:where(details[open]>summary[role=button]):before{transform:rotate(90deg)}:where(details[open]){padding-bottom:.5em}:where(dialog){background-color:var(--nc-surface-4);border:1px solid var(--nc-border);border-radius:var(--nc-radius);max-width:min(90vw,40rem);max-height:85vh;padding:var(--nc-spacing)}:where(dialog[open]){margin:auto;position:fixed;inset:0}:where(dialog:has(>article)){background:0 0;border:none;padding:0}:where(dialog>article){margin-bottom:0}dialog::backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#00000080;animation:.2s nc-backdrop-in}@keyframes nc-backdrop-in{0%{opacity:0}}:where(progress){width:100%}:where(meter){appearance:none;border-radius:var(--nc-radius);background-color:var(--nc-surface-3);border:0;width:100%;height:.5rem;overflow:hidden}:where(meter)::-webkit-meter-bar{border-radius:var(--nc-radius);background-color:var(--nc-surface-3);border:0;height:.5rem}:where(meter)::-webkit-meter-optimum-value{background-color:var(--nc-valid);border-radius:var(--nc-radius)}:where(meter)::-webkit-meter-suboptimum-value{background-color:var(--nc-primary);border-radius:var(--nc-radius)}:where(meter)::-webkit-meter-even-less-good-value{background-color:var(--nc-invalid);border-radius:var(--nc-radius)}:where(meter)::-moz-meter-bar{background-color:var(--nc-primary);border-radius:var(--nc-radius)}:where(meter):-moz-meter-optimum::-moz-meter-bar{background-color:var(--nc-valid)}:where(meter):-moz-meter-sub-optimum::-moz-meter-bar{background-color:var(--nc-primary)}:where(meter):-moz-meter-sub-sub-optimum::-moz-meter-bar{background-color:var(--nc-invalid)}@supports (appearance:base-select){:where(select){appearance:base-select}:where(select)::picker(select){appearance:base-select}:where(select)::picker-icon{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 2l6 6 6-6'/%3E%3C/svg%3E");transition:rotate .4s}:where(select):open::picker-icon{rotate:180deg}:where(select)::picker(select){position-area:block-end;position-try-order:normal;position-try-fallbacks:flip-block;border:1px solid var(--nc-border);border-radius:var(--nc-radius);background-color:var(--nc-surface-1);opacity:0;transition:opacity .2s, overlay .2s allow-discrete, display .2s allow-discrete;padding:.25em}:where(select):open::picker(select){opacity:1}@starting-style{:where(select):open::picker(select){opacity:0}}:where(select) option{border-radius:var(--nc-radius);padding:.5em .75em;transition:background-color .15s}:where(select) option:hover{background-color:var(--nc-surface-2)}:where(select) option:checked{font-weight:600}}}@layer nimble.utilities{.secondary:not(a:not([role=button])){background-color:var(--nc-secondary);border-color:var(--nc-secondary);color:var(--nc-secondary-contrast)}.secondary:not(a:not([role=button])):hover{background-color:var(--nc-secondary-hover);border-color:var(--nc-secondary-hover)}.secondary:not(a:not([role=button])):focus-visible{box-shadow:0 0 0 2px var(--nc-secondary-focus)}a:not([role=button]).secondary{color:var(--nc-secondary);-webkit-text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%);text-decoration-color:color-mix(in oklch, var(--nc-secondary), transparent 50%)}a:not([role=button]).secondary:hover{color:var(--nc-secondary-hover);-webkit-text-decoration-color:var(--nc-secondary-hover);text-decoration-color:var(--nc-secondary-hover)}.outline:not(a:not([role=button])){color:var(--nc-primary);background-color:#0000}.outline:not(a:not([role=button])):hover{background-color:var(--nc-primary-focus);color:var(--nc-primary-hover);border-color:var(--nc-primary-hover)}.striped :where(tbody tr:nth-child(2n)){background-color:var(--nc-surface-2)}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.overflow-auto{overflow:auto}}[type=date],[type=month],[type=week],[type=time],[type=datetime-local]{appearance:none}details :last-child:last-child{margin-bottom:0}@supports selector(details::details-content){details::details-content{transition:opacity .3s ease, content-visibility .3s ease allow-discrete;opacity:0}details[open]::details-content{opacity:1}@supports (interpolate-size:allow-keywords){details{interpolate-size:allow-keywords}details::details-content{transition:height .3s ease, opacity .3s ease, content-visibility .3s ease allow-discrete;height:0;overflow:clip}details[open]::details-content{height:auto}}}}
|
package/package.json
CHANGED