Revert "Feature: modal"

This commit is contained in:
Lucas Larroche 2021-11-08 00:12:34 +07:00 committed by GitHub
parent 39314102d2
commit d5544ea021
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
115 changed files with 3754 additions and 6410 deletions

View file

@ -100,23 +100,6 @@ section {
}
}
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2);
--block-spacing-horizontal: var(--spacing);
}
@media (min-width: 576px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2.5);
--block-spacing-horizontal: calc(var(--spacing) * 1.25);
}
}
@media (min-width: 768px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 3);
--block-spacing-horizontal: calc(var(--spacing) * 1.5);
}
}
a {
--text-decoration: none;
}
@ -268,21 +251,19 @@ kbd {
0 0.125rem 2rem rgba(27, 40, 50, 0.08),
0 0 0 0.0625rem rgba(27, 40, 50, 0.024);
--card-sectionning-background-color: #fbfbfc;
--modal-overlay-background-color: rgba(213, 220, 226, 0.8);
--progress-background-color: #d5dce2;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(56, 142, 60, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
@media only screen and (prefers-color-scheme: dark) {
@ -361,21 +342,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
}
[data-theme=dark] {
@ -453,21 +432,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
/**
@ -489,18 +466,18 @@ kbd {
html {
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-ms-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
background-color: var(--background-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
line-height: var(--line-height);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
line-height: var(--line-height);
text-rendering: optimizeLegibility;
cursor: default;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
}
/**
@ -628,9 +605,9 @@ ul {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-style: normal;
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
font-style: normal;
}
a {
@ -640,7 +617,7 @@ a {
background-color: var(--background-color);
color: var(--color);
-webkit-text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
transition: background-color var(--transition), color var(--transition), box-shadow var(--transition), -webkit-text-decoration var(--transition);
transition: background-color var(--transition), color var(--transition), text-decoration var(--transition), box-shadow var(--transition);
transition: background-color var(--transition), color var(--transition), text-decoration var(--transition), box-shadow var(--transition), -webkit-text-decoration var(--transition);
@ -662,9 +639,9 @@ h6 {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
}
h1 {
@ -758,8 +735,8 @@ hgroup > * {
hgroup > *:last-child {
--color: var(--muted-color);
--font-weight: unset;
font-size: 1rem;
font-family: unset;
font-size: 1rem;
}
p {
@ -774,10 +751,10 @@ ul,
ol {
padding-right: 0;
padding-left: var(--spacing);
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
-webkit-padding-end: 0;
padding-inline-end: 0;
padding-inline-end: 0;
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
}
ul li,
ol li {
@ -801,10 +778,10 @@ blockquote {
padding: var(--spacing);
border-right: none;
border-left: 0.25rem solid var(--blockquote-border-color);
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
-webkit-border-end: none;
border-inline-end: none;
border-inline-end: none;
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
}
blockquote footer {
margin-top: calc(var(--typography-spacing-vertical) * 0.5);
@ -926,8 +903,8 @@ a[role=button] {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -991,10 +968,10 @@ optgroup,
select,
textarea {
margin: 0;
font-size: 1rem;
line-height: var(--line-height);
font-family: inherit;
font-size: 1rem;
letter-spacing: inherit;
line-height: var(--line-height);
}
input {
@ -1090,8 +1067,8 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-moz-appearance: none;
appearance: none;
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
vertical-align: middle;
}
@ -1148,13 +1125,13 @@ select:not([type=checkbox]):not([type=radio])[aria-invalid],
textarea:not([type=checkbox]):not([type=radio])[aria-invalid] {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
-webkit-padding-start: var(--form-element-spacing-horizontal) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
@ -1195,13 +1172,9 @@ textarea[aria-invalid=true]:focus {
) !important;
}
[dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=true], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=false] {
[dir=rtl] input[aria-invalid],
[dir=rtl] select[aria-invalid],
[dir=rtl] textarea[aria-invalid] {
background-position: center left 0.75rem;
}
@ -1227,14 +1200,14 @@ select::-ms-expand {
select:not([multiple]):not([size]) {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
background-image: var(--icon-chevron);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[dir=rtl] select:not([multiple]):not([size]) {
@ -1269,10 +1242,10 @@ label > input, label > select, label > textarea {
margin-top: -0.125em;
margin-right: 0.375em;
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: 0.375em;
margin-inline-end: 0.375em;
margin-inline-end: 0.375em;
-webkit-margin-start: 0;
margin-inline-start: 0;
border-width: var(--border-width);
vertical-align: middle;
cursor: pointer;
@ -1289,8 +1262,8 @@ label > input, label > select, label > textarea {
--border-color: var(--primary);
background-image: var(--icon-checkbox);
background-position: center;
background-size: 0.75em auto;
background-repeat: no-repeat;
background-size: 0.75em auto;
}
[type=checkbox] ~ label,
[type=radio] ~ label {
@ -1305,8 +1278,8 @@ label > input, label > select, label > textarea {
--border-color: var(--primary);
background-image: var(--icon-minus);
background-position: center;
background-size: 0.75em auto;
background-repeat: no-repeat;
background-size: 0.75em auto;
}
[type=radio] {
@ -1352,10 +1325,10 @@ label > input, label > select, label > textarea {
[type=checkbox][role=switch]:checked::before {
margin-right: 0;
margin-left: calc(1.125em - var(--border-width));
-webkit-margin-start: calc(1.125em - var(--border-width));
margin-inline-start: calc(1.125em - var(--border-width));
-webkit-margin-end: 0;
margin-inline-end: 0;
margin-inline-end: 0;
-webkit-margin-start: calc(1.125em - var(--border-width));
margin-inline-start: calc(1.125em - var(--border-width));
}
[type=checkbox][role=switch][aria-invalid=false] {
--border-color: var(--form-element-valid-border-color);
@ -1393,24 +1366,24 @@ label > input, label > select, label > textarea {
border-radius: calc(var(--border-radius) * 0.5);
}
:not([dir=rtl]) [type=date],
:not([dir=rtl]) [type=datetime-local],
:not([dir=rtl]) [type=month],
:not([dir=rtl]) [type=time],
:not([dir=rtl]) [type=week] {
:not(:dir(rtl)) [type=date],
:not(:dir(rtl)) [type=datetime-local],
:not(:dir(rtl)) [type=month],
:not(:dir(rtl)) [type=time],
:not(:dir(rtl)) [type=week] {
background-image: var(--icon-date);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
:not([dir=rtl]) [type=date]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=datetime-local]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=month]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=time]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=week]::-webkit-calendar-picker-indicator {
:not(:dir(rtl)) [type=date]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=datetime-local]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=month]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=time]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=week]::-webkit-calendar-picker-indicator {
opacity: 0;
}
:not([dir=rtl]) [type=time] {
:not(:dir(rtl)) [type=time] {
background-image: var(--icon-time);
}
@ -1431,10 +1404,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1442,8 +1415,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1456,10 +1429,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1467,8 +1440,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1488,10 +1461,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1499,8 +1472,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1517,8 +1490,8 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
margin-inline-start: 0;
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1526,8 +1499,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1629,8 +1602,8 @@ label > input, label > select, label > textarea {
padding-left: calc(var(--form-element-spacing-horizontal) + 1.75rem) !important;
background-image: var(--icon-search);
background-position: center left 1.125rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[type=search]::-webkit-search-cancel-button {
-webkit-appearance: none;
@ -1653,8 +1626,8 @@ td {
padding: calc(var(--spacing) / 2) var(--spacing);
border-bottom: var(--border-width) solid var(--table-border-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
text-align: left;
text-align: start;
}
@ -1674,8 +1647,8 @@ pre,
code,
kbd,
samp {
font-size: 0.875em;
font-family: var(--font-family);
font-size: 0.875em;
}
pre {
@ -1686,11 +1659,11 @@ pre {
pre,
code,
kbd {
border-radius: var(--border-radius);
background: var(--code-background-color);
color: var(--code-color);
font-weight: var(--font-weight);
line-height: initial;
border-radius: var(--border-radius);
}
code,
@ -1705,9 +1678,9 @@ pre {
overflow-x: auto;
}
pre > code {
background: transparent;
display: block;
padding: var(--spacing);
background: transparent;
font-size: 14px;
line-height: var(--line-height);
}
@ -1751,12 +1724,35 @@ template {
display: none !important;
}
dialog {
display: block;
position: absolute;
right: 0;
left: 0;
width: -moz-fit-content;
width: -webkit-fit-content;
width: fit-content;
height: -moz-fit-content;
height: -webkit-fit-content;
height: fit-content;
margin: auto;
padding: 1em;
border: solid;
background-color: white;
color: black;
}
dialog:not([open]) {
display: none;
}
canvas {
display: inline-block;
}
/**
* Accordion (<details>)
* Inspiration: https://codepen.io/koca/pen/RyeLLV
*/
details {
display: block;
@ -1789,8 +1785,8 @@ details summary::after {
transform: rotate(-90deg);
background-image: var(--icon-chevron);
background-position: center;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
content: "";
transition: transform var(--transition);
}
@ -1847,176 +1843,6 @@ article > footer {
border-top: var(--border-width) solid var(--card-border-color);
}
/**
* Modal (<dialog>)
*/
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: var(--spacing);
border: none;
background-color: var(--modal-overlay-background-color);
}
@media (min-width: 576px) {
dialog article {
max-width: 510px;
}
}
@media (min-width: 768px) {
dialog article {
max-width: 700px;
}
}
dialog article > header,
dialog article > footer {
padding: calc(var(--block-spacing-vertical) * 0.5) var(--block-spacing-horizontal);
}
dialog article > header .close {
margin: 0;
margin-left: var(--spacing);
float: right;
}
dialog article > footer {
text-align: right;
}
dialog article > footer [role=button] {
margin-bottom: 0;
}
dialog article > footer [role=button]:not(:first-of-type) {
margin-left: calc(var(--spacing) * 0.5);
}
dialog article p:last-of-type {
margin: 0;
}
dialog article .close {
display: block;
width: 1rem;
height: 1rem;
margin-top: calc(var(--block-spacing-vertical) * -0.5);
margin-bottom: var(--typography-spacing-vertical);
margin-left: auto;
background-image: var(--icon-close);
background-position: center;
background-size: auto 1rem;
background-repeat: no-repeat;
opacity: 0.5;
transition: opacity var(--transition);
}
dialog article .close:hover, dialog article .close:active, dialog article .close:focus {
opacity: 1;
}
dialog:not([open]), dialog[open=false] {
display: none;
}
.modal-is-open {
overflow: hidden;
pointer-events: none;
}
.modal-is-open body > *:not(dialog) {
filter: blur(0.1875rem);
}
.modal-is-open dialog {
pointer-events: auto;
}
.modal-is-opening body > *:not(dialog),
.modal-is-opening dialog,
.modal-is-opening dialog > article,
.modal-is-closing body > *:not(dialog),
.modal-is-closing dialog,
.modal-is-closing dialog > article {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.modal-is-opening body > *:not(dialog),
.modal-is-closing body > *:not(dialog) {
-webkit-animation-name: blurIn;
animation-name: blurIn;
}
.modal-is-opening dialog,
.modal-is-closing dialog {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
.modal-is-opening dialog > article,
.modal-is-closing dialog > article {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
.modal-is-closing body > *:not(dialog),
.modal-is-closing dialog,
.modal-is-closing dialog > article {
animation-direction: reverse;
}
@-webkit-keyframes blurIn {
from {
filter: blur(0);
}
to {
filter: blur(0.1875rem);
}
}
@keyframes blurIn {
from {
filter: blur(0);
}
to {
filter: blur(0.1875rem);
}
}
@-webkit-keyframes fadeIn {
from {
background-color: transparent;
}
to {
background-color: var(--modal-overlay-background-color);
}
}
@keyframes fadeIn {
from {
background-color: transparent;
}
to {
background-color: var(--modal-overlay-background-color);
}
}
@-webkit-keyframes slideInDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slideInDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/**
* Nav
*/
@ -2088,8 +1914,8 @@ progress {
progress {
-webkit-appearance: none;
-moz-appearance: none;
display: inline-block;
appearance: none;
display: inline-block;
width: 100%;
height: 0.5rem;
margin-bottom: calc(var(--spacing) * 0.5);
@ -2113,7 +1939,7 @@ progress::-moz-progress-bar {
progress:indeterminate {
background: var(--progress-background-color) linear-gradient(to right, var(--progress-color) 30%, var(--progress-background-color) 30%) top left/150% 150% no-repeat;
-webkit-animation: progressIndeterminate 1s linear infinite;
animation: progressIndeterminate 1s linear infinite;
animation: progressIndeterminate 1s linear infinite;
}
progress:indeterminate[value]::-webkit-progress-value {
background-color: transparent;
@ -2154,20 +1980,20 @@ progress::-moz-progress-bar {
border: 0.1875em solid currentColor;
border-radius: 1em;
border-right-color: transparent;
content: "";
vertical-align: text-bottom;
vertical-align: -0.125em;
-webkit-animation: spinner 0.75s linear infinite;
animation: spinner 0.75s linear infinite;
animation: spinner 0.75s linear infinite;
content: "";
opacity: var(--loading-spinner-opacity);
}
[aria-busy=true]:not(input):not(select):not(textarea):not(:empty)::before {
margin-right: calc(var(--spacing) * 0.5);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) * 0.5);
margin-inline-end: calc(var(--spacing) * 0.5);
margin-inline-end: calc(var(--spacing) * 0.5);
-webkit-margin-start: 0;
margin-inline-start: 0;
}
[aria-busy=true]:not(input):not(select):not(textarea):empty {
text-align: center;
@ -2214,14 +2040,14 @@ a[aria-busy=true] {
transform: translate(-50%, -0.25rem);
border-radius: var(--border-radius);
background: var(--tooltip-background-color);
content: attr(data-tooltip);
color: var(--tooltip-color);
font-size: 0.875rem;
font-style: normal;
font-weight: var(--font-weight);
font-size: 0.875rem;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
content: attr(data-tooltip);
opacity: 0;
pointer-events: none;
}
@ -2233,23 +2059,19 @@ a[aria-busy=true] {
border-left: 0.3rem solid transparent;
border-radius: 0;
background-color: transparent;
content: "";
color: var(--tooltip-background-color);
content: "";
}
[data-tooltip]:focus::before, [data-tooltip]:focus::after, [data-tooltip]:hover::before, [data-tooltip]:hover::after {
opacity: 1;
-webkit-animation-name: slide;
animation-name: slide;
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
}
@media (hover: hover) and (pointer: fine) {
[data-tooltip]:focus::before, [data-tooltip]:focus::after, [data-tooltip]:hover::before, [data-tooltip]:hover::after {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-name: slide;
animation-name: slide;
}
[data-tooltip]:focus::after, [data-tooltip]:hover::after {
-webkit-animation-name: slideCaret;
animation-name: slideCaret;
}
[data-tooltip]:focus::after, [data-tooltip]:hover::after {
-webkit-animation-name: slideCaret;
animation-name: slideCaret;
}
@-webkit-keyframes slide {
@ -2345,15 +2167,13 @@ textarea,
:not([aria-busy=true])::after {
background-attachment: initial !important;
-webkit-animation-duration: 1ms !important;
animation-duration: 1ms !important;
animation-duration: 1ms !important;
-webkit-animation-delay: -1ms !important;
animation-delay: -1ms !important;
animation-delay: -1ms !important;
-webkit-animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-delay: 0s !important;
transition-duration: 0s !important;
}
}
/*# sourceMappingURL=pico.classless.css.map */

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -100,23 +100,6 @@ section {
}
}
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2);
--block-spacing-horizontal: var(--spacing);
}
@media (min-width: 576px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2.5);
--block-spacing-horizontal: calc(var(--spacing) * 1.25);
}
}
@media (min-width: 768px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 3);
--block-spacing-horizontal: calc(var(--spacing) * 1.5);
}
}
a {
--text-decoration: none;
}
@ -268,21 +251,19 @@ kbd {
0 0.125rem 2rem rgba(27, 40, 50, 0.08),
0 0 0 0.0625rem rgba(27, 40, 50, 0.024);
--card-sectionning-background-color: #fbfbfc;
--modal-overlay-background-color: rgba(213, 220, 226, 0.8);
--progress-background-color: #d5dce2;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(56, 142, 60, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
@media only screen and (prefers-color-scheme: dark) {
@ -361,21 +342,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
}
[data-theme=dark] {
@ -453,21 +432,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
/**
@ -489,18 +466,18 @@ kbd {
html {
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-ms-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
background-color: var(--background-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
line-height: var(--line-height);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
line-height: var(--line-height);
text-rendering: optimizeLegibility;
cursor: default;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
}
/**
@ -653,9 +630,9 @@ ul {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-style: normal;
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
font-style: normal;
}
a {
@ -665,7 +642,7 @@ a {
background-color: var(--background-color);
color: var(--color);
-webkit-text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
transition: background-color var(--transition), color var(--transition), box-shadow var(--transition), -webkit-text-decoration var(--transition);
transition: background-color var(--transition), color var(--transition), text-decoration var(--transition), box-shadow var(--transition);
transition: background-color var(--transition), color var(--transition), text-decoration var(--transition), box-shadow var(--transition), -webkit-text-decoration var(--transition);
@ -705,9 +682,9 @@ h6 {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
}
h1 {
@ -801,8 +778,8 @@ hgroup > * {
hgroup > *:last-child {
--color: var(--muted-color);
--font-weight: unset;
font-size: 1rem;
font-family: unset;
font-size: 1rem;
}
p {
@ -817,10 +794,10 @@ ul,
ol {
padding-right: 0;
padding-left: var(--spacing);
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
-webkit-padding-end: 0;
padding-inline-end: 0;
padding-inline-end: 0;
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
}
ul li,
ol li {
@ -844,10 +821,10 @@ blockquote {
padding: var(--spacing);
border-right: none;
border-left: 0.25rem solid var(--blockquote-border-color);
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
-webkit-border-end: none;
border-inline-end: none;
border-inline-end: none;
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
}
blockquote footer {
margin-top: calc(var(--typography-spacing-vertical) * 0.5);
@ -969,8 +946,8 @@ a[role=button] {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1170,10 +1147,10 @@ optgroup,
select,
textarea {
margin: 0;
font-size: 1rem;
line-height: var(--line-height);
font-family: inherit;
font-size: 1rem;
letter-spacing: inherit;
line-height: var(--line-height);
}
input {
@ -1269,8 +1246,8 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-moz-appearance: none;
appearance: none;
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
vertical-align: middle;
}
@ -1327,13 +1304,13 @@ select:not([type=checkbox]):not([type=radio])[aria-invalid],
textarea:not([type=checkbox]):not([type=radio])[aria-invalid] {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
-webkit-padding-start: var(--form-element-spacing-horizontal) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
@ -1374,13 +1351,9 @@ textarea[aria-invalid=true]:focus {
) !important;
}
[dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=true], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=false] {
[dir=rtl] input[aria-invalid],
[dir=rtl] select[aria-invalid],
[dir=rtl] textarea[aria-invalid] {
background-position: center left 0.75rem;
}
@ -1406,14 +1379,14 @@ select::-ms-expand {
select:not([multiple]):not([size]) {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
background-image: var(--icon-chevron);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[dir=rtl] select:not([multiple]):not([size]) {
@ -1448,10 +1421,10 @@ label > input, label > select, label > textarea {
margin-top: -0.125em;
margin-right: 0.375em;
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: 0.375em;
margin-inline-end: 0.375em;
margin-inline-end: 0.375em;
-webkit-margin-start: 0;
margin-inline-start: 0;
border-width: var(--border-width);
vertical-align: middle;
cursor: pointer;
@ -1468,8 +1441,8 @@ label > input, label > select, label > textarea {
--border-color: var(--primary);
background-image: var(--icon-checkbox);
background-position: center;
background-size: 0.75em auto;
background-repeat: no-repeat;
background-size: 0.75em auto;
}
[type=checkbox] ~ label,
[type=radio] ~ label {
@ -1484,8 +1457,8 @@ label > input, label > select, label > textarea {
--border-color: var(--primary);
background-image: var(--icon-minus);
background-position: center;
background-size: 0.75em auto;
background-repeat: no-repeat;
background-size: 0.75em auto;
}
[type=radio] {
@ -1531,10 +1504,10 @@ label > input, label > select, label > textarea {
[type=checkbox][role=switch]:checked::before {
margin-right: 0;
margin-left: calc(1.125em - var(--border-width));
-webkit-margin-start: calc(1.125em - var(--border-width));
margin-inline-start: calc(1.125em - var(--border-width));
-webkit-margin-end: 0;
margin-inline-end: 0;
margin-inline-end: 0;
-webkit-margin-start: calc(1.125em - var(--border-width));
margin-inline-start: calc(1.125em - var(--border-width));
}
[type=checkbox][role=switch][aria-invalid=false] {
--border-color: var(--form-element-valid-border-color);
@ -1572,24 +1545,24 @@ label > input, label > select, label > textarea {
border-radius: calc(var(--border-radius) * 0.5);
}
:not([dir=rtl]) [type=date],
:not([dir=rtl]) [type=datetime-local],
:not([dir=rtl]) [type=month],
:not([dir=rtl]) [type=time],
:not([dir=rtl]) [type=week] {
:not(:dir(rtl)) [type=date],
:not(:dir(rtl)) [type=datetime-local],
:not(:dir(rtl)) [type=month],
:not(:dir(rtl)) [type=time],
:not(:dir(rtl)) [type=week] {
background-image: var(--icon-date);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
:not([dir=rtl]) [type=date]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=datetime-local]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=month]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=time]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=week]::-webkit-calendar-picker-indicator {
:not(:dir(rtl)) [type=date]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=datetime-local]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=month]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=time]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=week]::-webkit-calendar-picker-indicator {
opacity: 0;
}
:not([dir=rtl]) [type=time] {
:not(:dir(rtl)) [type=time] {
background-image: var(--icon-time);
}
@ -1610,10 +1583,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1621,8 +1594,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1635,10 +1608,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1646,8 +1619,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1667,10 +1640,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1678,8 +1651,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1696,8 +1669,8 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
margin-inline-start: 0;
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1705,8 +1678,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1808,8 +1781,8 @@ label > input, label > select, label > textarea {
padding-left: calc(var(--form-element-spacing-horizontal) + 1.75rem) !important;
background-image: var(--icon-search);
background-position: center left 1.125rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[type=search]::-webkit-search-cancel-button {
-webkit-appearance: none;
@ -1832,8 +1805,8 @@ td {
padding: calc(var(--spacing) / 2) var(--spacing);
border-bottom: var(--border-width) solid var(--table-border-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
text-align: left;
text-align: start;
}
@ -1853,8 +1826,8 @@ pre,
code,
kbd,
samp {
font-size: 0.875em;
font-family: var(--font-family);
font-size: 0.875em;
}
pre {
@ -1865,11 +1838,11 @@ pre {
pre,
code,
kbd {
border-radius: var(--border-radius);
background: var(--code-background-color);
color: var(--code-color);
font-weight: var(--font-weight);
line-height: initial;
border-radius: var(--border-radius);
}
code,
@ -1884,9 +1857,9 @@ pre {
overflow-x: auto;
}
pre > code {
background: transparent;
display: block;
padding: var(--spacing);
background: transparent;
font-size: 14px;
line-height: var(--line-height);
}
@ -1930,12 +1903,35 @@ template {
display: none !important;
}
dialog {
display: block;
position: absolute;
right: 0;
left: 0;
width: -moz-fit-content;
width: -webkit-fit-content;
width: fit-content;
height: -moz-fit-content;
height: -webkit-fit-content;
height: fit-content;
margin: auto;
padding: 1em;
border: solid;
background-color: white;
color: black;
}
dialog:not([open]) {
display: none;
}
canvas {
display: inline-block;
}
/**
* Accordion (<details>)
* Inspiration: https://codepen.io/koca/pen/RyeLLV
*/
details {
display: block;
@ -1968,8 +1964,8 @@ details summary::after {
transform: rotate(-90deg);
background-image: var(--icon-chevron);
background-position: center;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
content: "";
transition: transform var(--transition);
}
@ -2026,176 +2022,6 @@ article > footer {
border-top: var(--border-width) solid var(--card-border-color);
}
/**
* Modal (<dialog>)
*/
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: var(--spacing);
border: none;
background-color: var(--modal-overlay-background-color);
}
@media (min-width: 576px) {
dialog article {
max-width: 510px;
}
}
@media (min-width: 768px) {
dialog article {
max-width: 700px;
}
}
dialog article > header,
dialog article > footer {
padding: calc(var(--block-spacing-vertical) * 0.5) var(--block-spacing-horizontal);
}
dialog article > header .close {
margin: 0;
margin-left: var(--spacing);
float: right;
}
dialog article > footer {
text-align: right;
}
dialog article > footer [role=button] {
margin-bottom: 0;
}
dialog article > footer [role=button]:not(:first-of-type) {
margin-left: calc(var(--spacing) * 0.5);
}
dialog article p:last-of-type {
margin: 0;
}
dialog article .close {
display: block;
width: 1rem;
height: 1rem;
margin-top: calc(var(--block-spacing-vertical) * -0.5);
margin-bottom: var(--typography-spacing-vertical);
margin-left: auto;
background-image: var(--icon-close);
background-position: center;
background-size: auto 1rem;
background-repeat: no-repeat;
opacity: 0.5;
transition: opacity var(--transition);
}
dialog article .close:hover, dialog article .close:active, dialog article .close:focus {
opacity: 1;
}
dialog:not([open]), dialog[open=false] {
display: none;
}
.modal-is-open {
overflow: hidden;
pointer-events: none;
}
.modal-is-open body > *:not(dialog) {
filter: blur(0.1875rem);
}
.modal-is-open dialog {
pointer-events: auto;
}
.modal-is-opening body > *:not(dialog),
.modal-is-opening dialog,
.modal-is-opening dialog > article,
.modal-is-closing body > *:not(dialog),
.modal-is-closing dialog,
.modal-is-closing dialog > article {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.modal-is-opening body > *:not(dialog),
.modal-is-closing body > *:not(dialog) {
-webkit-animation-name: blurIn;
animation-name: blurIn;
}
.modal-is-opening dialog,
.modal-is-closing dialog {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
.modal-is-opening dialog > article,
.modal-is-closing dialog > article {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
.modal-is-closing body > *:not(dialog),
.modal-is-closing dialog,
.modal-is-closing dialog > article {
animation-direction: reverse;
}
@-webkit-keyframes blurIn {
from {
filter: blur(0);
}
to {
filter: blur(0.1875rem);
}
}
@keyframes blurIn {
from {
filter: blur(0);
}
to {
filter: blur(0.1875rem);
}
}
@-webkit-keyframes fadeIn {
from {
background-color: transparent;
}
to {
background-color: var(--modal-overlay-background-color);
}
}
@keyframes fadeIn {
from {
background-color: transparent;
}
to {
background-color: var(--modal-overlay-background-color);
}
}
@-webkit-keyframes slideInDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slideInDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/**
* Nav
*/
@ -2267,8 +2093,8 @@ progress {
progress {
-webkit-appearance: none;
-moz-appearance: none;
display: inline-block;
appearance: none;
display: inline-block;
width: 100%;
height: 0.5rem;
margin-bottom: calc(var(--spacing) * 0.5);
@ -2292,7 +2118,7 @@ progress::-moz-progress-bar {
progress:indeterminate {
background: var(--progress-background-color) linear-gradient(to right, var(--progress-color) 30%, var(--progress-background-color) 30%) top left/150% 150% no-repeat;
-webkit-animation: progressIndeterminate 1s linear infinite;
animation: progressIndeterminate 1s linear infinite;
animation: progressIndeterminate 1s linear infinite;
}
progress:indeterminate[value]::-webkit-progress-value {
background-color: transparent;
@ -2333,20 +2159,20 @@ progress::-moz-progress-bar {
border: 0.1875em solid currentColor;
border-radius: 1em;
border-right-color: transparent;
content: "";
vertical-align: text-bottom;
vertical-align: -0.125em;
-webkit-animation: spinner 0.75s linear infinite;
animation: spinner 0.75s linear infinite;
animation: spinner 0.75s linear infinite;
content: "";
opacity: var(--loading-spinner-opacity);
}
[aria-busy=true]:not(input):not(select):not(textarea):not(:empty)::before {
margin-right: calc(var(--spacing) * 0.5);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) * 0.5);
margin-inline-end: calc(var(--spacing) * 0.5);
margin-inline-end: calc(var(--spacing) * 0.5);
-webkit-margin-start: 0;
margin-inline-start: 0;
}
[aria-busy=true]:not(input):not(select):not(textarea):empty {
text-align: center;
@ -2393,14 +2219,14 @@ a[aria-busy=true] {
transform: translate(-50%, -0.25rem);
border-radius: var(--border-radius);
background: var(--tooltip-background-color);
content: attr(data-tooltip);
color: var(--tooltip-color);
font-size: 0.875rem;
font-style: normal;
font-weight: var(--font-weight);
font-size: 0.875rem;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
content: attr(data-tooltip);
opacity: 0;
pointer-events: none;
}
@ -2412,23 +2238,19 @@ a[aria-busy=true] {
border-left: 0.3rem solid transparent;
border-radius: 0;
background-color: transparent;
content: "";
color: var(--tooltip-background-color);
content: "";
}
[data-tooltip]:focus::before, [data-tooltip]:focus::after, [data-tooltip]:hover::before, [data-tooltip]:hover::after {
opacity: 1;
-webkit-animation-name: slide;
animation-name: slide;
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
}
@media (hover: hover) and (pointer: fine) {
[data-tooltip]:focus::before, [data-tooltip]:focus::after, [data-tooltip]:hover::before, [data-tooltip]:hover::after {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-name: slide;
animation-name: slide;
}
[data-tooltip]:focus::after, [data-tooltip]:hover::after {
-webkit-animation-name: slideCaret;
animation-name: slideCaret;
}
[data-tooltip]:focus::after, [data-tooltip]:hover::after {
-webkit-animation-name: slideCaret;
animation-name: slideCaret;
}
@-webkit-keyframes slide {
@ -2524,15 +2346,13 @@ textarea,
:not([aria-busy=true])::after {
background-attachment: initial !important;
-webkit-animation-duration: 1ms !important;
animation-duration: 1ms !important;
animation-duration: 1ms !important;
-webkit-animation-delay: -1ms !important;
animation-delay: -1ms !important;
animation-delay: -1ms !important;
-webkit-animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-delay: 0s !important;
transition-duration: 0s !important;
}
}
/*# sourceMappingURL=pico.css.map */

File diff suppressed because one or more lines are too long

View file

@ -100,23 +100,6 @@ section {
}
}
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2);
--block-spacing-horizontal: var(--spacing);
}
@media (min-width: 576px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2.5);
--block-spacing-horizontal: calc(var(--spacing) * 1.25);
}
}
@media (min-width: 768px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 3);
--block-spacing-horizontal: calc(var(--spacing) * 1.5);
}
}
a {
--text-decoration: none;
}
@ -268,21 +251,19 @@ kbd {
0 0.125rem 2rem rgba(27, 40, 50, 0.08),
0 0 0 0.0625rem rgba(27, 40, 50, 0.024);
--card-sectionning-background-color: #fbfbfc;
--modal-overlay-background-color: rgba(213, 220, 226, 0.8);
--progress-background-color: #d5dce2;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(56, 142, 60, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
@media only screen and (prefers-color-scheme: dark) {
@ -361,21 +342,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
}
[data-theme=dark] {
@ -453,21 +432,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
/**
@ -489,18 +466,18 @@ kbd {
html {
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-ms-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
background-color: var(--background-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
line-height: var(--line-height);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
line-height: var(--line-height);
text-rendering: optimizeLegibility;
cursor: default;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
}
/**
@ -598,9 +575,9 @@ ul {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-style: normal;
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
font-style: normal;
}
a {
@ -610,7 +587,7 @@ a {
background-color: var(--background-color);
color: var(--color);
-webkit-text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
transition: background-color var(--transition), color var(--transition), box-shadow var(--transition), -webkit-text-decoration var(--transition);
transition: background-color var(--transition), color var(--transition), text-decoration var(--transition), box-shadow var(--transition);
transition: background-color var(--transition), color var(--transition), text-decoration var(--transition), box-shadow var(--transition), -webkit-text-decoration var(--transition);
@ -632,9 +609,9 @@ h6 {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
}
h1 {
@ -728,8 +705,8 @@ hgroup > * {
hgroup > *:last-child {
--color: var(--muted-color);
--font-weight: unset;
font-size: 1rem;
font-family: unset;
font-size: 1rem;
}
p {
@ -744,10 +721,10 @@ ul,
ol {
padding-right: 0;
padding-left: var(--spacing);
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
-webkit-padding-end: 0;
padding-inline-end: 0;
padding-inline-end: 0;
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
}
ul li,
ol li {
@ -771,10 +748,10 @@ blockquote {
padding: var(--spacing);
border-right: none;
border-left: 0.25rem solid var(--blockquote-border-color);
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
-webkit-border-end: none;
border-inline-end: none;
border-inline-end: none;
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
}
blockquote footer {
margin-top: calc(var(--typography-spacing-vertical) * 0.5);
@ -896,8 +873,8 @@ a[role=button] {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -961,10 +938,10 @@ optgroup,
select,
textarea {
margin: 0;
font-size: 1rem;
line-height: var(--line-height);
font-family: inherit;
font-size: 1rem;
letter-spacing: inherit;
line-height: var(--line-height);
}
input {
@ -1060,8 +1037,8 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-moz-appearance: none;
appearance: none;
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
vertical-align: middle;
}
@ -1118,13 +1095,13 @@ select:not([type=checkbox]):not([type=radio])[aria-invalid],
textarea:not([type=checkbox]):not([type=radio])[aria-invalid] {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem) !important;
-webkit-padding-start: var(--form-element-spacing-horizontal) !important;
padding-inline-start: var(--form-element-spacing-horizontal) !important;
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
@ -1165,13 +1142,9 @@ textarea[aria-invalid=true]:focus {
) !important;
}
[dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=true], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=false] {
[dir=rtl] input[aria-invalid],
[dir=rtl] select[aria-invalid],
[dir=rtl] textarea[aria-invalid] {
background-position: center left 0.75rem;
}
@ -1197,14 +1170,14 @@ select::-ms-expand {
select:not([multiple]):not([size]) {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
background-image: var(--icon-chevron);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[dir=rtl] select:not([multiple]):not([size]) {
@ -1239,10 +1212,10 @@ label > input, label > select, label > textarea {
margin-top: -0.125em;
margin-right: 0.375em;
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: 0.375em;
margin-inline-end: 0.375em;
margin-inline-end: 0.375em;
-webkit-margin-start: 0;
margin-inline-start: 0;
border-width: var(--border-width);
vertical-align: middle;
cursor: pointer;
@ -1259,8 +1232,8 @@ label > input, label > select, label > textarea {
--border-color: var(--primary);
background-image: var(--icon-checkbox);
background-position: center;
background-size: 0.75em auto;
background-repeat: no-repeat;
background-size: 0.75em auto;
}
[type=checkbox] ~ label,
[type=radio] ~ label {
@ -1275,8 +1248,8 @@ label > input, label > select, label > textarea {
--border-color: var(--primary);
background-image: var(--icon-minus);
background-position: center;
background-size: 0.75em auto;
background-repeat: no-repeat;
background-size: 0.75em auto;
}
[type=radio] {
@ -1322,10 +1295,10 @@ label > input, label > select, label > textarea {
[type=checkbox][role=switch]:checked::before {
margin-right: 0;
margin-left: calc(1.125em - var(--border-width));
-webkit-margin-start: calc(1.125em - var(--border-width));
margin-inline-start: calc(1.125em - var(--border-width));
-webkit-margin-end: 0;
margin-inline-end: 0;
margin-inline-end: 0;
-webkit-margin-start: calc(1.125em - var(--border-width));
margin-inline-start: calc(1.125em - var(--border-width));
}
[type=checkbox][role=switch][aria-invalid=false] {
--border-color: var(--form-element-valid-border-color);
@ -1363,24 +1336,24 @@ label > input, label > select, label > textarea {
border-radius: calc(var(--border-radius) * 0.5);
}
:not([dir=rtl]) [type=date],
:not([dir=rtl]) [type=datetime-local],
:not([dir=rtl]) [type=month],
:not([dir=rtl]) [type=time],
:not([dir=rtl]) [type=week] {
:not(:dir(rtl)) [type=date],
:not(:dir(rtl)) [type=datetime-local],
:not(:dir(rtl)) [type=month],
:not(:dir(rtl)) [type=time],
:not(:dir(rtl)) [type=week] {
background-image: var(--icon-date);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
:not([dir=rtl]) [type=date]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=datetime-local]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=month]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=time]::-webkit-calendar-picker-indicator,
:not([dir=rtl]) [type=week]::-webkit-calendar-picker-indicator {
:not(:dir(rtl)) [type=date]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=datetime-local]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=month]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=time]::-webkit-calendar-picker-indicator,
:not(:dir(rtl)) [type=week]::-webkit-calendar-picker-indicator {
opacity: 0;
}
:not([dir=rtl]) [type=time] {
:not(:dir(rtl)) [type=time] {
background-image: var(--icon-time);
}
@ -1401,10 +1374,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1412,8 +1385,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1426,10 +1399,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1437,8 +1410,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1458,10 +1431,10 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-end: calc(var(--spacing) / 2);
-webkit-margin-start: 0;
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1469,8 +1442,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1487,8 +1460,8 @@ label > input, label > select, label > textarea {
--color: var(--secondary-inverse);
margin-right: calc(var(--spacing) / 2);
margin-left: 0;
margin-inline-start: 0;
margin-inline-end: calc(var(--spacing) / 2);
margin-inline-start: 0;
padding: calc(var(--form-element-spacing-vertical) * 0.5) calc(var(--form-element-spacing-horizontal) * 0.5);
border: var(--border-width) solid var(--border-color);
border-radius: var(--border-radius);
@ -1496,8 +1469,8 @@ label > input, label > select, label > textarea {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1599,8 +1572,8 @@ label > input, label > select, label > textarea {
padding-left: calc(var(--form-element-spacing-horizontal) + 1.75rem) !important;
background-image: var(--icon-search);
background-position: center left 1.125rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[type=search]::-webkit-search-cancel-button {
-webkit-appearance: none;
@ -1623,8 +1596,8 @@ td {
padding: calc(var(--spacing) / 2) var(--spacing);
border-bottom: var(--border-width) solid var(--table-border-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
text-align: left;
text-align: start;
}
@ -1644,8 +1617,8 @@ pre,
code,
kbd,
samp {
font-size: 0.875em;
font-family: var(--font-family);
font-size: 0.875em;
}
pre {
@ -1656,11 +1629,11 @@ pre {
pre,
code,
kbd {
border-radius: var(--border-radius);
background: var(--code-background-color);
color: var(--code-color);
font-weight: var(--font-weight);
line-height: initial;
border-radius: var(--border-radius);
}
code,
@ -1675,9 +1648,9 @@ pre {
overflow-x: auto;
}
pre > code {
background: transparent;
display: block;
padding: var(--spacing);
background: transparent;
font-size: 14px;
line-height: var(--line-height);
}
@ -1721,12 +1694,35 @@ template {
display: none !important;
}
dialog {
display: block;
position: absolute;
right: 0;
left: 0;
width: -moz-fit-content;
width: -webkit-fit-content;
width: fit-content;
height: -moz-fit-content;
height: -webkit-fit-content;
height: fit-content;
margin: auto;
padding: 1em;
border: solid;
background-color: white;
color: black;
}
dialog:not([open]) {
display: none;
}
canvas {
display: inline-block;
}
/**
* Accordion (<details>)
* Inspiration: https://codepen.io/koca/pen/RyeLLV
*/
details {
display: block;
@ -1759,8 +1755,8 @@ details summary::after {
transform: rotate(-90deg);
background-image: var(--icon-chevron);
background-position: center;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
content: "";
transition: transform var(--transition);
}
@ -1817,176 +1813,6 @@ article > footer {
border-top: var(--border-width) solid var(--card-border-color);
}
/**
* Modal (<dialog>)
*/
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: var(--spacing);
border: none;
background-color: var(--modal-overlay-background-color);
}
@media (min-width: 576px) {
dialog article {
max-width: 510px;
}
}
@media (min-width: 768px) {
dialog article {
max-width: 700px;
}
}
dialog article > header,
dialog article > footer {
padding: calc(var(--block-spacing-vertical) * 0.5) var(--block-spacing-horizontal);
}
dialog article > header .close {
margin: 0;
margin-left: var(--spacing);
float: right;
}
dialog article > footer {
text-align: right;
}
dialog article > footer [role=button] {
margin-bottom: 0;
}
dialog article > footer [role=button]:not(:first-of-type) {
margin-left: calc(var(--spacing) * 0.5);
}
dialog article p:last-of-type {
margin: 0;
}
dialog article .close {
display: block;
width: 1rem;
height: 1rem;
margin-top: calc(var(--block-spacing-vertical) * -0.5);
margin-bottom: var(--typography-spacing-vertical);
margin-left: auto;
background-image: var(--icon-close);
background-position: center;
background-size: auto 1rem;
background-repeat: no-repeat;
opacity: 0.5;
transition: opacity var(--transition);
}
dialog article .close:hover, dialog article .close:active, dialog article .close:focus {
opacity: 1;
}
dialog:not([open]), dialog[open=false] {
display: none;
}
.modal-is-open {
overflow: hidden;
pointer-events: none;
}
.modal-is-open body > *:not(dialog) {
filter: blur(0.1875rem);
}
.modal-is-open dialog {
pointer-events: auto;
}
.modal-is-opening body > *:not(dialog),
.modal-is-opening dialog,
.modal-is-opening dialog > article,
.modal-is-closing body > *:not(dialog),
.modal-is-closing dialog,
.modal-is-closing dialog > article {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.modal-is-opening body > *:not(dialog),
.modal-is-closing body > *:not(dialog) {
-webkit-animation-name: blurIn;
animation-name: blurIn;
}
.modal-is-opening dialog,
.modal-is-closing dialog {
-webkit-animation-name: fadeIn;
animation-name: fadeIn;
}
.modal-is-opening dialog > article,
.modal-is-closing dialog > article {
-webkit-animation-name: slideInDown;
animation-name: slideInDown;
}
.modal-is-closing body > *:not(dialog),
.modal-is-closing dialog,
.modal-is-closing dialog > article {
animation-direction: reverse;
}
@-webkit-keyframes blurIn {
from {
filter: blur(0);
}
to {
filter: blur(0.1875rem);
}
}
@keyframes blurIn {
from {
filter: blur(0);
}
to {
filter: blur(0.1875rem);
}
}
@-webkit-keyframes fadeIn {
from {
background-color: transparent;
}
to {
background-color: var(--modal-overlay-background-color);
}
}
@keyframes fadeIn {
from {
background-color: transparent;
}
to {
background-color: var(--modal-overlay-background-color);
}
}
@-webkit-keyframes slideInDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes slideInDown {
from {
transform: translateY(-100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
/**
* Nav
*/
@ -2058,8 +1884,8 @@ progress {
progress {
-webkit-appearance: none;
-moz-appearance: none;
display: inline-block;
appearance: none;
display: inline-block;
width: 100%;
height: 0.5rem;
margin-bottom: calc(var(--spacing) * 0.5);
@ -2083,7 +1909,7 @@ progress::-moz-progress-bar {
progress:indeterminate {
background: var(--progress-background-color) linear-gradient(to right, var(--progress-color) 30%, var(--progress-background-color) 30%) top left/150% 150% no-repeat;
-webkit-animation: progressIndeterminate 1s linear infinite;
animation: progressIndeterminate 1s linear infinite;
animation: progressIndeterminate 1s linear infinite;
}
progress:indeterminate[value]::-webkit-progress-value {
background-color: transparent;
@ -2124,20 +1950,20 @@ progress::-moz-progress-bar {
border: 0.1875em solid currentColor;
border-radius: 1em;
border-right-color: transparent;
content: "";
vertical-align: text-bottom;
vertical-align: -0.125em;
-webkit-animation: spinner 0.75s linear infinite;
animation: spinner 0.75s linear infinite;
animation: spinner 0.75s linear infinite;
content: "";
opacity: var(--loading-spinner-opacity);
}
[aria-busy=true]:not(input):not(select):not(textarea):not(:empty)::before {
margin-right: calc(var(--spacing) * 0.5);
margin-left: 0;
-webkit-margin-start: 0;
margin-inline-start: 0;
-webkit-margin-end: calc(var(--spacing) * 0.5);
margin-inline-end: calc(var(--spacing) * 0.5);
margin-inline-end: calc(var(--spacing) * 0.5);
-webkit-margin-start: 0;
margin-inline-start: 0;
}
[aria-busy=true]:not(input):not(select):not(textarea):empty {
text-align: center;
@ -2184,14 +2010,14 @@ a[aria-busy=true] {
transform: translate(-50%, -0.25rem);
border-radius: var(--border-radius);
background: var(--tooltip-background-color);
content: attr(data-tooltip);
color: var(--tooltip-color);
font-size: 0.875rem;
font-style: normal;
font-weight: var(--font-weight);
font-size: 0.875rem;
text-decoration: none;
text-overflow: ellipsis;
white-space: nowrap;
content: attr(data-tooltip);
opacity: 0;
pointer-events: none;
}
@ -2203,23 +2029,19 @@ a[aria-busy=true] {
border-left: 0.3rem solid transparent;
border-radius: 0;
background-color: transparent;
content: "";
color: var(--tooltip-background-color);
content: "";
}
[data-tooltip]:focus::before, [data-tooltip]:focus::after, [data-tooltip]:hover::before, [data-tooltip]:hover::after {
opacity: 1;
-webkit-animation-name: slide;
animation-name: slide;
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
}
@media (hover: hover) and (pointer: fine) {
[data-tooltip]:focus::before, [data-tooltip]:focus::after, [data-tooltip]:hover::before, [data-tooltip]:hover::after {
-webkit-animation-duration: 0.2s;
animation-duration: 0.2s;
-webkit-animation-name: slide;
animation-name: slide;
}
[data-tooltip]:focus::after, [data-tooltip]:hover::after {
-webkit-animation-name: slideCaret;
animation-name: slideCaret;
}
[data-tooltip]:focus::after, [data-tooltip]:hover::after {
-webkit-animation-name: slideCaret;
animation-name: slideCaret;
}
@-webkit-keyframes slide {
@ -2315,15 +2137,13 @@ textarea,
:not([aria-busy=true])::after {
background-attachment: initial !important;
-webkit-animation-duration: 1ms !important;
animation-duration: 1ms !important;
animation-duration: 1ms !important;
-webkit-animation-delay: -1ms !important;
animation-delay: -1ms !important;
animation-delay: -1ms !important;
-webkit-animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
animation-iteration-count: 1 !important;
scroll-behavior: auto !important;
transition-delay: 0s !important;
transition-duration: 0s !important;
}
}
/*# sourceMappingURL=pico.fluid.classless.css.map */

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

3
css/pico.min.css vendored

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -200,21 +200,19 @@ kbd {
0 0.125rem 2rem rgba(27, 40, 50, 0.08),
0 0 0 0.0625rem rgba(27, 40, 50, 0.024);
--card-sectionning-background-color: #fbfbfc;
--modal-overlay-background-color: rgba(213, 220, 226, 0.8);
--progress-background-color: #d5dce2;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(56, 142, 60, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
@media only screen and (prefers-color-scheme: dark) {
@ -293,21 +291,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
}
[data-theme=dark] {
@ -385,21 +381,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
/**
@ -421,18 +415,18 @@ kbd {
html {
-webkit-text-size-adjust: 100%;
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-ms-text-size-adjust: 100%;
text-rendering: optimizeLegibility;
background-color: var(--background-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
line-height: var(--line-height);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
line-height: var(--line-height);
text-rendering: optimizeLegibility;
cursor: default;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
}
/**
@ -585,9 +579,9 @@ ul {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-style: normal;
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
font-style: normal;
}
a {
@ -597,7 +591,7 @@ a {
background-color: var(--background-color);
color: var(--color);
-webkit-text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
text-decoration: var(--text-decoration);
}
a:hover, a:active, a:focus {
--color: var(--primary-hover);
@ -634,9 +628,9 @@ h6 {
margin-top: 0;
margin-bottom: var(--typography-spacing-vertical);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-family: var(--font-family);
font-size: var(--font-size);
font-weight: var(--font-weight);
}
h1 {
@ -730,8 +724,8 @@ hgroup > * {
hgroup > *:last-child {
--color: var(--muted-color);
--font-weight: unset;
font-size: 1rem;
font-family: unset;
font-size: 1rem;
}
p {
@ -746,10 +740,10 @@ ul,
ol {
padding-right: 0;
padding-left: var(--spacing);
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
-webkit-padding-end: 0;
padding-inline-end: 0;
padding-inline-end: 0;
-webkit-padding-start: var(--spacing);
padding-inline-start: var(--spacing);
}
ul li,
ol li {
@ -773,10 +767,10 @@ blockquote {
padding: var(--spacing);
border-right: none;
border-left: 0.25rem solid var(--blockquote-border-color);
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
-webkit-border-end: none;
border-inline-end: none;
border-inline-end: none;
-webkit-border-start: 0.25rem solid var(--blockquote-border-color);
border-inline-start: 0.25rem solid var(--blockquote-border-color);
}
blockquote footer {
margin-top: calc(var(--typography-spacing-vertical) * 0.5);
@ -898,8 +892,8 @@ a[role=button] {
background-color: var(--background-color);
box-shadow: var(--box-shadow);
color: var(--color);
font-weight: var(--font-weight);
font-size: 1rem;
font-weight: var(--font-weight);
line-height: var(--line-height);
text-align: center;
cursor: pointer;
@ -1098,10 +1092,10 @@ optgroup,
select,
textarea {
margin: 0;
font-size: 1rem;
line-height: var(--line-height);
font-family: inherit;
font-size: 1rem;
letter-spacing: inherit;
line-height: var(--line-height);
}
input {
@ -1197,8 +1191,8 @@ input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]),
select,
textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-moz-appearance: none;
appearance: none;
padding: var(--form-element-spacing-vertical) var(--form-element-spacing-horizontal);
vertical-align: middle;
}
@ -1254,13 +1248,13 @@ select:not([type=checkbox]):not([type=radio])[aria-invalid],
textarea:not([type=checkbox]):not([type=radio])[aria-invalid] {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
@ -1297,13 +1291,9 @@ textarea[aria-invalid=true]:focus {
--border-color: var(--form-element-invalid-active-border-color);
}
[dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=true], [dir=rtl] input:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] select:not([type=checkbox]):not([type=radio])[aria-invalid=false],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=true],
[dir=rtl] textarea:not([type=checkbox]):not([type=radio])[aria-invalid=false] {
[dir=rtl] input[aria-invalid],
[dir=rtl] select[aria-invalid],
[dir=rtl] textarea[aria-invalid] {
background-position: center left 0.75rem;
}
@ -1329,14 +1319,14 @@ select::-ms-expand {
select:not([multiple]):not([size]) {
padding-right: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-left: var(--form-element-spacing-horizontal);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
-webkit-padding-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
padding-inline-end: calc(var(--form-element-spacing-horizontal) + 1.5rem);
-webkit-padding-start: var(--form-element-spacing-horizontal);
padding-inline-start: var(--form-element-spacing-horizontal);
background-image: var(--icon-chevron);
background-position: center right 0.75rem;
background-size: 1rem auto;
background-repeat: no-repeat;
background-size: 1rem auto;
}
[dir=rtl] select:not([multiple]):not([size]) {
@ -1373,8 +1363,8 @@ td {
padding: calc(var(--spacing) / 2) var(--spacing);
border-bottom: var(--border-width) solid var(--table-border-color);
color: var(--color);
font-weight: var(--font-weight);
font-size: var(--font-size);
font-weight: var(--font-weight);
text-align: left;
text-align: start;
}
@ -1423,5 +1413,3 @@ textarea,
[dir=rtl] {
direction: rtl;
}
/*# sourceMappingURL=pico.slim.css.map */

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -1,12 +0,0 @@
module.exports = {
map: {
inline: false,
annotation: true,
sourcesContent: true
},
plugins: {
autoprefixer: {
cascade: false
}
}
}

View file

@ -96,23 +96,6 @@ section {
}
}
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2);
--block-spacing-horizontal: var(--spacing);
}
@media (min-width: 576px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 2.5);
--block-spacing-horizontal: calc(var(--spacing) * 1.25);
}
}
@media (min-width: 768px) {
dialog > article {
--block-spacing-vertical: calc(var(--spacing) * 3);
--block-spacing-horizontal: calc(var(--spacing) * 1.5);
}
}
a {
--text-decoration: none;
}
@ -264,21 +247,19 @@ kbd {
0 0.125rem 2rem rgba(27, 40, 50, 0.08),
0 0 0 0.0625rem rgba(27, 40, 50, 0.024);
--card-sectionning-background-color: #fbfbfc;
--modal-overlay-background-color: rgba(213, 220, 226, 0.8);
--progress-background-color: #d5dce2;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(65, 84, 98, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(56, 142, 60, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(198, 40, 40, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
@media only screen and (prefers-color-scheme: dark) {
@ -357,21 +338,19 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
}
[data-theme=dark] {
@ -449,21 +428,17 @@ kbd {
0 0.125rem 2rem rgba(0, 0, 0, 0.12),
0 0 0 0.0625rem rgba(0, 0, 0, 0.036);
--card-sectionning-background-color: #18232c;
--modal-overlay-background-color: rgba(36, 51, 62, 0.9);
--progress-background-color: #24333e;
--progress-color: var(--primary);
--loading-spinner-opacity: 0.5;
--tooltip-background-color: var(--contrast);
--tooltip-color: var(--contrast-inverse);
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
--icon-close: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(115, 130, 140, 0.999)' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E");
--icon-date: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2' ry='2'%3E%3C/rect%3E%3Cline x1='16' y1='2' x2='16' y2='6'%3E%3C/line%3E%3Cline x1='8' y1='2' x2='8' y2='6'%3E%3C/line%3E%3Cline x1='3' y1='10' x2='21' y2='10'%3E%3C/line%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-time: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpolyline points='12 6 12 12 16 14'%3E%3C/polyline%3E%3C/svg%3E");
--icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(162, 175, 185, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'%3E%3C/circle%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'%3E%3C/line%3E%3C/svg%3E");
--icon-checkbox: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-minus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23FFF' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='5' y1='12' x2='19' y2='12'%3E%3C/line%3E%3C/svg%3E");
--icon-valid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(46, 125, 50, 0.999)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
--icon-invalid: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgba(183, 28, 28, 0.999)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cline x1='12' y1='8' x2='12' y2='12'%3E%3C/line%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'%3E%3C/line%3E%3C/svg%3E");
}
/*# sourceMappingURL=default.css.map */

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long