@anyblades/blades 3.1.0-alpha.2 → 3.1.0-beta.2
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/README.md +46 -15
- package/css/blades.css +158 -597
- package/css/blades.min.css +38 -12
- package/css/blades.ninja.css +4057 -0
- package/css/blades.ninja.min.css +190 -0
- package/css/float-label.css +207 -0
- package/css/float-label.min.css +55 -0
- package/css/{pico.layered.css → layered/blades.layered.css} +441 -16
- package/css/{pico.layered.min.css → layered/blades.layered.min.css} +74 -8
- package/css/layered/compact.css +54 -0
- package/css/layered/components/accordion.css +85 -0
- package/css/layered/components/card.css +48 -0
- package/css/layered/components/dropdown.css +191 -0
- package/css/layered/components/group.css +208 -0
- package/css/layered/components/loading.css +43 -0
- package/css/layered/components/modal.css +158 -0
- package/css/layered/components/nav.css +117 -0
- package/css/layered/components/progress.css +76 -0
- package/css/layered/components/tooltip.css +176 -0
- package/css/layered/components.css +1082 -0
- package/css/layered/content/button.css +208 -0
- package/css/layered/content/code.css +64 -0
- package/css/layered/content/embedded-content.css +41 -0
- package/css/layered/content/figure.css +15 -0
- package/css/layered/content/link.css +84 -0
- package/css/layered/content/misc.css +22 -0
- package/css/layered/content/table.css +33 -0
- package/css/layered/content/typography.css +159 -0
- package/css/layered/content.css +611 -0
- package/css/layered/forms/basics.css +338 -0
- package/css/layered/forms/checkbox-radio-switch.css +164 -0
- package/css/layered/forms/input-color.css +20 -0
- package/css/layered/forms/input-datetime.css +57 -0
- package/css/layered/forms/input-file.css +29 -0
- package/css/layered/forms/input-range.css +121 -0
- package/css/layered/forms/input-search.css +66 -0
- package/css/layered/forms.css +778 -0
- package/css/layered/layout/container.css +42 -0
- package/css/layered/layout/document.css +48 -0
- package/css/layered/layout/grid.css +22 -0
- package/css/layered/layout/landmarks.css +12 -0
- package/css/layered/layout/overflow-auto.css +9 -0
- package/css/layered/layout/section.css +9 -0
- package/css/layered/layout.css +119 -0
- package/css/layered/utilities.css +35 -0
- package/css/layered/variables.css +365 -0
- package/css/pico.conditional.css +16 -15
- package/css/pico.conditional.min.css +7 -7
- package/css/pico.css +16 -15
- package/css/pico.min.css +7 -7
- package/package.json +15 -11
- package/src/_compact.css +51 -0
- package/src/blades/_index.css +23 -0
- package/src/blades/float-label/_index.css +2 -0
- package/src/{standalone/forms/_float-label.theme.css → blades/float-label/_theme.css} +5 -1
- package/src/blades.css +3 -2
- package/src/blades.ninja.css +3 -0
- package/src/float-label.css +1 -0
- package/src/ninja/_index.css +19 -0
- package/src/{standalone → ninja}/_theme.css +0 -2
- package/src/{ninja.css → ninja/_utilities.css} +55 -6
- package/src/pico/_variables.css +6 -5
- package/src/pico/content/_button.css +1 -1
- package/src/pico/layout/_document.css +9 -0
- package/src/pico/layout/_index.css +0 -1
- package/src/pico/layout/_landmarks.css +1 -9
- package/src/pico.css +1 -0
- package/css/blades.standalone.css +0 -860
- package/css/blades.standalone.min.css +0 -37
- package/css/ninja.css +0 -83
- package/css/ninja.min.css +0 -5
- package/src/blades.standalone.css +0 -2
- package/src/standalone/_core.css +0 -32
- package/src/standalone/_utilities.css +0 -55
- package/src/standalone/forms/_float-label.css +0 -2
- /package/src/{standalone/content → blades}/_code.css +0 -0
- /package/src/{standalone/layout → blades}/_columns.css +0 -0
- /package/src/{standalone/components/_icon-helper.css → blades/_icon.css} +0 -0
- /package/src/{standalone/components → blades}/_timeline.css +0 -0
- /package/src/{standalone → blades}/_variables.css +0 -0
- /package/src/{standalone/forms/_float-label.core.css → blades/float-label/_core.css} +0 -0
- /package/src/{standalone/layout/_breakout.css → ninja/_container-breakout.css} +0 -0
- /package/src/{standalone/content/_typography.css → ninja/_heading-anchor.css} +0 -0
- /package/src/{standalone/content/_list.css → ninja/_list-helpers.css} +0 -0
- /package/src/{standalone/layout/_scroller.css → ninja/_page-anchors.css} +0 -0
- /package/src/{standalone/content/_table.css → ninja/_table-helpers.css} +0 -0
- /package/src/{standalone/content → ninja}/_table-responsive.css +0 -0
package/css/pico.conditional.css
CHANGED
|
@@ -231,7 +231,8 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
231
231
|
--pico-primary-hover-background: light-dark(#02659a, #017fc0);
|
|
232
232
|
--pico-primary-hover-border: var(--pico-primary-hover-background);
|
|
233
233
|
--pico-primary-hover-underline: var(--pico-primary-hover);
|
|
234
|
-
|
|
234
|
+
/* Focus rings are opaque: at 25–50% alpha they composite below 3:1 (SC 1.4.11), see #167 */
|
|
235
|
+
--pico-primary-focus: light-dark(rgb(2, 138, 212), rgb(1, 170, 255));
|
|
235
236
|
--pico-primary-inverse: #fff;
|
|
236
237
|
--pico-secondary: light-dark(#5d6b89, #969eaf);
|
|
237
238
|
--pico-secondary-background: #525f7a;
|
|
@@ -241,7 +242,7 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
241
242
|
--pico-secondary-hover-background: light-dark(#48536b, #5d6b89);
|
|
242
243
|
--pico-secondary-hover-border: var(--pico-secondary-hover-background);
|
|
243
244
|
--pico-secondary-hover-underline: var(--pico-secondary-hover);
|
|
244
|
-
--pico-secondary-focus: light-dark(
|
|
245
|
+
--pico-secondary-focus: light-dark(rgb(93, 107, 137), rgb(144, 158, 190));
|
|
245
246
|
--pico-secondary-inverse: #fff;
|
|
246
247
|
--pico-contrast: light-dark(#181c25, #dfe3eb);
|
|
247
248
|
--pico-contrast-background: light-dark(#181c25, #eff1f4);
|
|
@@ -254,7 +255,7 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
254
255
|
var(--pico-secondary-hover),
|
|
255
256
|
var(--pico-contrast-hover)
|
|
256
257
|
);
|
|
257
|
-
--pico-contrast-focus: light-dark(
|
|
258
|
+
--pico-contrast-focus: light-dark(rgb(93, 107, 137), rgb(207, 213, 226));
|
|
258
259
|
--pico-contrast-inverse: light-dark(#fff, #000);
|
|
259
260
|
--pico-box-shadow: 0 0.5rem 2.5rem light-dark(rgba(129, 145, 181, 0.2), rgba(7, 8.5, 12, 0.2));
|
|
260
261
|
--pico-h1-color: light-dark(#2d3138, #f0f1f3);
|
|
@@ -288,11 +289,11 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
288
289
|
--pico-form-element-disabled-opacity: 0.5;
|
|
289
290
|
--pico-form-element-invalid-border-color: light-dark(
|
|
290
291
|
rgb(183.5, 105.5, 106.5),
|
|
291
|
-
rgb(
|
|
292
|
+
rgb(200.25, 79.25, 72.25)
|
|
292
293
|
);
|
|
293
294
|
--pico-form-element-invalid-active-border-color: light-dark(
|
|
294
295
|
rgb(200.25, 79.25, 72.25),
|
|
295
|
-
rgb(
|
|
296
|
+
rgb(214, 92, 86)
|
|
296
297
|
);
|
|
297
298
|
--pico-form-element-invalid-focus-color: var(--pico-form-element-invalid-active-border-color);
|
|
298
299
|
--pico-form-element-valid-border-color: light-dark(rgb(76, 154.5, 137.5), #2a7b6f);
|
|
@@ -403,9 +404,6 @@ progress,
|
|
|
403
404
|
tab-size: 4;
|
|
404
405
|
}
|
|
405
406
|
|
|
406
|
-
/**
|
|
407
|
-
* Landmarks
|
|
408
|
-
*/
|
|
409
407
|
body {
|
|
410
408
|
width: 100%;
|
|
411
409
|
margin: 0;
|
|
@@ -415,12 +413,6 @@ main {
|
|
|
415
413
|
display: block;
|
|
416
414
|
}
|
|
417
415
|
|
|
418
|
-
body > header,
|
|
419
|
-
body > main,
|
|
420
|
-
body > footer {
|
|
421
|
-
padding-block: var(--pico-block-spacing-vertical);
|
|
422
|
-
}
|
|
423
|
-
|
|
424
416
|
/**
|
|
425
417
|
* Section
|
|
426
418
|
*/
|
|
@@ -764,7 +756,7 @@ button,
|
|
|
764
756
|
background-color: var(--pico-background-color);
|
|
765
757
|
box-shadow: var(--pico-box-shadow);
|
|
766
758
|
color: var(--pico-color);
|
|
767
|
-
font-weight: var(--pico-font-weight);
|
|
759
|
+
font-weight: var(--pico-button-font-weight, var(--pico-font-weight));
|
|
768
760
|
font-size: 1rem;
|
|
769
761
|
line-height: var(--pico-line-height);
|
|
770
762
|
text-align: center;
|
|
@@ -2986,5 +2978,14 @@ progress::-moz-progress-bar {
|
|
|
2986
2978
|
transition-duration: 0s !important;
|
|
2987
2979
|
}
|
|
2988
2980
|
}
|
|
2981
|
+
/**
|
|
2982
|
+
* Landmarks
|
|
2983
|
+
* Included in pico.css and blades.ninja.css; not in blades.css
|
|
2984
|
+
*/
|
|
2985
|
+
body > header,
|
|
2986
|
+
body > main,
|
|
2987
|
+
body > footer {
|
|
2988
|
+
padding-block: var(--pico-block-spacing-vertical);
|
|
2989
|
+
}
|
|
2989
2990
|
|
|
2990
2991
|
}
|
|
@@ -8,15 +8,15 @@
|
|
|
8
8
|
[type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]
|
|
9
9
|
){--pico-outline-width:0.0625rem}[type=search]{--pico-border-radius:5rem}[type=checkbox],[type=radio]{--pico-border-width:0.125rem}[type=checkbox][role=switch]{--pico-border-width:0.1875rem}details.dropdown summary:not([role=button]){--pico-outline-width:0.0625rem}nav details.dropdown summary:focus-visible{--pico-outline-width:0.125rem}[role=search]{--pico-border-radius:5rem}[role=group] [role=button],[role=group] [type=button],[role=group] [type=submit],[role=group] button,[role=search] [role=button],[role=search] [type=button],[role=search] [type=submit],[role=search] button{--pico-form-element-spacing-horizontal:2rem}details summary[role=button]:not(.outline)::after{filter:brightness(0) invert(1)}[aria-busy=true]:not(input,select,textarea):is(
|
|
10
10
|
button,[type=submit],[type=button],[type=reset],[role=button]
|
|
11
|
-
):not(.outline)::before{filter:brightness(0) invert(1)}:host,:scope,[data-theme=dark],[data-theme=light]{color-scheme:light;--pico-background-color:light-dark(#fff, rgb(19, 22.5, 30.5));--pico-color:light-dark(#373c44, #c2c7d0);--pico-text-selection-color:light-dark(rgba(2, 154, 232, 0.25), rgba(1, 170, 255, 0.1875));--pico-muted-color:light-dark(#646b79, #7b8495);--pico-muted-border-color:light-dark(rgb(231, 234, 239.5), #202632);--pico-primary:light-dark(#0172ad, #01aaff);--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:light-dark(rgba(1, 114, 173, 0.5), rgba(1, 170, 255, 0.5));--pico-primary-hover:light-dark(#015887, #79c0ff);--pico-primary-hover-background:light-dark(#02659a, #017fc0);--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:light-dark(
|
|
11
|
+
):not(.outline)::before{filter:brightness(0) invert(1)}:host,:scope,[data-theme=dark],[data-theme=light]{color-scheme:light;--pico-background-color:light-dark(#fff, rgb(19, 22.5, 30.5));--pico-color:light-dark(#373c44, #c2c7d0);--pico-text-selection-color:light-dark(rgba(2, 154, 232, 0.25), rgba(1, 170, 255, 0.1875));--pico-muted-color:light-dark(#646b79, #7b8495);--pico-muted-border-color:light-dark(rgb(231, 234, 239.5), #202632);--pico-primary:light-dark(#0172ad, #01aaff);--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:light-dark(rgba(1, 114, 173, 0.5), rgba(1, 170, 255, 0.5));--pico-primary-hover:light-dark(#015887, #79c0ff);--pico-primary-hover-background:light-dark(#02659a, #017fc0);--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:light-dark(rgb(2, 138, 212), rgb(1, 170, 255));--pico-primary-inverse:#fff;--pico-secondary:light-dark(#5d6b89, #969eaf);--pico-secondary-background:#525f7a;--pico-secondary-border:var(--pico-secondary-background);--pico-secondary-underline:light-dark(rgba(93, 107, 137, 0.5), rgba(150, 158, 175, 0.5));--pico-secondary-hover:light-dark(#48536b, #b3b9c5);--pico-secondary-hover-background:light-dark(#48536b, #5d6b89);--pico-secondary-hover-border:var(--pico-secondary-hover-background);--pico-secondary-hover-underline:var(--pico-secondary-hover);--pico-secondary-focus:light-dark(rgb(93, 107, 137), rgb(144, 158, 190));--pico-secondary-inverse:#fff;--pico-contrast:light-dark(#181c25, #dfe3eb);--pico-contrast-background:light-dark(#181c25, #eff1f4);--pico-contrast-border:var(--pico-contrast-background);--pico-contrast-underline:light-dark(rgba(24, 28, 37, 0.5), rgba(223, 227, 235, 0.5));--pico-contrast-hover:light-dark(#000, #fff);--pico-contrast-hover-background:light-dark(#000, #fff);--pico-contrast-hover-border:var(--pico-contrast-hover-background);--pico-contrast-hover-underline:light-dark(
|
|
12
12
|
var(--pico-secondary-hover),
|
|
13
13
|
var(--pico-contrast-hover)
|
|
14
|
-
);--pico-contrast-focus:light-dark(
|
|
14
|
+
);--pico-contrast-focus:light-dark(rgb(93, 107, 137), rgb(207, 213, 226));--pico-contrast-inverse:light-dark(#fff, #000);--pico-box-shadow:0 0.5rem 2.5rem light-dark(rgba(129, 145, 181, 0.2), rgba(7, 8.5, 12, 0.2));--pico-h1-color:light-dark(#2d3138, #f0f1f3);--pico-h2-color:light-dark(#373c44, #e0e3e7);--pico-h3-color:light-dark(#424751, #c2c7d0);--pico-h4-color:light-dark(#4d535e, #b3b9c5);--pico-h5-color:light-dark(#5c6370, #a4acba);--pico-h6-color:light-dark(#646b79, #8891a4);--pico-mark-background-color:light-dark(rgb(252.5, 230.5, 191.5), #014063);--pico-mark-color:light-dark(#0f1114, #fff);--pico-ins-color:light-dark(rgb(28.5, 105.5, 84), #62af9a);--pico-del-color:light-dark(rgb(136, 56.5, 53), rgb(205.5, 126, 123));--pico-blockquote-border-color:var(--pico-muted-border-color);--pico-blockquote-footer-color:var(--pico-muted-color);--pico-button-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-button-hover-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-table-border-color:var(--pico-muted-border-color);--pico-table-row-stripped-background-color:rgba(111, 120, 135, 0.0375);--pico-code-background-color:light-dark(rgb(243, 244.5, 246.75), rgb(26, 30.5, 40.25));--pico-code-color:light-dark(#646b79, #8891a4);--pico-code-kbd-background-color:var(--pico-color);--pico-code-kbd-color:var(--pico-background-color);--pico-form-element-background-color:light-dark(rgb(251, 251.5, 252.25), rgb(28, 33, 43.5));--pico-form-element-selected-background-color:light-dark(#dfe3eb, #2a3140);--pico-form-element-border-color:light-dark(#cfd5e2, #2a3140);--pico-form-element-color:light-dark(#23262c, #e0e3e7);--pico-form-element-placeholder-color:light-dark(var(--pico-muted-color), #8891a4);--pico-form-element-active-background-color:light-dark(#fff, rgb(26, 30.5, 40.25));--pico-form-element-active-border-color:var(--pico-primary-border);--pico-form-element-focus-color:var(--pico-primary-border);--pico-form-element-disabled-opacity:0.5;--pico-form-element-invalid-border-color:light-dark(
|
|
15
15
|
rgb(183.5, 105.5, 106.5),
|
|
16
|
-
rgb(
|
|
16
|
+
rgb(200.25, 79.25, 72.25)
|
|
17
17
|
);--pico-form-element-invalid-active-border-color:light-dark(
|
|
18
18
|
rgb(200.25, 79.25, 72.25),
|
|
19
|
-
rgb(
|
|
19
|
+
rgb(214, 92, 86)
|
|
20
20
|
);--pico-form-element-invalid-focus-color:var(--pico-form-element-invalid-active-border-color);--pico-form-element-valid-border-color:light-dark(rgb(76, 154.5, 137.5), #2a7b6f);--pico-form-element-valid-active-border-color:light-dark(
|
|
21
21
|
rgb(39, 152.75, 118.75),
|
|
22
22
|
rgb(22, 137, 105.5)
|
|
@@ -28,13 +28,13 @@ button,[type=submit],[type=button],[type=reset],[role=button]
|
|
|
28
28
|
button,[type=submit],[type=button],[type=reset],[role=button]
|
|
29
29
|
):not(.outline)::before,:scope:not([data-theme]) details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}}[data-theme=dark]{color-scheme:dark}[data-theme=dark] [aria-busy=true]:not(input,select,textarea).contrast:is(
|
|
30
30
|
button,[type=submit],[type=button],[type=reset],[role=button]
|
|
31
|
-
):not(.outline)::before,[data-theme=dark] details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}[type=checkbox],[type=radio],[type=range],progress{accent-color:var(--pico-primary)}*,::after,::before{box-sizing:border-box;background-repeat:no-repeat}::after,::before{text-decoration:inherit;vertical-align:inherit}:where(:host),:where(:scope){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family);text-underline-offset:var(--pico-text-underline-offset);text-rendering:optimizeLegibility;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{width:100%;margin:0}main{display:block}
|
|
31
|
+
):not(.outline)::before,[data-theme=dark] details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}[type=checkbox],[type=radio],[type=range],progress{accent-color:var(--pico-primary)}*,::after,::before{box-sizing:border-box;background-repeat:no-repeat}::after,::before{text-decoration:inherit;vertical-align:inherit}:where(:host),:where(:scope){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family);text-underline-offset:var(--pico-text-underline-offset);text-rendering:optimizeLegibility;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{width:100%;margin:0}main{display:block}section{margin-bottom:var(--pico-block-spacing-vertical)}.container,.container-fluid{width:100%;margin-right:auto;margin-left:auto;padding-right:var(--pico-spacing);padding-left:var(--pico-spacing)}@media (min-width:576px){.container{max-width:510px;padding-right:0;padding-left:0}}@media (min-width:768px){.container{max-width:700px}}@media (min-width:1024px){.container{max-width:950px}}@media (min-width:1280px){.container{max-width:1200px}}@media (min-width:1536px){.container{max-width:1450px}}.grid{grid-column-gap:var(--pico-grid-column-gap);grid-row-gap:var(--pico-grid-row-gap);display:grid;grid-template-columns:1fr}@media (min-width:768px){.grid{grid-template-columns:repeat(auto-fit,minmax(0%,1fr))}}.grid>:not(.does-not-exist){min-width:0;margin-bottom:0}.overflow-auto{overflow:auto}b,strong{font-weight:bolder}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}address,blockquote,dl,ol,p,pre,table,ul{margin-top:0;margin-bottom:var(--pico-typography-spacing-vertical);color:var(--pico-color);font-style:normal;font-weight:var(--pico-font-weight)}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:var(--pico-typography-spacing-vertical);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family)}h1{--pico-color:var(--pico-h1-color)}h2{--pico-color:var(--pico-h2-color)}h3{--pico-color:var(--pico-h3-color)}h4{--pico-color:var(--pico-h4-color)}h5{--pico-color:var(--pico-h5-color)}h6{--pico-color:var(--pico-h6-color)}:where(article,address,blockquote,dl,figure,form,ol,p,pre,table,ul)~:is(h1,h2,h3,h4,h5,h6){margin-top:var(--pico-typography-spacing-top)}p{margin-bottom:var(--pico-typography-spacing-vertical)}hgroup{margin-bottom:var(--pico-typography-spacing-vertical)}hgroup>*{margin-top:0;margin-bottom:0}hgroup>:not(:first-child):last-child{--pico-color:var(--pico-muted-color);--pico-font-weight:unset;font-size:1rem}:where(ol,ul) li{margin-bottom:calc(var(--pico-typography-spacing-vertical) * .25)}:where(dl,ol,ul) :where(dl,ol,ul){margin:0;margin-top:calc(var(--pico-typography-spacing-vertical) * .25)}ul li{list-style:square}mark{padding:.125rem .25rem;background-color:var(--pico-mark-background-color);color:var(--pico-mark-color);vertical-align:baseline}blockquote{display:block;margin:var(--pico-typography-spacing-vertical) 0;padding:var(--pico-spacing);border-right:none;border-left:.25rem solid var(--pico-blockquote-border-color);border-inline-start:0.25rem solid var(--pico-blockquote-border-color);border-inline-end:none}blockquote footer{margin-top:calc(var(--pico-typography-spacing-vertical) * .5);color:var(--pico-blockquote-footer-color)}abbr[title]{border-bottom:1px dotted;text-decoration:none;cursor:help}ins{color:var(--pico-ins-color);text-decoration:none}del{color:var(--pico-del-color)}::-moz-selection{background-color:var(--pico-text-selection-color)}::selection{background-color:var(--pico-text-selection-color)}:where(a:not([role=button])),[role=link]{--pico-color:var(--pico-primary);--pico-background-color:transparent;--pico-underline:var(--pico-primary-underline);outline:0;background-color:var(--pico-background-color);color:var(--pico-color);-webkit-text-decoration:var(--pico-text-decoration);text-decoration:var(--pico-text-decoration);text-decoration-color:var(--pico-underline);text-underline-offset:0.125em;transition:background-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition),-webkit-text-decoration var(--pico-transition);transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition);transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition),-webkit-text-decoration var(--pico-transition)}:where(a:not([role=button])):is(
|
|
32
32
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
33
33
|
),[role=link]:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-primary-hover);--pico-underline:var(--pico-primary-hover-underline);--pico-text-decoration:underline}:where(a:not([role=button])):focus-visible,[role=link]:focus-visible{box-shadow:0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}:where(a:not([role=button])).secondary,[role=link].secondary{--pico-color:var(--pico-secondary);--pico-underline:var(--pico-secondary-underline)}:where(a:not([role=button])).secondary:is(
|
|
34
34
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
35
35
|
),[role=link].secondary:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-secondary-hover);--pico-underline:var(--pico-secondary-hover-underline)}:where(a:not([role=button])).contrast,[role=link].contrast{--pico-color:var(--pico-contrast);--pico-underline:var(--pico-contrast-underline)}:where(a:not([role=button])).contrast:is(
|
|
36
36
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
37
|
-
),[role=link].contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-contrast-hover);--pico-underline:var(--pico-contrast-hover-underline)}a[role=button]{display:inline-block}button{margin:0;overflow:visible;font-family:inherit;text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[role=button],[type=button],[type=file]::file-selector-button,[type=reset],[type=submit],button{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);--pico-color:var(--pico-primary-inverse);--pico-box-shadow:var(--pico-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);border:var(--pico-border-width) solid var(--pico-border-color);border-radius:var(--pico-border-radius);outline:0;background-color:var(--pico-background-color);box-shadow:var(--pico-box-shadow);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:1rem;line-height:var(--pico-line-height);text-align:center;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition);user-select:none}[role=button]:is(:hover,:active,:focus),[role=button]:is([aria-current]:not([aria-current=false])),[type=button]:is(:hover,:active,:focus),[type=button]:is([aria-current]:not([aria-current=false])),[type=file]::file-selector-button:is(:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])),[type=reset]:is(:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false])),[type=submit]:is(:hover,:active,:focus),[type=submit]:is([aria-current]:not([aria-current=false])),button:is(:hover,:active,:focus),button:is([aria-current]:not([aria-current=false])){--pico-background-color:var(--pico-primary-hover-background);--pico-border-color:var(--pico-primary-hover-border);--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));--pico-color:var(--pico-primary-inverse)}[role=button]:focus,[role=button]:is([aria-current]:not([aria-current=false])):focus,[type=button]:focus,[type=button]:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus,[type=submit]:focus,[type=submit]:is([aria-current]:not([aria-current=false])):focus,button:focus,button:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}[type=button],[type=reset],[type=submit]{margin-bottom:var(--pico-spacing)}:is(button,[type=submit],[type=button],[role=button]).secondary,[type=file]::file-selector-button,[type=reset]{--pico-background-color:var(--pico-secondary-background);--pico-border-color:var(--pico-secondary-border);--pico-color:var(--pico-secondary-inverse);cursor:pointer}:is(button,[type=submit],[type=button],[role=button]).secondary:is(
|
|
37
|
+
),[role=link].contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-contrast-hover);--pico-underline:var(--pico-contrast-hover-underline)}a[role=button]{display:inline-block}button{margin:0;overflow:visible;font-family:inherit;text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[role=button],[type=button],[type=file]::file-selector-button,[type=reset],[type=submit],button{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);--pico-color:var(--pico-primary-inverse);--pico-box-shadow:var(--pico-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);border:var(--pico-border-width) solid var(--pico-border-color);border-radius:var(--pico-border-radius);outline:0;background-color:var(--pico-background-color);box-shadow:var(--pico-box-shadow);color:var(--pico-color);font-weight:var(--pico-button-font-weight,var(--pico-font-weight));font-size:1rem;line-height:var(--pico-line-height);text-align:center;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition);user-select:none}[role=button]:is(:hover,:active,:focus),[role=button]:is([aria-current]:not([aria-current=false])),[type=button]:is(:hover,:active,:focus),[type=button]:is([aria-current]:not([aria-current=false])),[type=file]::file-selector-button:is(:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])),[type=reset]:is(:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false])),[type=submit]:is(:hover,:active,:focus),[type=submit]:is([aria-current]:not([aria-current=false])),button:is(:hover,:active,:focus),button:is([aria-current]:not([aria-current=false])){--pico-background-color:var(--pico-primary-hover-background);--pico-border-color:var(--pico-primary-hover-border);--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));--pico-color:var(--pico-primary-inverse)}[role=button]:focus,[role=button]:is([aria-current]:not([aria-current=false])):focus,[type=button]:focus,[type=button]:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus,[type=submit]:focus,[type=submit]:is([aria-current]:not([aria-current=false])):focus,button:focus,button:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}[type=button],[type=reset],[type=submit]{margin-bottom:var(--pico-spacing)}:is(button,[type=submit],[type=button],[role=button]).secondary,[type=file]::file-selector-button,[type=reset]{--pico-background-color:var(--pico-secondary-background);--pico-border-color:var(--pico-secondary-border);--pico-color:var(--pico-secondary-inverse);cursor:pointer}:is(button,[type=submit],[type=button],[role=button]).secondary:is(
|
|
38
38
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
39
39
|
),[type=file]::file-selector-button:is(
|
|
40
40
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
@@ -114,5 +114,5 @@ button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus
|
|
|
114
114
|
rgba(7.5, 8.5, 10, 0.75)
|
|
115
115
|
)}:host,:scope{--pico-scrollbar-width:0px}dialog{display:flex;z-index:999;position:fixed;top:0;right:0;bottom:0;left:0;align-items:center;justify-content:center;width:inherit;min-width:100%;height:inherit;min-height:100%;padding:0;border:0;backdrop-filter:var(--pico-modal-overlay-backdrop-filter);background-color:var(--pico-modal-overlay-background-color);color:var(--pico-color)}dialog>article{width:100%;max-height:calc(100vh - var(--pico-spacing) * 2);margin:var(--pico-spacing);overflow:auto}@media (min-width:576px){dialog>article{max-width:510px}}@media (min-width:768px){dialog>article{max-width:700px}}dialog>article>header>*{margin-bottom:0}dialog>article>header .close,dialog>article>header :is(a,button)[rel=prev]{margin:0;margin-left:var(--pico-spacing);padding:0;float:right}dialog>article>footer{text-align:end}dialog>article>footer [role=button],dialog>article>footer button{margin-bottom:0}dialog>article>footer [role=button]:not(:first-of-type),dialog>article>footer button:not(:first-of-type){margin-left:calc(var(--pico-spacing) * .5)}dialog>article .close,dialog>article :is(a,button)[rel=prev]{display:block;width:1rem;height:1rem;margin-top:calc(var(--pico-spacing) * -1);margin-bottom:var(--pico-spacing);margin-left:auto;border:none;background-image:var(--pico-icon-close);background-position:center;background-size:auto 1rem;background-repeat:no-repeat;background-color:transparent;opacity:.5;transition:opacity var(--pico-transition)}dialog>article .close:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),dialog>article :is(a,button)[rel=prev]:is(
|
|
116
116
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
117
|
-
){opacity:1}dialog:not([open]),dialog[open=false]{display:none}.modal-is-open{padding-right:var(--pico-scrollbar-width,0);overflow:hidden;pointer-events:none;touch-action:none}.modal-is-open dialog{pointer-events:auto;touch-action:auto}:where(.modal-is-opening,.modal-is-closing) dialog,:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:both}:where(.modal-is-opening,.modal-is-closing) dialog{animation-duration:.8s;animation-name:modal-overlay}:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-delay:.2s;animation-name:modal}.modal-is-closing dialog,.modal-is-closing dialog>article{animation-delay:0s;animation-direction:reverse}@keyframes modal-overlay{from{backdrop-filter:none;background-color:transparent}}@keyframes modal{from{transform:translateY(-100%);opacity:0}}:host,:where(:scope){--pico-nav-element-spacing-horizontal:0.5rem;--pico-nav-breadcrumb-divider:">"}:where(nav li)::before{float:left;content:""}nav,nav ul{display:flex}nav{justify-content:space-between;overflow:visible}nav ol,nav ul{align-items:center;margin-bottom:0;padding:0;list-style:none}nav ol:first-of-type,nav ul:first-of-type{margin-left:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav ol:last-of-type,nav ul:last-of-type{margin-right:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav li{display:inline-block;margin:0;padding:var(--pico-nav-element-spacing-vertical) var(--pico-nav-element-spacing-horizontal)}nav li :where(a,[role=link]){display:inline-block;margin:calc(var(--pico-nav-link-spacing-vertical) * -1) calc(var(--pico-nav-link-spacing-horizontal) * -1);padding:var(--pico-nav-link-spacing-vertical) var(--pico-nav-link-spacing-horizontal);border-radius:var(--pico-border-radius)}nav li :where(a,[role=link]):not(:hover){text-decoration:none}nav li [role=button],nav li [type=button],nav li button,nav li input:not([type=checkbox],[type=radio],[type=range],[type=file]),nav li select{height:auto;margin-right:inherit;margin-bottom:0;margin-left:inherit;padding:calc(var(--pico-nav-link-spacing-vertical) - var(--pico-border-width) * 2) var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb]{align-items:center;justify-content:start}nav[aria-label=breadcrumb] ul li:not(:first-child){margin-inline-start:var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb] ul li a{margin:calc(var(--pico-nav-link-spacing-vertical) * -1) 0;margin-inline-start:calc(var(--pico-nav-link-spacing-horizontal) * -1)}nav[aria-label=breadcrumb] ul li:not(:last-child)::after{display:inline-block;position:absolute;width:calc(var(--pico-nav-link-spacing-horizontal) * 4);margin:0 calc(var(--pico-nav-link-spacing-horizontal) * -1);content:var(--pico-nav-breadcrumb-divider);color:var(--pico-muted-color);text-align:center;text-decoration:none;white-space:nowrap}nav[aria-label=breadcrumb] a[aria-current]:not([aria-current=false]){background-color:transparent;color:inherit;text-decoration:none;pointer-events:none}aside li,aside nav,aside ol,aside ul{display:block}aside li{padding:calc(var(--pico-nav-element-spacing-vertical) * .5) var(--pico-nav-element-spacing-horizontal)}aside li a{display:block}aside li [role=button]{margin:inherit}[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child)::after{content:"\\"}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-progress-background-color:light-dark(#dfe3eb, #202632);--pico-progress-color:var(--pico-primary-background)}progress{display:inline-block;vertical-align:baseline}progress{-webkit-appearance:none;-moz-appearance:none;display:inline-block;appearance:none;width:100%;height:.5rem;margin-bottom:calc(var(--pico-spacing) * .5);overflow:hidden;border:0;border-radius:var(--pico-border-radius);background-color:var(--pico-progress-background-color);color:var(--pico-progress-color)}progress::-webkit-progress-bar{border-radius:var(--pico-border-radius);background:0 0}progress[value]::-webkit-progress-value{background-color:var(--pico-progress-color);-webkit-transition:inline-size var(--pico-transition);transition:inline-size var(--pico-transition)}progress::-moz-progress-bar{background-color:var(--pico-progress-color)}@media (prefers-reduced-motion:no-preference){progress:indeterminate{background:var(--pico-progress-background-color) linear-gradient(to right,var(--pico-progress-color) 30%,var(--pico-progress-background-color) 30%) top left/150% 150% no-repeat;animation:progress-indeterminate 1s linear infinite}progress:indeterminate[value]::-webkit-progress-value{background-color:transparent}progress:indeterminate::-moz-progress-bar{background-color:transparent}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse)}[data-tooltip]{position:relative}[data-tooltip]:not(a,button,input,[role=button]){border-bottom:1px dotted;text-decoration:none;cursor:help}[data-tooltip]::after,[data-tooltip]::before,[data-tooltip][data-placement=top]::after,[data-tooltip][data-placement=top]::before{display:block;z-index:99;position:absolute;bottom:100%;left:50%;padding:.25rem .5rem;overflow:hidden;transform:translate(-50%,-.25rem);border-radius:var(--pico-border-radius);background:var(--pico-tooltip-background-color);content:attr(data-tooltip);color:var(--pico-tooltip-color);font-style:normal;font-weight:var(--pico-font-weight);font-size:.875rem;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;opacity:0;pointer-events:none}[data-tooltip]::after,[data-tooltip][data-placement=top]::after{padding:0;transform:translate(-50%,0);border-top:.3rem solid;border-right:.3rem solid transparent;border-left:.3rem solid transparent;border-radius:0;background-color:transparent;content:"";color:var(--pico-tooltip-background-color)}[data-tooltip][data-placement=bottom]::after,[data-tooltip][data-placement=bottom]::before{top:100%;bottom:auto;transform:translate(-50%,.25rem)}[data-tooltip][data-placement=bottom]:after{transform:translate(-50%,-.3rem);border:.3rem solid transparent;border-bottom:.3rem solid}[data-tooltip][data-placement=left]::after,[data-tooltip][data-placement=left]::before{top:50%;right:100%;bottom:auto;left:auto;transform:translate(-.25rem,-50%)}[data-tooltip][data-placement=left]:after{transform:translate(.3rem,-50%);border:.3rem solid transparent;border-left:.3rem solid}[data-tooltip][data-placement=right]::after,[data-tooltip][data-placement=right]::before{top:50%;right:auto;bottom:auto;left:100%;transform:translate(.25rem,-50%)}[data-tooltip][data-placement=right]:after{transform:translate(-.3rem,-50%);border:.3rem solid transparent;border-right:.3rem solid}[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{opacity:1}@media (hover:hover) and (pointer:fine){[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{--pico-tooltip-slide-to:translate(-50%, -0.25rem);transform:translate(-50%,.75rem);animation-duration:.2s;animation-fill-mode:forwards;animation-name:tooltip-slide;opacity:0}[data-tooltip]:focus::after,[data-tooltip]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, 0rem);transform:translate(-50%,-.25rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:focus::before,[data-tooltip][data-placement=bottom]:hover::after,[data-tooltip][data-placement=bottom]:hover::before{--pico-tooltip-slide-to:translate(-50%, 0.25rem);transform:translate(-50%,-.75rem);animation-name:tooltip-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, -0.3rem);transform:translate(-50%,-.5rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:focus::before,[data-tooltip][data-placement=left]:hover::after,[data-tooltip][data-placement=left]:hover::before{--pico-tooltip-slide-to:translate(-0.25rem, -50%);transform:translate(.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:hover::after{--pico-tooltip-caret-slide-to:translate(0.3rem, -50%);transform:translate(.05rem,-50%);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:focus::before,[data-tooltip][data-placement=right]:hover::after,[data-tooltip][data-placement=right]:hover::before{--pico-tooltip-slide-to:translate(0.25rem, -50%);transform:translate(-.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:hover::after{--pico-tooltip-caret-slide-to:translate(-0.3rem, -50%);transform:translate(-.05rem,-50%);animation-name:tooltip-caret-slide}}@keyframes tooltip-slide{to{transform:var(--pico-tooltip-slide-to);opacity:1}}@keyframes tooltip-caret-slide{50%{opacity:0}to{transform:var(--pico-tooltip-caret-slide-to);opacity:1}}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[dir=rtl]{direction:rtl}@media (prefers-reduced-motion:reduce){:not([aria-busy=true])::after,:not([aria-busy=true])::before,:not([aria-busy=true]):not(.unreduce-motion){background-attachment:initial!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}
|
|
117
|
+
){opacity:1}dialog:not([open]),dialog[open=false]{display:none}.modal-is-open{padding-right:var(--pico-scrollbar-width,0);overflow:hidden;pointer-events:none;touch-action:none}.modal-is-open dialog{pointer-events:auto;touch-action:auto}:where(.modal-is-opening,.modal-is-closing) dialog,:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:both}:where(.modal-is-opening,.modal-is-closing) dialog{animation-duration:.8s;animation-name:modal-overlay}:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-delay:.2s;animation-name:modal}.modal-is-closing dialog,.modal-is-closing dialog>article{animation-delay:0s;animation-direction:reverse}@keyframes modal-overlay{from{backdrop-filter:none;background-color:transparent}}@keyframes modal{from{transform:translateY(-100%);opacity:0}}:host,:where(:scope){--pico-nav-element-spacing-horizontal:0.5rem;--pico-nav-breadcrumb-divider:">"}:where(nav li)::before{float:left;content:""}nav,nav ul{display:flex}nav{justify-content:space-between;overflow:visible}nav ol,nav ul{align-items:center;margin-bottom:0;padding:0;list-style:none}nav ol:first-of-type,nav ul:first-of-type{margin-left:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav ol:last-of-type,nav ul:last-of-type{margin-right:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav li{display:inline-block;margin:0;padding:var(--pico-nav-element-spacing-vertical) var(--pico-nav-element-spacing-horizontal)}nav li :where(a,[role=link]){display:inline-block;margin:calc(var(--pico-nav-link-spacing-vertical) * -1) calc(var(--pico-nav-link-spacing-horizontal) * -1);padding:var(--pico-nav-link-spacing-vertical) var(--pico-nav-link-spacing-horizontal);border-radius:var(--pico-border-radius)}nav li :where(a,[role=link]):not(:hover){text-decoration:none}nav li [role=button],nav li [type=button],nav li button,nav li input:not([type=checkbox],[type=radio],[type=range],[type=file]),nav li select{height:auto;margin-right:inherit;margin-bottom:0;margin-left:inherit;padding:calc(var(--pico-nav-link-spacing-vertical) - var(--pico-border-width) * 2) var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb]{align-items:center;justify-content:start}nav[aria-label=breadcrumb] ul li:not(:first-child){margin-inline-start:var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb] ul li a{margin:calc(var(--pico-nav-link-spacing-vertical) * -1) 0;margin-inline-start:calc(var(--pico-nav-link-spacing-horizontal) * -1)}nav[aria-label=breadcrumb] ul li:not(:last-child)::after{display:inline-block;position:absolute;width:calc(var(--pico-nav-link-spacing-horizontal) * 4);margin:0 calc(var(--pico-nav-link-spacing-horizontal) * -1);content:var(--pico-nav-breadcrumb-divider);color:var(--pico-muted-color);text-align:center;text-decoration:none;white-space:nowrap}nav[aria-label=breadcrumb] a[aria-current]:not([aria-current=false]){background-color:transparent;color:inherit;text-decoration:none;pointer-events:none}aside li,aside nav,aside ol,aside ul{display:block}aside li{padding:calc(var(--pico-nav-element-spacing-vertical) * .5) var(--pico-nav-element-spacing-horizontal)}aside li a{display:block}aside li [role=button]{margin:inherit}[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child)::after{content:"\\"}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-progress-background-color:light-dark(#dfe3eb, #202632);--pico-progress-color:var(--pico-primary-background)}progress{display:inline-block;vertical-align:baseline}progress{-webkit-appearance:none;-moz-appearance:none;display:inline-block;appearance:none;width:100%;height:.5rem;margin-bottom:calc(var(--pico-spacing) * .5);overflow:hidden;border:0;border-radius:var(--pico-border-radius);background-color:var(--pico-progress-background-color);color:var(--pico-progress-color)}progress::-webkit-progress-bar{border-radius:var(--pico-border-radius);background:0 0}progress[value]::-webkit-progress-value{background-color:var(--pico-progress-color);-webkit-transition:inline-size var(--pico-transition);transition:inline-size var(--pico-transition)}progress::-moz-progress-bar{background-color:var(--pico-progress-color)}@media (prefers-reduced-motion:no-preference){progress:indeterminate{background:var(--pico-progress-background-color) linear-gradient(to right,var(--pico-progress-color) 30%,var(--pico-progress-background-color) 30%) top left/150% 150% no-repeat;animation:progress-indeterminate 1s linear infinite}progress:indeterminate[value]::-webkit-progress-value{background-color:transparent}progress:indeterminate::-moz-progress-bar{background-color:transparent}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse)}[data-tooltip]{position:relative}[data-tooltip]:not(a,button,input,[role=button]){border-bottom:1px dotted;text-decoration:none;cursor:help}[data-tooltip]::after,[data-tooltip]::before,[data-tooltip][data-placement=top]::after,[data-tooltip][data-placement=top]::before{display:block;z-index:99;position:absolute;bottom:100%;left:50%;padding:.25rem .5rem;overflow:hidden;transform:translate(-50%,-.25rem);border-radius:var(--pico-border-radius);background:var(--pico-tooltip-background-color);content:attr(data-tooltip);color:var(--pico-tooltip-color);font-style:normal;font-weight:var(--pico-font-weight);font-size:.875rem;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;opacity:0;pointer-events:none}[data-tooltip]::after,[data-tooltip][data-placement=top]::after{padding:0;transform:translate(-50%,0);border-top:.3rem solid;border-right:.3rem solid transparent;border-left:.3rem solid transparent;border-radius:0;background-color:transparent;content:"";color:var(--pico-tooltip-background-color)}[data-tooltip][data-placement=bottom]::after,[data-tooltip][data-placement=bottom]::before{top:100%;bottom:auto;transform:translate(-50%,.25rem)}[data-tooltip][data-placement=bottom]:after{transform:translate(-50%,-.3rem);border:.3rem solid transparent;border-bottom:.3rem solid}[data-tooltip][data-placement=left]::after,[data-tooltip][data-placement=left]::before{top:50%;right:100%;bottom:auto;left:auto;transform:translate(-.25rem,-50%)}[data-tooltip][data-placement=left]:after{transform:translate(.3rem,-50%);border:.3rem solid transparent;border-left:.3rem solid}[data-tooltip][data-placement=right]::after,[data-tooltip][data-placement=right]::before{top:50%;right:auto;bottom:auto;left:100%;transform:translate(.25rem,-50%)}[data-tooltip][data-placement=right]:after{transform:translate(-.3rem,-50%);border:.3rem solid transparent;border-right:.3rem solid}[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{opacity:1}@media (hover:hover) and (pointer:fine){[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{--pico-tooltip-slide-to:translate(-50%, -0.25rem);transform:translate(-50%,.75rem);animation-duration:.2s;animation-fill-mode:forwards;animation-name:tooltip-slide;opacity:0}[data-tooltip]:focus::after,[data-tooltip]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, 0rem);transform:translate(-50%,-.25rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:focus::before,[data-tooltip][data-placement=bottom]:hover::after,[data-tooltip][data-placement=bottom]:hover::before{--pico-tooltip-slide-to:translate(-50%, 0.25rem);transform:translate(-50%,-.75rem);animation-name:tooltip-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, -0.3rem);transform:translate(-50%,-.5rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:focus::before,[data-tooltip][data-placement=left]:hover::after,[data-tooltip][data-placement=left]:hover::before{--pico-tooltip-slide-to:translate(-0.25rem, -50%);transform:translate(.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:hover::after{--pico-tooltip-caret-slide-to:translate(0.3rem, -50%);transform:translate(.05rem,-50%);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:focus::before,[data-tooltip][data-placement=right]:hover::after,[data-tooltip][data-placement=right]:hover::before{--pico-tooltip-slide-to:translate(0.25rem, -50%);transform:translate(-.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:hover::after{--pico-tooltip-caret-slide-to:translate(-0.3rem, -50%);transform:translate(-.05rem,-50%);animation-name:tooltip-caret-slide}}@keyframes tooltip-slide{to{transform:var(--pico-tooltip-slide-to);opacity:1}}@keyframes tooltip-caret-slide{50%{opacity:0}to{transform:var(--pico-tooltip-caret-slide-to);opacity:1}}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[dir=rtl]{direction:rtl}@media (prefers-reduced-motion:reduce){:not([aria-busy=true])::after,:not([aria-busy=true])::before,:not([aria-busy=true]):not(.unreduce-motion){background-attachment:initial!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}body>footer,body>header,body>main{padding-block:var(--pico-block-spacing-vertical)}
|
|
118
118
|
}
|
package/css/pico.css
CHANGED
|
@@ -230,7 +230,8 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
230
230
|
--pico-primary-hover-background: light-dark(#02659a, #017fc0);
|
|
231
231
|
--pico-primary-hover-border: var(--pico-primary-hover-background);
|
|
232
232
|
--pico-primary-hover-underline: var(--pico-primary-hover);
|
|
233
|
-
|
|
233
|
+
/* Focus rings are opaque: at 25–50% alpha they composite below 3:1 (SC 1.4.11), see #167 */
|
|
234
|
+
--pico-primary-focus: light-dark(rgb(2, 138, 212), rgb(1, 170, 255));
|
|
234
235
|
--pico-primary-inverse: #fff;
|
|
235
236
|
--pico-secondary: light-dark(#5d6b89, #969eaf);
|
|
236
237
|
--pico-secondary-background: #525f7a;
|
|
@@ -240,7 +241,7 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
240
241
|
--pico-secondary-hover-background: light-dark(#48536b, #5d6b89);
|
|
241
242
|
--pico-secondary-hover-border: var(--pico-secondary-hover-background);
|
|
242
243
|
--pico-secondary-hover-underline: var(--pico-secondary-hover);
|
|
243
|
-
--pico-secondary-focus: light-dark(
|
|
244
|
+
--pico-secondary-focus: light-dark(rgb(93, 107, 137), rgb(144, 158, 190));
|
|
244
245
|
--pico-secondary-inverse: #fff;
|
|
245
246
|
--pico-contrast: light-dark(#181c25, #dfe3eb);
|
|
246
247
|
--pico-contrast-background: light-dark(#181c25, #eff1f4);
|
|
@@ -253,7 +254,7 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
253
254
|
var(--pico-secondary-hover),
|
|
254
255
|
var(--pico-contrast-hover)
|
|
255
256
|
);
|
|
256
|
-
--pico-contrast-focus: light-dark(
|
|
257
|
+
--pico-contrast-focus: light-dark(rgb(93, 107, 137), rgb(207, 213, 226));
|
|
257
258
|
--pico-contrast-inverse: light-dark(#fff, #000);
|
|
258
259
|
--pico-box-shadow: 0 0.5rem 2.5rem light-dark(rgba(129, 145, 181, 0.2), rgba(7, 8.5, 12, 0.2));
|
|
259
260
|
--pico-h1-color: light-dark(#2d3138, #f0f1f3);
|
|
@@ -287,11 +288,11 @@ details summary[role="button"]:not(.outline)::after {
|
|
|
287
288
|
--pico-form-element-disabled-opacity: 0.5;
|
|
288
289
|
--pico-form-element-invalid-border-color: light-dark(
|
|
289
290
|
rgb(183.5, 105.5, 106.5),
|
|
290
|
-
rgb(
|
|
291
|
+
rgb(200.25, 79.25, 72.25)
|
|
291
292
|
);
|
|
292
293
|
--pico-form-element-invalid-active-border-color: light-dark(
|
|
293
294
|
rgb(200.25, 79.25, 72.25),
|
|
294
|
-
rgb(
|
|
295
|
+
rgb(214, 92, 86)
|
|
295
296
|
);
|
|
296
297
|
--pico-form-element-invalid-focus-color: var(--pico-form-element-invalid-active-border-color);
|
|
297
298
|
--pico-form-element-valid-border-color: light-dark(rgb(76, 154.5, 137.5), #2a7b6f);
|
|
@@ -402,9 +403,6 @@ progress,
|
|
|
402
403
|
tab-size: 4;
|
|
403
404
|
}
|
|
404
405
|
|
|
405
|
-
/**
|
|
406
|
-
* Landmarks
|
|
407
|
-
*/
|
|
408
406
|
body {
|
|
409
407
|
width: 100%;
|
|
410
408
|
margin: 0;
|
|
@@ -414,12 +412,6 @@ main {
|
|
|
414
412
|
display: block;
|
|
415
413
|
}
|
|
416
414
|
|
|
417
|
-
body > header,
|
|
418
|
-
body > main,
|
|
419
|
-
body > footer {
|
|
420
|
-
padding-block: var(--pico-block-spacing-vertical);
|
|
421
|
-
}
|
|
422
|
-
|
|
423
415
|
/**
|
|
424
416
|
* Section
|
|
425
417
|
*/
|
|
@@ -763,7 +755,7 @@ button,
|
|
|
763
755
|
background-color: var(--pico-background-color);
|
|
764
756
|
box-shadow: var(--pico-box-shadow);
|
|
765
757
|
color: var(--pico-color);
|
|
766
|
-
font-weight: var(--pico-font-weight);
|
|
758
|
+
font-weight: var(--pico-button-font-weight, var(--pico-font-weight));
|
|
767
759
|
font-size: 1rem;
|
|
768
760
|
line-height: var(--pico-line-height);
|
|
769
761
|
text-align: center;
|
|
@@ -2985,3 +2977,12 @@ progress::-moz-progress-bar {
|
|
|
2985
2977
|
transition-duration: 0s !important;
|
|
2986
2978
|
}
|
|
2987
2979
|
}
|
|
2980
|
+
/**
|
|
2981
|
+
* Landmarks
|
|
2982
|
+
* Included in pico.css and blades.ninja.css; not in blades.css
|
|
2983
|
+
*/
|
|
2984
|
+
body > header,
|
|
2985
|
+
body > main,
|
|
2986
|
+
body > footer {
|
|
2987
|
+
padding-block: var(--pico-block-spacing-vertical);
|
|
2988
|
+
}
|
package/css/pico.min.css
CHANGED
|
@@ -7,15 +7,15 @@
|
|
|
7
7
|
[type=submit],[type=button],[type=reset],[type=checkbox],[type=radio],[type=file]
|
|
8
8
|
){--pico-outline-width:0.0625rem}[type=search]{--pico-border-radius:5rem}[type=checkbox],[type=radio]{--pico-border-width:0.125rem}[type=checkbox][role=switch]{--pico-border-width:0.1875rem}details.dropdown summary:not([role=button]){--pico-outline-width:0.0625rem}nav details.dropdown summary:focus-visible{--pico-outline-width:0.125rem}[role=search]{--pico-border-radius:5rem}[role=group] [role=button],[role=group] [type=button],[role=group] [type=submit],[role=group] button,[role=search] [role=button],[role=search] [type=button],[role=search] [type=submit],[role=search] button{--pico-form-element-spacing-horizontal:2rem}details summary[role=button]:not(.outline)::after{filter:brightness(0) invert(1)}[aria-busy=true]:not(input,select,textarea):is(
|
|
9
9
|
button,[type=submit],[type=button],[type=reset],[role=button]
|
|
10
|
-
):not(.outline)::before{filter:brightness(0) invert(1)}:host,:scope,[data-theme=dark],[data-theme=light]{color-scheme:light;--pico-background-color:light-dark(#fff, rgb(19, 22.5, 30.5));--pico-color:light-dark(#373c44, #c2c7d0);--pico-text-selection-color:light-dark(rgba(2, 154, 232, 0.25), rgba(1, 170, 255, 0.1875));--pico-muted-color:light-dark(#646b79, #7b8495);--pico-muted-border-color:light-dark(rgb(231, 234, 239.5), #202632);--pico-primary:light-dark(#0172ad, #01aaff);--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:light-dark(rgba(1, 114, 173, 0.5), rgba(1, 170, 255, 0.5));--pico-primary-hover:light-dark(#015887, #79c0ff);--pico-primary-hover-background:light-dark(#02659a, #017fc0);--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:light-dark(
|
|
10
|
+
):not(.outline)::before{filter:brightness(0) invert(1)}:host,:scope,[data-theme=dark],[data-theme=light]{color-scheme:light;--pico-background-color:light-dark(#fff, rgb(19, 22.5, 30.5));--pico-color:light-dark(#373c44, #c2c7d0);--pico-text-selection-color:light-dark(rgba(2, 154, 232, 0.25), rgba(1, 170, 255, 0.1875));--pico-muted-color:light-dark(#646b79, #7b8495);--pico-muted-border-color:light-dark(rgb(231, 234, 239.5), #202632);--pico-primary:light-dark(#0172ad, #01aaff);--pico-primary-background:#0172ad;--pico-primary-border:var(--pico-primary-background);--pico-primary-underline:light-dark(rgba(1, 114, 173, 0.5), rgba(1, 170, 255, 0.5));--pico-primary-hover:light-dark(#015887, #79c0ff);--pico-primary-hover-background:light-dark(#02659a, #017fc0);--pico-primary-hover-border:var(--pico-primary-hover-background);--pico-primary-hover-underline:var(--pico-primary-hover);--pico-primary-focus:light-dark(rgb(2, 138, 212), rgb(1, 170, 255));--pico-primary-inverse:#fff;--pico-secondary:light-dark(#5d6b89, #969eaf);--pico-secondary-background:#525f7a;--pico-secondary-border:var(--pico-secondary-background);--pico-secondary-underline:light-dark(rgba(93, 107, 137, 0.5), rgba(150, 158, 175, 0.5));--pico-secondary-hover:light-dark(#48536b, #b3b9c5);--pico-secondary-hover-background:light-dark(#48536b, #5d6b89);--pico-secondary-hover-border:var(--pico-secondary-hover-background);--pico-secondary-hover-underline:var(--pico-secondary-hover);--pico-secondary-focus:light-dark(rgb(93, 107, 137), rgb(144, 158, 190));--pico-secondary-inverse:#fff;--pico-contrast:light-dark(#181c25, #dfe3eb);--pico-contrast-background:light-dark(#181c25, #eff1f4);--pico-contrast-border:var(--pico-contrast-background);--pico-contrast-underline:light-dark(rgba(24, 28, 37, 0.5), rgba(223, 227, 235, 0.5));--pico-contrast-hover:light-dark(#000, #fff);--pico-contrast-hover-background:light-dark(#000, #fff);--pico-contrast-hover-border:var(--pico-contrast-hover-background);--pico-contrast-hover-underline:light-dark(
|
|
11
11
|
var(--pico-secondary-hover),
|
|
12
12
|
var(--pico-contrast-hover)
|
|
13
|
-
);--pico-contrast-focus:light-dark(
|
|
13
|
+
);--pico-contrast-focus:light-dark(rgb(93, 107, 137), rgb(207, 213, 226));--pico-contrast-inverse:light-dark(#fff, #000);--pico-box-shadow:0 0.5rem 2.5rem light-dark(rgba(129, 145, 181, 0.2), rgba(7, 8.5, 12, 0.2));--pico-h1-color:light-dark(#2d3138, #f0f1f3);--pico-h2-color:light-dark(#373c44, #e0e3e7);--pico-h3-color:light-dark(#424751, #c2c7d0);--pico-h4-color:light-dark(#4d535e, #b3b9c5);--pico-h5-color:light-dark(#5c6370, #a4acba);--pico-h6-color:light-dark(#646b79, #8891a4);--pico-mark-background-color:light-dark(rgb(252.5, 230.5, 191.5), #014063);--pico-mark-color:light-dark(#0f1114, #fff);--pico-ins-color:light-dark(rgb(28.5, 105.5, 84), #62af9a);--pico-del-color:light-dark(rgb(136, 56.5, 53), rgb(205.5, 126, 123));--pico-blockquote-border-color:var(--pico-muted-border-color);--pico-blockquote-footer-color:var(--pico-muted-color);--pico-button-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-button-hover-box-shadow:0 0 0 rgba(0, 0, 0, 0);--pico-table-border-color:var(--pico-muted-border-color);--pico-table-row-stripped-background-color:rgba(111, 120, 135, 0.0375);--pico-code-background-color:light-dark(rgb(243, 244.5, 246.75), rgb(26, 30.5, 40.25));--pico-code-color:light-dark(#646b79, #8891a4);--pico-code-kbd-background-color:var(--pico-color);--pico-code-kbd-color:var(--pico-background-color);--pico-form-element-background-color:light-dark(rgb(251, 251.5, 252.25), rgb(28, 33, 43.5));--pico-form-element-selected-background-color:light-dark(#dfe3eb, #2a3140);--pico-form-element-border-color:light-dark(#cfd5e2, #2a3140);--pico-form-element-color:light-dark(#23262c, #e0e3e7);--pico-form-element-placeholder-color:light-dark(var(--pico-muted-color), #8891a4);--pico-form-element-active-background-color:light-dark(#fff, rgb(26, 30.5, 40.25));--pico-form-element-active-border-color:var(--pico-primary-border);--pico-form-element-focus-color:var(--pico-primary-border);--pico-form-element-disabled-opacity:0.5;--pico-form-element-invalid-border-color:light-dark(
|
|
14
14
|
rgb(183.5, 105.5, 106.5),
|
|
15
|
-
rgb(
|
|
15
|
+
rgb(200.25, 79.25, 72.25)
|
|
16
16
|
);--pico-form-element-invalid-active-border-color:light-dark(
|
|
17
17
|
rgb(200.25, 79.25, 72.25),
|
|
18
|
-
rgb(
|
|
18
|
+
rgb(214, 92, 86)
|
|
19
19
|
);--pico-form-element-invalid-focus-color:var(--pico-form-element-invalid-active-border-color);--pico-form-element-valid-border-color:light-dark(rgb(76, 154.5, 137.5), #2a7b6f);--pico-form-element-valid-active-border-color:light-dark(
|
|
20
20
|
rgb(39, 152.75, 118.75),
|
|
21
21
|
rgb(22, 137, 105.5)
|
|
@@ -27,13 +27,13 @@ button,[type=submit],[type=button],[type=reset],[role=button]
|
|
|
27
27
|
button,[type=submit],[type=button],[type=reset],[role=button]
|
|
28
28
|
):not(.outline)::before,:scope:not([data-theme]) details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}}[data-theme=dark]{color-scheme:dark}[data-theme=dark] [aria-busy=true]:not(input,select,textarea).contrast:is(
|
|
29
29
|
button,[type=submit],[type=button],[type=reset],[role=button]
|
|
30
|
-
):not(.outline)::before,[data-theme=dark] details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}[type=checkbox],[type=radio],[type=range],progress{accent-color:var(--pico-primary)}*,::after,::before{box-sizing:border-box;background-repeat:no-repeat}::after,::before{text-decoration:inherit;vertical-align:inherit}:where(:host),:where(:scope){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family);text-underline-offset:var(--pico-text-underline-offset);text-rendering:optimizeLegibility;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{width:100%;margin:0}main{display:block}
|
|
30
|
+
):not(.outline)::before,[data-theme=dark] details summary[role=button].contrast:not(.outline)::after{filter:brightness(0)}[type=checkbox],[type=radio],[type=range],progress{accent-color:var(--pico-primary)}*,::after,::before{box-sizing:border-box;background-repeat:no-repeat}::after,::before{text-decoration:inherit;vertical-align:inherit}:where(:host),:where(:scope){-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%;background-color:var(--pico-background-color);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family);text-underline-offset:var(--pico-text-underline-offset);text-rendering:optimizeLegibility;overflow-wrap:break-word;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{width:100%;margin:0}main{display:block}section{margin-bottom:var(--pico-block-spacing-vertical)}.container,.container-fluid{width:100%;margin-right:auto;margin-left:auto;padding-right:var(--pico-spacing);padding-left:var(--pico-spacing)}@media (min-width:576px){.container{max-width:510px;padding-right:0;padding-left:0}}@media (min-width:768px){.container{max-width:700px}}@media (min-width:1024px){.container{max-width:950px}}@media (min-width:1280px){.container{max-width:1200px}}@media (min-width:1536px){.container{max-width:1450px}}.grid{grid-column-gap:var(--pico-grid-column-gap);grid-row-gap:var(--pico-grid-row-gap);display:grid;grid-template-columns:1fr}@media (min-width:768px){.grid{grid-template-columns:repeat(auto-fit,minmax(0%,1fr))}}.grid>:not(.does-not-exist){min-width:0;margin-bottom:0}.overflow-auto{overflow:auto}b,strong{font-weight:bolder}sub,sup{position:relative;font-size:.75em;line-height:0;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}address,blockquote,dl,ol,p,pre,table,ul{margin-top:0;margin-bottom:var(--pico-typography-spacing-vertical);color:var(--pico-color);font-style:normal;font-weight:var(--pico-font-weight)}h1,h2,h3,h4,h5,h6{margin-top:0;margin-bottom:var(--pico-typography-spacing-vertical);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:var(--pico-font-size);line-height:var(--pico-line-height);font-family:var(--pico-font-family)}h1{--pico-color:var(--pico-h1-color)}h2{--pico-color:var(--pico-h2-color)}h3{--pico-color:var(--pico-h3-color)}h4{--pico-color:var(--pico-h4-color)}h5{--pico-color:var(--pico-h5-color)}h6{--pico-color:var(--pico-h6-color)}:where(article,address,blockquote,dl,figure,form,ol,p,pre,table,ul)~:is(h1,h2,h3,h4,h5,h6){margin-top:var(--pico-typography-spacing-top)}p{margin-bottom:var(--pico-typography-spacing-vertical)}hgroup{margin-bottom:var(--pico-typography-spacing-vertical)}hgroup>*{margin-top:0;margin-bottom:0}hgroup>:not(:first-child):last-child{--pico-color:var(--pico-muted-color);--pico-font-weight:unset;font-size:1rem}:where(ol,ul) li{margin-bottom:calc(var(--pico-typography-spacing-vertical) * .25)}:where(dl,ol,ul) :where(dl,ol,ul){margin:0;margin-top:calc(var(--pico-typography-spacing-vertical) * .25)}ul li{list-style:square}mark{padding:.125rem .25rem;background-color:var(--pico-mark-background-color);color:var(--pico-mark-color);vertical-align:baseline}blockquote{display:block;margin:var(--pico-typography-spacing-vertical) 0;padding:var(--pico-spacing);border-right:none;border-left:.25rem solid var(--pico-blockquote-border-color);border-inline-start:0.25rem solid var(--pico-blockquote-border-color);border-inline-end:none}blockquote footer{margin-top:calc(var(--pico-typography-spacing-vertical) * .5);color:var(--pico-blockquote-footer-color)}abbr[title]{border-bottom:1px dotted;text-decoration:none;cursor:help}ins{color:var(--pico-ins-color);text-decoration:none}del{color:var(--pico-del-color)}::-moz-selection{background-color:var(--pico-text-selection-color)}::selection{background-color:var(--pico-text-selection-color)}:where(a:not([role=button])),[role=link]{--pico-color:var(--pico-primary);--pico-background-color:transparent;--pico-underline:var(--pico-primary-underline);outline:0;background-color:var(--pico-background-color);color:var(--pico-color);-webkit-text-decoration:var(--pico-text-decoration);text-decoration:var(--pico-text-decoration);text-decoration-color:var(--pico-underline);text-underline-offset:0.125em;transition:background-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition),-webkit-text-decoration var(--pico-transition);transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition);transition:background-color var(--pico-transition),color var(--pico-transition),text-decoration var(--pico-transition),box-shadow var(--pico-transition),-webkit-text-decoration var(--pico-transition)}:where(a:not([role=button])):is(
|
|
31
31
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
32
32
|
),[role=link]:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-primary-hover);--pico-underline:var(--pico-primary-hover-underline);--pico-text-decoration:underline}:where(a:not([role=button])):focus-visible,[role=link]:focus-visible{box-shadow:0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}:where(a:not([role=button])).secondary,[role=link].secondary{--pico-color:var(--pico-secondary);--pico-underline:var(--pico-secondary-underline)}:where(a:not([role=button])).secondary:is(
|
|
33
33
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
34
34
|
),[role=link].secondary:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-secondary-hover);--pico-underline:var(--pico-secondary-hover-underline)}:where(a:not([role=button])).contrast,[role=link].contrast{--pico-color:var(--pico-contrast);--pico-underline:var(--pico-contrast-underline)}:where(a:not([role=button])).contrast:is(
|
|
35
35
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
36
|
-
),[role=link].contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-contrast-hover);--pico-underline:var(--pico-contrast-hover-underline)}a[role=button]{display:inline-block}button{margin:0;overflow:visible;font-family:inherit;text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[role=button],[type=button],[type=file]::file-selector-button,[type=reset],[type=submit],button{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);--pico-color:var(--pico-primary-inverse);--pico-box-shadow:var(--pico-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);border:var(--pico-border-width) solid var(--pico-border-color);border-radius:var(--pico-border-radius);outline:0;background-color:var(--pico-background-color);box-shadow:var(--pico-box-shadow);color:var(--pico-color);font-weight:var(--pico-font-weight);font-size:1rem;line-height:var(--pico-line-height);text-align:center;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition);user-select:none}[role=button]:is(:hover,:active,:focus),[role=button]:is([aria-current]:not([aria-current=false])),[type=button]:is(:hover,:active,:focus),[type=button]:is([aria-current]:not([aria-current=false])),[type=file]::file-selector-button:is(:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])),[type=reset]:is(:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false])),[type=submit]:is(:hover,:active,:focus),[type=submit]:is([aria-current]:not([aria-current=false])),button:is(:hover,:active,:focus),button:is([aria-current]:not([aria-current=false])){--pico-background-color:var(--pico-primary-hover-background);--pico-border-color:var(--pico-primary-hover-border);--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));--pico-color:var(--pico-primary-inverse)}[role=button]:focus,[role=button]:is([aria-current]:not([aria-current=false])):focus,[type=button]:focus,[type=button]:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus,[type=submit]:focus,[type=submit]:is([aria-current]:not([aria-current=false])):focus,button:focus,button:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}[type=button],[type=reset],[type=submit]{margin-bottom:var(--pico-spacing)}:is(button,[type=submit],[type=button],[role=button]).secondary,[type=file]::file-selector-button,[type=reset]{--pico-background-color:var(--pico-secondary-background);--pico-border-color:var(--pico-secondary-border);--pico-color:var(--pico-secondary-inverse);cursor:pointer}:is(button,[type=submit],[type=button],[role=button]).secondary:is(
|
|
36
|
+
),[role=link].contrast:is([aria-current]:not([aria-current=false]),:hover,:active,:focus){--pico-color:var(--pico-contrast-hover);--pico-underline:var(--pico-contrast-hover-underline)}a[role=button]{display:inline-block}button{margin:0;overflow:visible;font-family:inherit;text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[role=button],[type=button],[type=file]::file-selector-button,[type=reset],[type=submit],button{--pico-background-color:var(--pico-primary-background);--pico-border-color:var(--pico-primary-border);--pico-color:var(--pico-primary-inverse);--pico-box-shadow:var(--pico-button-box-shadow, 0 0 0 rgba(0, 0, 0, 0));padding:var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);border:var(--pico-border-width) solid var(--pico-border-color);border-radius:var(--pico-border-radius);outline:0;background-color:var(--pico-background-color);box-shadow:var(--pico-box-shadow);color:var(--pico-color);font-weight:var(--pico-button-font-weight,var(--pico-font-weight));font-size:1rem;line-height:var(--pico-line-height);text-align:center;text-decoration:none;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;transition:background-color var(--pico-transition),border-color var(--pico-transition),color var(--pico-transition),box-shadow var(--pico-transition);user-select:none}[role=button]:is(:hover,:active,:focus),[role=button]:is([aria-current]:not([aria-current=false])),[type=button]:is(:hover,:active,:focus),[type=button]:is([aria-current]:not([aria-current=false])),[type=file]::file-selector-button:is(:hover,:active,:focus),[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])),[type=reset]:is(:hover,:active,:focus),[type=reset]:is([aria-current]:not([aria-current=false])),[type=submit]:is(:hover,:active,:focus),[type=submit]:is([aria-current]:not([aria-current=false])),button:is(:hover,:active,:focus),button:is([aria-current]:not([aria-current=false])){--pico-background-color:var(--pico-primary-hover-background);--pico-border-color:var(--pico-primary-hover-border);--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0));--pico-color:var(--pico-primary-inverse)}[role=button]:focus,[role=button]:is([aria-current]:not([aria-current=false])):focus,[type=button]:focus,[type=button]:is([aria-current]:not([aria-current=false])):focus,[type=file]::file-selector-button:focus,[type=file]::file-selector-button:is([aria-current]:not([aria-current=false])):focus,[type=reset]:focus,[type=reset]:is([aria-current]:not([aria-current=false])):focus,[type=submit]:focus,[type=submit]:is([aria-current]:not([aria-current=false])):focus,button:focus,button:is([aria-current]:not([aria-current=false])):focus{--pico-box-shadow:var(--pico-button-hover-box-shadow, 0 0 0 rgba(0, 0, 0, 0)),0 0 0 var(--pico-outline-width) var(--pico-primary-focus)}[type=button],[type=reset],[type=submit]{margin-bottom:var(--pico-spacing)}:is(button,[type=submit],[type=button],[role=button]).secondary,[type=file]::file-selector-button,[type=reset]{--pico-background-color:var(--pico-secondary-background);--pico-border-color:var(--pico-secondary-border);--pico-color:var(--pico-secondary-inverse);cursor:pointer}:is(button,[type=submit],[type=button],[role=button]).secondary:is(
|
|
37
37
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
38
38
|
),[type=file]::file-selector-button:is(
|
|
39
39
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
@@ -113,4 +113,4 @@ button:focus,[type=submit]:focus,[type=button]:focus,[role=button]:focus
|
|
|
113
113
|
rgba(7.5, 8.5, 10, 0.75)
|
|
114
114
|
)}:host,:scope{--pico-scrollbar-width:0px}dialog{display:flex;z-index:999;position:fixed;top:0;right:0;bottom:0;left:0;align-items:center;justify-content:center;width:inherit;min-width:100%;height:inherit;min-height:100%;padding:0;border:0;backdrop-filter:var(--pico-modal-overlay-backdrop-filter);background-color:var(--pico-modal-overlay-background-color);color:var(--pico-color)}dialog>article{width:100%;max-height:calc(100vh - var(--pico-spacing) * 2);margin:var(--pico-spacing);overflow:auto}@media (min-width:576px){dialog>article{max-width:510px}}@media (min-width:768px){dialog>article{max-width:700px}}dialog>article>header>*{margin-bottom:0}dialog>article>header .close,dialog>article>header :is(a,button)[rel=prev]{margin:0;margin-left:var(--pico-spacing);padding:0;float:right}dialog>article>footer{text-align:end}dialog>article>footer [role=button],dialog>article>footer button{margin-bottom:0}dialog>article>footer [role=button]:not(:first-of-type),dialog>article>footer button:not(:first-of-type){margin-left:calc(var(--pico-spacing) * .5)}dialog>article .close,dialog>article :is(a,button)[rel=prev]{display:block;width:1rem;height:1rem;margin-top:calc(var(--pico-spacing) * -1);margin-bottom:var(--pico-spacing);margin-left:auto;border:none;background-image:var(--pico-icon-close);background-position:center;background-size:auto 1rem;background-repeat:no-repeat;background-color:transparent;opacity:.5;transition:opacity var(--pico-transition)}dialog>article .close:is([aria-current]:not([aria-current=false]),:hover,:active,:focus),dialog>article :is(a,button)[rel=prev]:is(
|
|
115
115
|
[aria-current]:not([aria-current=false]),:hover,:active,:focus
|
|
116
|
-
){opacity:1}dialog:not([open]),dialog[open=false]{display:none}.modal-is-open{padding-right:var(--pico-scrollbar-width,0);overflow:hidden;pointer-events:none;touch-action:none}.modal-is-open dialog{pointer-events:auto;touch-action:auto}:where(.modal-is-opening,.modal-is-closing) dialog,:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:both}:where(.modal-is-opening,.modal-is-closing) dialog{animation-duration:.8s;animation-name:modal-overlay}:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-delay:.2s;animation-name:modal}.modal-is-closing dialog,.modal-is-closing dialog>article{animation-delay:0s;animation-direction:reverse}@keyframes modal-overlay{from{backdrop-filter:none;background-color:transparent}}@keyframes modal{from{transform:translateY(-100%);opacity:0}}:host,:where(:scope){--pico-nav-element-spacing-horizontal:0.5rem;--pico-nav-breadcrumb-divider:">"}:where(nav li)::before{float:left;content:""}nav,nav ul{display:flex}nav{justify-content:space-between;overflow:visible}nav ol,nav ul{align-items:center;margin-bottom:0;padding:0;list-style:none}nav ol:first-of-type,nav ul:first-of-type{margin-left:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav ol:last-of-type,nav ul:last-of-type{margin-right:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav li{display:inline-block;margin:0;padding:var(--pico-nav-element-spacing-vertical) var(--pico-nav-element-spacing-horizontal)}nav li :where(a,[role=link]){display:inline-block;margin:calc(var(--pico-nav-link-spacing-vertical) * -1) calc(var(--pico-nav-link-spacing-horizontal) * -1);padding:var(--pico-nav-link-spacing-vertical) var(--pico-nav-link-spacing-horizontal);border-radius:var(--pico-border-radius)}nav li :where(a,[role=link]):not(:hover){text-decoration:none}nav li [role=button],nav li [type=button],nav li button,nav li input:not([type=checkbox],[type=radio],[type=range],[type=file]),nav li select{height:auto;margin-right:inherit;margin-bottom:0;margin-left:inherit;padding:calc(var(--pico-nav-link-spacing-vertical) - var(--pico-border-width) * 2) var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb]{align-items:center;justify-content:start}nav[aria-label=breadcrumb] ul li:not(:first-child){margin-inline-start:var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb] ul li a{margin:calc(var(--pico-nav-link-spacing-vertical) * -1) 0;margin-inline-start:calc(var(--pico-nav-link-spacing-horizontal) * -1)}nav[aria-label=breadcrumb] ul li:not(:last-child)::after{display:inline-block;position:absolute;width:calc(var(--pico-nav-link-spacing-horizontal) * 4);margin:0 calc(var(--pico-nav-link-spacing-horizontal) * -1);content:var(--pico-nav-breadcrumb-divider);color:var(--pico-muted-color);text-align:center;text-decoration:none;white-space:nowrap}nav[aria-label=breadcrumb] a[aria-current]:not([aria-current=false]){background-color:transparent;color:inherit;text-decoration:none;pointer-events:none}aside li,aside nav,aside ol,aside ul{display:block}aside li{padding:calc(var(--pico-nav-element-spacing-vertical) * .5) var(--pico-nav-element-spacing-horizontal)}aside li a{display:block}aside li [role=button]{margin:inherit}[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child)::after{content:"\\"}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-progress-background-color:light-dark(#dfe3eb, #202632);--pico-progress-color:var(--pico-primary-background)}progress{display:inline-block;vertical-align:baseline}progress{-webkit-appearance:none;-moz-appearance:none;display:inline-block;appearance:none;width:100%;height:.5rem;margin-bottom:calc(var(--pico-spacing) * .5);overflow:hidden;border:0;border-radius:var(--pico-border-radius);background-color:var(--pico-progress-background-color);color:var(--pico-progress-color)}progress::-webkit-progress-bar{border-radius:var(--pico-border-radius);background:0 0}progress[value]::-webkit-progress-value{background-color:var(--pico-progress-color);-webkit-transition:inline-size var(--pico-transition);transition:inline-size var(--pico-transition)}progress::-moz-progress-bar{background-color:var(--pico-progress-color)}@media (prefers-reduced-motion:no-preference){progress:indeterminate{background:var(--pico-progress-background-color) linear-gradient(to right,var(--pico-progress-color) 30%,var(--pico-progress-background-color) 30%) top left/150% 150% no-repeat;animation:progress-indeterminate 1s linear infinite}progress:indeterminate[value]::-webkit-progress-value{background-color:transparent}progress:indeterminate::-moz-progress-bar{background-color:transparent}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse)}[data-tooltip]{position:relative}[data-tooltip]:not(a,button,input,[role=button]){border-bottom:1px dotted;text-decoration:none;cursor:help}[data-tooltip]::after,[data-tooltip]::before,[data-tooltip][data-placement=top]::after,[data-tooltip][data-placement=top]::before{display:block;z-index:99;position:absolute;bottom:100%;left:50%;padding:.25rem .5rem;overflow:hidden;transform:translate(-50%,-.25rem);border-radius:var(--pico-border-radius);background:var(--pico-tooltip-background-color);content:attr(data-tooltip);color:var(--pico-tooltip-color);font-style:normal;font-weight:var(--pico-font-weight);font-size:.875rem;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;opacity:0;pointer-events:none}[data-tooltip]::after,[data-tooltip][data-placement=top]::after{padding:0;transform:translate(-50%,0);border-top:.3rem solid;border-right:.3rem solid transparent;border-left:.3rem solid transparent;border-radius:0;background-color:transparent;content:"";color:var(--pico-tooltip-background-color)}[data-tooltip][data-placement=bottom]::after,[data-tooltip][data-placement=bottom]::before{top:100%;bottom:auto;transform:translate(-50%,.25rem)}[data-tooltip][data-placement=bottom]:after{transform:translate(-50%,-.3rem);border:.3rem solid transparent;border-bottom:.3rem solid}[data-tooltip][data-placement=left]::after,[data-tooltip][data-placement=left]::before{top:50%;right:100%;bottom:auto;left:auto;transform:translate(-.25rem,-50%)}[data-tooltip][data-placement=left]:after{transform:translate(.3rem,-50%);border:.3rem solid transparent;border-left:.3rem solid}[data-tooltip][data-placement=right]::after,[data-tooltip][data-placement=right]::before{top:50%;right:auto;bottom:auto;left:100%;transform:translate(.25rem,-50%)}[data-tooltip][data-placement=right]:after{transform:translate(-.3rem,-50%);border:.3rem solid transparent;border-right:.3rem solid}[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{opacity:1}@media (hover:hover) and (pointer:fine){[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{--pico-tooltip-slide-to:translate(-50%, -0.25rem);transform:translate(-50%,.75rem);animation-duration:.2s;animation-fill-mode:forwards;animation-name:tooltip-slide;opacity:0}[data-tooltip]:focus::after,[data-tooltip]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, 0rem);transform:translate(-50%,-.25rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:focus::before,[data-tooltip][data-placement=bottom]:hover::after,[data-tooltip][data-placement=bottom]:hover::before{--pico-tooltip-slide-to:translate(-50%, 0.25rem);transform:translate(-50%,-.75rem);animation-name:tooltip-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, -0.3rem);transform:translate(-50%,-.5rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:focus::before,[data-tooltip][data-placement=left]:hover::after,[data-tooltip][data-placement=left]:hover::before{--pico-tooltip-slide-to:translate(-0.25rem, -50%);transform:translate(.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:hover::after{--pico-tooltip-caret-slide-to:translate(0.3rem, -50%);transform:translate(.05rem,-50%);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:focus::before,[data-tooltip][data-placement=right]:hover::after,[data-tooltip][data-placement=right]:hover::before{--pico-tooltip-slide-to:translate(0.25rem, -50%);transform:translate(-.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:hover::after{--pico-tooltip-caret-slide-to:translate(-0.3rem, -50%);transform:translate(-.05rem,-50%);animation-name:tooltip-caret-slide}}@keyframes tooltip-slide{to{transform:var(--pico-tooltip-slide-to);opacity:1}}@keyframes tooltip-caret-slide{50%{opacity:0}to{transform:var(--pico-tooltip-caret-slide-to);opacity:1}}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[dir=rtl]{direction:rtl}@media (prefers-reduced-motion:reduce){:not([aria-busy=true])::after,:not([aria-busy=true])::before,:not([aria-busy=true]):not(.unreduce-motion){background-attachment:initial!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}
|
|
116
|
+
){opacity:1}dialog:not([open]),dialog[open=false]{display:none}.modal-is-open{padding-right:var(--pico-scrollbar-width,0);overflow:hidden;pointer-events:none;touch-action:none}.modal-is-open dialog{pointer-events:auto;touch-action:auto}:where(.modal-is-opening,.modal-is-closing) dialog,:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-duration:.2s;animation-timing-function:ease-in-out;animation-fill-mode:both}:where(.modal-is-opening,.modal-is-closing) dialog{animation-duration:.8s;animation-name:modal-overlay}:where(.modal-is-opening,.modal-is-closing) dialog>article{animation-delay:.2s;animation-name:modal}.modal-is-closing dialog,.modal-is-closing dialog>article{animation-delay:0s;animation-direction:reverse}@keyframes modal-overlay{from{backdrop-filter:none;background-color:transparent}}@keyframes modal{from{transform:translateY(-100%);opacity:0}}:host,:where(:scope){--pico-nav-element-spacing-horizontal:0.5rem;--pico-nav-breadcrumb-divider:">"}:where(nav li)::before{float:left;content:""}nav,nav ul{display:flex}nav{justify-content:space-between;overflow:visible}nav ol,nav ul{align-items:center;margin-bottom:0;padding:0;list-style:none}nav ol:first-of-type,nav ul:first-of-type{margin-left:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav ol:last-of-type,nav ul:last-of-type{margin-right:calc(var(--pico-nav-element-spacing-horizontal) * -1)}nav li{display:inline-block;margin:0;padding:var(--pico-nav-element-spacing-vertical) var(--pico-nav-element-spacing-horizontal)}nav li :where(a,[role=link]){display:inline-block;margin:calc(var(--pico-nav-link-spacing-vertical) * -1) calc(var(--pico-nav-link-spacing-horizontal) * -1);padding:var(--pico-nav-link-spacing-vertical) var(--pico-nav-link-spacing-horizontal);border-radius:var(--pico-border-radius)}nav li :where(a,[role=link]):not(:hover){text-decoration:none}nav li [role=button],nav li [type=button],nav li button,nav li input:not([type=checkbox],[type=radio],[type=range],[type=file]),nav li select{height:auto;margin-right:inherit;margin-bottom:0;margin-left:inherit;padding:calc(var(--pico-nav-link-spacing-vertical) - var(--pico-border-width) * 2) var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb]{align-items:center;justify-content:start}nav[aria-label=breadcrumb] ul li:not(:first-child){margin-inline-start:var(--pico-nav-link-spacing-horizontal)}nav[aria-label=breadcrumb] ul li a{margin:calc(var(--pico-nav-link-spacing-vertical) * -1) 0;margin-inline-start:calc(var(--pico-nav-link-spacing-horizontal) * -1)}nav[aria-label=breadcrumb] ul li:not(:last-child)::after{display:inline-block;position:absolute;width:calc(var(--pico-nav-link-spacing-horizontal) * 4);margin:0 calc(var(--pico-nav-link-spacing-horizontal) * -1);content:var(--pico-nav-breadcrumb-divider);color:var(--pico-muted-color);text-align:center;text-decoration:none;white-space:nowrap}nav[aria-label=breadcrumb] a[aria-current]:not([aria-current=false]){background-color:transparent;color:inherit;text-decoration:none;pointer-events:none}aside li,aside nav,aside ol,aside ul{display:block}aside li{padding:calc(var(--pico-nav-element-spacing-vertical) * .5) var(--pico-nav-element-spacing-horizontal)}aside li a{display:block}aside li [role=button]{margin:inherit}[dir=rtl] nav[aria-label=breadcrumb] ul li:not(:last-child)::after{content:"\\"}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-progress-background-color:light-dark(#dfe3eb, #202632);--pico-progress-color:var(--pico-primary-background)}progress{display:inline-block;vertical-align:baseline}progress{-webkit-appearance:none;-moz-appearance:none;display:inline-block;appearance:none;width:100%;height:.5rem;margin-bottom:calc(var(--pico-spacing) * .5);overflow:hidden;border:0;border-radius:var(--pico-border-radius);background-color:var(--pico-progress-background-color);color:var(--pico-progress-color)}progress::-webkit-progress-bar{border-radius:var(--pico-border-radius);background:0 0}progress[value]::-webkit-progress-value{background-color:var(--pico-progress-color);-webkit-transition:inline-size var(--pico-transition);transition:inline-size var(--pico-transition)}progress::-moz-progress-bar{background-color:var(--pico-progress-color)}@media (prefers-reduced-motion:no-preference){progress:indeterminate{background:var(--pico-progress-background-color) linear-gradient(to right,var(--pico-progress-color) 30%,var(--pico-progress-background-color) 30%) top left/150% 150% no-repeat;animation:progress-indeterminate 1s linear infinite}progress:indeterminate[value]::-webkit-progress-value{background-color:transparent}progress:indeterminate::-moz-progress-bar{background-color:transparent}}@media (prefers-reduced-motion:no-preference){[dir=rtl] progress:indeterminate{animation-direction:reverse}}@keyframes progress-indeterminate{0%{background-position:200% 0}100%{background-position:-200% 0}}:host,:where(:scope,[data-theme=light],[data-theme=dark]){--pico-tooltip-background-color:var(--pico-contrast-background);--pico-tooltip-color:var(--pico-contrast-inverse)}[data-tooltip]{position:relative}[data-tooltip]:not(a,button,input,[role=button]){border-bottom:1px dotted;text-decoration:none;cursor:help}[data-tooltip]::after,[data-tooltip]::before,[data-tooltip][data-placement=top]::after,[data-tooltip][data-placement=top]::before{display:block;z-index:99;position:absolute;bottom:100%;left:50%;padding:.25rem .5rem;overflow:hidden;transform:translate(-50%,-.25rem);border-radius:var(--pico-border-radius);background:var(--pico-tooltip-background-color);content:attr(data-tooltip);color:var(--pico-tooltip-color);font-style:normal;font-weight:var(--pico-font-weight);font-size:.875rem;text-decoration:none;text-overflow:ellipsis;white-space:nowrap;opacity:0;pointer-events:none}[data-tooltip]::after,[data-tooltip][data-placement=top]::after{padding:0;transform:translate(-50%,0);border-top:.3rem solid;border-right:.3rem solid transparent;border-left:.3rem solid transparent;border-radius:0;background-color:transparent;content:"";color:var(--pico-tooltip-background-color)}[data-tooltip][data-placement=bottom]::after,[data-tooltip][data-placement=bottom]::before{top:100%;bottom:auto;transform:translate(-50%,.25rem)}[data-tooltip][data-placement=bottom]:after{transform:translate(-50%,-.3rem);border:.3rem solid transparent;border-bottom:.3rem solid}[data-tooltip][data-placement=left]::after,[data-tooltip][data-placement=left]::before{top:50%;right:100%;bottom:auto;left:auto;transform:translate(-.25rem,-50%)}[data-tooltip][data-placement=left]:after{transform:translate(.3rem,-50%);border:.3rem solid transparent;border-left:.3rem solid}[data-tooltip][data-placement=right]::after,[data-tooltip][data-placement=right]::before{top:50%;right:auto;bottom:auto;left:100%;transform:translate(.25rem,-50%)}[data-tooltip][data-placement=right]:after{transform:translate(-.3rem,-50%);border:.3rem solid transparent;border-right:.3rem solid}[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{opacity:1}@media (hover:hover) and (pointer:fine){[data-tooltip]:focus::after,[data-tooltip]:focus::before,[data-tooltip]:hover::after,[data-tooltip]:hover::before{--pico-tooltip-slide-to:translate(-50%, -0.25rem);transform:translate(-50%,.75rem);animation-duration:.2s;animation-fill-mode:forwards;animation-name:tooltip-slide;opacity:0}[data-tooltip]:focus::after,[data-tooltip]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, 0rem);transform:translate(-50%,-.25rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:focus::before,[data-tooltip][data-placement=bottom]:hover::after,[data-tooltip][data-placement=bottom]:hover::before{--pico-tooltip-slide-to:translate(-50%, 0.25rem);transform:translate(-50%,-.75rem);animation-name:tooltip-slide}[data-tooltip][data-placement=bottom]:focus::after,[data-tooltip][data-placement=bottom]:hover::after{--pico-tooltip-caret-slide-to:translate(-50%, -0.3rem);transform:translate(-50%,-.5rem);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:focus::before,[data-tooltip][data-placement=left]:hover::after,[data-tooltip][data-placement=left]:hover::before{--pico-tooltip-slide-to:translate(-0.25rem, -50%);transform:translate(.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=left]:focus::after,[data-tooltip][data-placement=left]:hover::after{--pico-tooltip-caret-slide-to:translate(0.3rem, -50%);transform:translate(.05rem,-50%);animation-name:tooltip-caret-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:focus::before,[data-tooltip][data-placement=right]:hover::after,[data-tooltip][data-placement=right]:hover::before{--pico-tooltip-slide-to:translate(0.25rem, -50%);transform:translate(-.75rem,-50%);animation-name:tooltip-slide}[data-tooltip][data-placement=right]:focus::after,[data-tooltip][data-placement=right]:hover::after{--pico-tooltip-caret-slide-to:translate(-0.3rem, -50%);transform:translate(-.05rem,-50%);animation-name:tooltip-caret-slide}}@keyframes tooltip-slide{to{transform:var(--pico-tooltip-slide-to);opacity:1}}@keyframes tooltip-caret-slide{50%{opacity:0}to{transform:var(--pico-tooltip-caret-slide-to);opacity:1}}[aria-controls]{cursor:pointer}[aria-disabled=true],[disabled]{cursor:not-allowed}[dir=rtl]{direction:rtl}@media (prefers-reduced-motion:reduce){:not([aria-busy=true])::after,:not([aria-busy=true])::before,:not([aria-busy=true]):not(.unreduce-motion){background-attachment:initial!important;animation-duration:1ms!important;animation-delay:-1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-delay:0s!important;transition-duration:0s!important}}body>footer,body>header,body>main{padding-block:var(--pico-block-spacing-vertical)}
|
package/package.json
CHANGED
|
@@ -1,29 +1,30 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@anyblades/blades",
|
|
3
|
-
"version": "3.1.0-
|
|
3
|
+
"version": "3.1.0-beta.2",
|
|
4
4
|
"style": "./src/blades.css",
|
|
5
5
|
"exports": {
|
|
6
6
|
".": "./src/blades.css",
|
|
7
|
+
"./compact": "./src/_compact.css",
|
|
8
|
+
"./float-label/*": "./src/blades/float-label/_*.css",
|
|
7
9
|
"./pico": "./src/pico.css",
|
|
8
|
-
"./pico/
|
|
9
|
-
"./pico/
|
|
10
|
-
"./pico/layout/*": "./src/pico/layout/_*.css",
|
|
10
|
+
"./pico/components": "./src/pico/components/_index.css",
|
|
11
|
+
"./pico/components/*": "./src/pico/components/_*.css",
|
|
11
12
|
"./pico/content": "./src/pico/content/_index.css",
|
|
12
13
|
"./pico/content/*": "./src/pico/content/_*.css",
|
|
13
14
|
"./pico/forms": "./src/pico/forms/_index.css",
|
|
14
15
|
"./pico/forms/*": "./src/pico/forms/_*.css",
|
|
15
|
-
"./pico/
|
|
16
|
-
"./pico/
|
|
16
|
+
"./pico/layout": "./src/pico/layout/_index.css",
|
|
17
|
+
"./pico/layout/*": "./src/pico/layout/_*.css",
|
|
17
18
|
"./pico/utilities": "./src/pico/_utilities.css",
|
|
18
|
-
"./
|
|
19
|
-
"./float-label": "./src/standalone/forms/_float-label.css",
|
|
20
|
-
"./ninja": "./src/ninja.css",
|
|
19
|
+
"./pico/variables": "./src/pico/_variables.css",
|
|
21
20
|
"./css/*.css": "./css/*.css",
|
|
21
|
+
"./layered/*": "./css/layered/*.css",
|
|
22
22
|
"./package.json": "./package.json"
|
|
23
23
|
},
|
|
24
24
|
"files": [
|
|
25
25
|
"src",
|
|
26
26
|
"css/*.css",
|
|
27
|
+
"css/layered",
|
|
27
28
|
"_includes",
|
|
28
29
|
".prettierrc.json"
|
|
29
30
|
],
|
|
@@ -32,9 +33,12 @@
|
|
|
32
33
|
"build": "clear; npm run lint && npm run build:css && npm run build:minify && npm run build:conditional && npm run build:layered",
|
|
33
34
|
"lint": "prettier --write --log-level silent './src/**/*.css'",
|
|
34
35
|
"build:css": "postcss --config css './src/!(_)*.css' --dir css --no-map",
|
|
35
|
-
"build:minify": "cleancss -O1 --with-rebase --batch --batch-suffix .min ./css/*.css !./css/*.min.css !./css/pico.conditional.*
|
|
36
|
+
"build:minify": "cleancss -O1 --with-rebase --batch --batch-suffix .min ./css/*.css !./css/*.min.css !./css/pico.conditional.*",
|
|
36
37
|
"build:conditional": "for f in '' .min; do { printf '@scope (.pico) {\\n'; cat ./css/pico${f}.css; printf '\\n}\\n'; } > ./css/pico.conditional${f}.css; done",
|
|
37
|
-
"build:layered": "
|
|
38
|
+
"build:layered": "npm run build:layered:css && npm run build:layered:wrap && npm run build:layered:clean",
|
|
39
|
+
"build:layered:css": "rm -rf css/layered && postcss --config css './src/pico/**/_*.css' '!./src/pico/_index.css' ./src/_compact.css --base src --dir css/layered --no-map && mv css/layered/pico/* css/layered/",
|
|
40
|
+
"build:layered:wrap": "for f in css/blades.css css/blades.min.css $(find css/layered -name '_*.css'); do case $f in css/blades*) n=${f##*/}; o=css/layered/${n%%.*}.layered.${n#*.};; *) d=${f%/*}; n=${f##*/_}; [ $n = index.css ] && o=$d.css || o=$d/$n;; esac; { printf '@layer blades {\\n'; cat $f; printf '\\n}\\n'; } > $o || exit 1; done",
|
|
41
|
+
"build:layered:clean": "rmdir css/layered/pico && find css/layered -name '_*.css' -delete",
|
|
38
42
|
"start": "npm run build:css -- --watch",
|
|
39
43
|
"prepublishOnly": "npm run build"
|
|
40
44
|
},
|
package/src/_compact.css
ADDED
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* Compact: opt-in denser sizing and a more current look, applied under `data-compact` on
|
|
3
|
+
* <html> (whole page) or on any element such as a single <form>. Without the attribute it
|
|
4
|
+
* changes nothing. Part of blades.css (and blades.layered.css); with per-part imports, import it
|
|
5
|
+
* last (in the same layer as the other parts).
|
|
6
|
+
*
|
|
7
|
+
* The extra selectors keep the values winning where Pico re-declares them at the same
|
|
8
|
+
* specificity: nested [data-theme] sections, the `.pico` root when combined with the conditional build,
|
|
9
|
+
* and a shadow host.
|
|
10
|
+
*/
|
|
11
|
+
[data-compact],
|
|
12
|
+
[data-compact] :is([data-theme], .pico),
|
|
13
|
+
.pico[data-compact],
|
|
14
|
+
:host([data-compact]),
|
|
15
|
+
:host([data-compact]) [data-theme] {
|
|
16
|
+
--pico-border-radius: 0.5rem;
|
|
17
|
+
--pico-outline-width: 0.1875rem;
|
|
18
|
+
--pico-block-spacing-vertical: 1.5rem;
|
|
19
|
+
--pico-block-spacing-horizontal: 1.5rem;
|
|
20
|
+
--pico-form-element-spacing-vertical: 0.375rem;
|
|
21
|
+
--pico-form-element-spacing-horizontal: 0.75rem;
|
|
22
|
+
--pico-form-label-font-weight: 500;
|
|
23
|
+
--pico-button-font-weight: 500;
|
|
24
|
+
--pico-form-element-background-color: light-dark(#fff, rgb(28, 33, 43.5));
|
|
25
|
+
--pico-card-border-color: var(--pico-muted-border-color);
|
|
26
|
+
--pico-card-box-shadow:
|
|
27
|
+
0 0 0 var(--pico-border-width) var(--pico-card-border-color), 0 1px 2px rgba(0, 0, 0, 0.05);
|
|
28
|
+
--pico-card-sectioning-background-color: var(--pico-card-background-color);
|
|
29
|
+
}
|
|
30
|
+
|
|
31
|
+
/* Search fields keep their pill shape */
|
|
32
|
+
[data-compact]:is([role="search"], [type="search"]) {
|
|
33
|
+
--pico-border-radius: 5rem;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
/* Page-level only: everything is sized in rem, so the root size can't change per element */
|
|
37
|
+
:root[data-compact],
|
|
38
|
+
:host([data-compact]) {
|
|
39
|
+
--pico-font-size: 100%;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
[data-compact] :is(h1, h2, h3, h4, h5, h6),
|
|
43
|
+
:host([data-compact]) :is(h1, h2, h3, h4, h5, h6) {
|
|
44
|
+
--pico-font-weight: 600;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
/* Keep helper text at the normal weight under the 500-weight labels */
|
|
48
|
+
[data-compact] :where(input, select, textarea, fieldset, .grid) + small,
|
|
49
|
+
:host([data-compact]) :where(input, select, textarea, fieldset, .grid) + small {
|
|
50
|
+
font-weight: var(--pico-font-weight);
|
|
51
|
+
}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/*!
|
|
2
|
+
* Blades CSS standalone kit v3 🥷
|
|
3
|
+
* Copyright 2026 (https://blades.ninja/css/standalone/)
|
|
4
|
+
* Licensed under MIT
|
|
5
|
+
*/
|
|
6
|
+
/*<!--section:code-->```css */
|
|
7
|
+
|
|
8
|
+
/* Follows https://github.com/picocss/pico/blob/main/scss/_index.scss */
|
|
9
|
+
|
|
10
|
+
@import "./_variables";
|
|
11
|
+
|
|
12
|
+
/* Layout */
|
|
13
|
+
@import "./_columns";
|
|
14
|
+
|
|
15
|
+
/* Content */
|
|
16
|
+
@import "./_code";
|
|
17
|
+
|
|
18
|
+
/* Forms */
|
|
19
|
+
@import "./float-label/_index";
|
|
20
|
+
|
|
21
|
+
/* Components */
|
|
22
|
+
@import "./_icon";
|
|
23
|
+
@import "./_timeline";
|
|
@@ -1,4 +1,8 @@
|
|
|
1
|
-
label:has(> span):has(
|
|
1
|
+
label:has(> span):has(
|
|
2
|
+
input:not([type="checkbox"], [type="radio"], [type="range"]),
|
|
3
|
+
textarea,
|
|
4
|
+
select
|
|
5
|
+
),
|
|
2
6
|
.has-float-label {
|
|
3
7
|
/* Default/fallback state */
|
|
4
8
|
> span,
|
package/src/blades.css
CHANGED