Summary Files Commits Branches @commit @diff @stats
path: root / dist / spectre.css
diff options
context:
space:
mode:
1 files changed, 124 insertions, 116 deletions
-rw-r--r--dist/spectre.css240
diff --git a/dist/spectre.css b/dist/spectre.css
index dca5d92..ce75b68 100644
--- a/dist/spectre.css
+++ b/dist/spectre.css
@@ -1,4 +1,4 @@
-/*! Spectre.css v0.5.3 | MIT License | github.com/picturepan2/spectre */
+/*! Spectre.css v0.5.4 | MIT License | github.com/picturepan2/spectre */
/* Manually forked from Normalize.css */
/* normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/** 1. Change the default font family in all browsers (opinionated). 2. Correct the line height in all browsers. 3. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */
@@ -287,7 +287,7 @@ html {
body {
background: #fff;
- color: #50596c;
+ color: #3b4351;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
font-size: .8rem;
overflow-x: hidden;
@@ -386,7 +386,7 @@ abbr[title] {
}
kbd {
- background: #454d5d;
+ background: #303742;
border-radius: .1rem;
color: #fff;
font-size: .7rem;
@@ -397,12 +397,12 @@ kbd {
mark {
background: #ffe9b3;
border-radius: .1rem;
- color: #50596c;
+ color: #3b4351;
padding: .05rem;
}
blockquote {
- border-left: .1rem solid #e7e9ed;
+ border-left: .1rem solid #dadee4;
margin-left: 0;
padding: .4rem .8rem;
}
@@ -515,16 +515,16 @@ dl dd {
}
.table.table-striped tbody tr:nth-of-type(odd) {
- background: #f8f9fa;
+ background: #f7f8f9;
}
.table tbody tr.active,
.table.table-striped tbody tr.active {
- background: #f0f1f4;
+ background: #eef0f3;
}
.table.table-hover tbody tr:hover {
- background: #f0f1f4;
+ background: #eef0f3;
}
.table.table-scroll {
@@ -536,7 +536,7 @@ dl dd {
.table td,
.table th {
- border-bottom: .05rem solid #e7e9ed;
+ border-bottom: .05rem solid #dadee4;
padding: .6rem .4rem;
}
@@ -833,9 +833,9 @@ legend {
appearance: none;
background: #fff;
background-image: none;
- border: .05rem solid #caced7;
+ border: .05rem solid #bcc3ce;
border-radius: .1rem;
- color: #50596c;
+ color: #3b4351;
display: block;
font-size: .8rem;
height: 1.8rem;
@@ -854,19 +854,19 @@ legend {
}
.form-input::-webkit-input-placeholder {
- color: #acb3c2;
+ color: #bcc3ce;
}
.form-input:-ms-input-placeholder {
- color: #acb3c2;
+ color: #bcc3ce;
}
.form-input::-ms-input-placeholder {
- color: #acb3c2;
+ color: #bcc3ce;
}
.form-input::placeholder {
- color: #acb3c2;
+ color: #bcc3ce;
}
.form-input.input-sm {
@@ -896,7 +896,7 @@ textarea.form-input {
}
.form-input-hint {
- color: #acb3c2;
+ color: #bcc3ce;
font-size: .7rem;
margin-top: .2rem;
}
@@ -915,7 +915,8 @@ textarea.form-input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
- border: .05rem solid #caced7;
+ background: #fff;
+ border: .05rem solid #bcc3ce;
border-radius: .1rem;
color: inherit;
font-size: .8rem;
@@ -927,21 +928,6 @@ textarea.form-input {
width: 100%;
}
-.form-select[size],
-.form-select[multiple] {
- height: auto;
-}
-
-.form-select[size] option,
-.form-select[multiple] option {
- padding: .1rem .2rem;
-}
-
-.form-select:not([multiple]):not([size]) {
- background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;
- padding-right: 1.2rem;
-}
-
.form-select:focus {
border-color: #5755d9;
box-shadow: 0 0 0 .1rem rgba(87, 85, 217, .2);
@@ -963,6 +949,22 @@ textarea.form-input {
padding: .35rem 1.4rem .35rem .6rem;
}
+.form-select[size],
+.form-select[multiple] {
+ height: auto;
+ padding: .25rem .4rem;
+}
+
+.form-select[size] option,
+.form-select[multiple] option {
+ padding: .1rem .2rem;
+}
+
+.form-select:not([multiple]):not([size]) {
+ background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%204%205'%3E%3Cpath%20fill='%23667189'%20d='M2%200L0%202h4zm0%205L0%203h4z'/%3E%3C/svg%3E") no-repeat right .35rem center/.4rem .5rem;
+ padding-right: 1.2rem;
+}
+
.has-icon-left,
.has-icon-right {
position: relative;
@@ -1034,7 +1036,7 @@ textarea.form-input {
.form-checkbox .form-icon,
.form-radio .form-icon,
.form-switch .form-icon {
- border: .05rem solid #caced7;
+ border: .05rem solid #bcc3ce;
cursor: pointer;
display: inline-block;
position: absolute;
@@ -1066,7 +1068,7 @@ textarea.form-input {
.form-checkbox input:active + .form-icon,
.form-radio input:active + .form-icon {
- background: #f0f1f4;
+ background: #eef0f3;
}
.form-checkbox .form-icon {
@@ -1079,14 +1081,14 @@ textarea.form-input {
border-left-width: 0;
border-top-width: 0;
content: "";
- height: 12px;
+ height: 9px;
left: 50%;
- margin-left: -4px;
- margin-top: -8px;
+ margin-left: -3px;
+ margin-top: -6px;
position: absolute;
top: 50%;
transform: rotate(45deg);
- width: 8px;
+ width: 6px;
}
.form-checkbox input:indeterminate + .form-icon {
@@ -1114,12 +1116,12 @@ textarea.form-input {
background: #fff;
border-radius: 50%;
content: "";
- height: 4px;
+ height: 6px;
left: 50%;
position: absolute;
top: 50%;
transform: translate(-50%, -50%);
- width: 4px;
+ width: 6px;
}
.form-switch {
@@ -1127,7 +1129,7 @@ textarea.form-input {
}
.form-switch .form-icon {
- background: #e7e9ed;
+ background: #bcc3ce;
background-clip: padding-box;
border-radius: .45rem;
height: .9rem;
@@ -1154,7 +1156,7 @@ textarea.form-input {
}
.form-switch input:active + .form-icon::before {
- background: #f8f9fa;
+ background: #f7f8f9;
}
.input-group {
@@ -1163,8 +1165,8 @@ textarea.form-input {
}
.input-group .input-group-addon {
- background: #f8f9fa;
- border: .05rem solid #caced7;
+ background: #f7f8f9;
+ border: .05rem solid #bcc3ce;
border-radius: .1rem;
line-height: 1.2rem;
padding: .25rem .4rem;
@@ -1312,18 +1314,18 @@ textarea.form-input {
.form-input.disabled,
.form-select:disabled,
.form-select.disabled {
- background-color: #f0f1f4;
+ background-color: #eef0f3;
cursor: not-allowed;
opacity: .5;
}
.form-input[readonly] {
- background-color: #f8f9fa;
+ background-color: #f7f8f9;
}
input:disabled + .form-icon,
input.disabled + .form-icon {
- background: #f0f1f4;
+ background: #eef0f3;
cursor: not-allowed;
opacity: .5;
}
@@ -1349,9 +1351,9 @@ input.disabled + .form-icon {
}
.label {
- background: #f0f1f4;
+ background: #eef0f3;
border-radius: .1rem;
- color: #5b657a;
+ color: #455060;
display: inline-block;
line-height: 1.2;
padding: .1rem .2rem;
@@ -1399,12 +1401,12 @@ code {
.code {
border-radius: .1rem;
- color: #50596c;
+ color: #3b4351;
position: relative;
}
.code::before {
- color: #acb3c2;
+ color: #bcc3ce;
content: attr(data-lang);
font-size: .7rem;
position: absolute;
@@ -1413,7 +1415,7 @@ code {
}
.code code {
- background: #f8f9fa;
+ background: #f7f8f9;
color: inherit;
display: block;
line-height: 1.5;
@@ -1485,7 +1487,7 @@ video.video-responsive::before {
}
.figure .figure-caption {
- color: #667189;
+ color: #66758c;
margin-top: .4rem;
}
@@ -2073,7 +2075,7 @@ summary.accordion-header::-webkit-details-marker {
}
.avatar .avatar-presence {
- background: #acb3c2;
+ background: #bcc3ce;
border-radius: 50%;
box-shadow: 0 0 0 .1rem #fff;
height: .5em;
@@ -2159,7 +2161,7 @@ summary.accordion-header::-webkit-details-marker {
}
.breadcrumb .breadcrumb-item {
- color: #667189;
+ color: #66758c;
display: inline-block;
margin: 0;
padding: .2rem 0;
@@ -2170,17 +2172,17 @@ summary.accordion-header::-webkit-details-marker {
}
.breadcrumb .breadcrumb-item:not(:last-child) a {
- color: #667189;
+ color: #66758c;
}
.breadcrumb .breadcrumb-item:not(:first-child)::before {
- color: #e7e9ed;
+ color: #66758c;
content: "/";
padding-right: .4rem;
}
.bar {
- background: #f0f1f4;
+ background: #eef0f3;
border-radius: .1rem;
display: flex;
display: -ms-flexbox;
@@ -2233,7 +2235,7 @@ summary.accordion-header::-webkit-details-marker {
}
.bar-slider .bar-item:not(:last-child):first-child {
- background: #f0f1f4;
+ background: #eef0f3;
z-index: 1;
}
@@ -2256,7 +2258,7 @@ summary.accordion-header::-webkit-details-marker {
.card {
background: #fff;
- border: .05rem solid #e7e9ed;
+ border: .05rem solid #dadee4;
border-radius: .1rem;
display: flex;
display: -ms-flexbox;
@@ -2302,9 +2304,8 @@ summary.accordion-header::-webkit-details-marker {
.chip {
align-items: center;
- background: #f0f1f4;
+ background: #eef0f3;
border-radius: 5rem;
- color: #667189;
display: inline-flex;
display: -ms-inline-flexbox;
-ms-flex-align: center;
@@ -2312,10 +2313,13 @@ summary.accordion-header::-webkit-details-marker {
height: 1.2rem;
line-height: .8rem;
margin: .1rem;
- max-width: 100%;
+ max-width: 320px;
+ overflow-x: hidden;
padding: .2rem .4rem;
text-decoration: none;
+ text-overflow: ellipsis;
vertical-align: middle;
+ white-space: nowrap;
}
.chip.active {
@@ -2364,9 +2368,9 @@ summary.accordion-header::-webkit-details-marker {
}
.empty {
- background: #f8f9fa;
+ background: #f7f8f9;
border-radius: .1rem;
- color: #667189;
+ color: #66758c;
padding: 3.2rem 1.6rem;
text-align: center;
}
@@ -2387,7 +2391,7 @@ summary.accordion-header::-webkit-details-marker {
.menu {
background: #fff;
border-radius: .1rem;
- box-shadow: 0 .05rem .2rem rgba(69, 77, 93, .3);
+ box-shadow: 0 .05rem .2rem rgba(48, 55, 66, .3);
list-style: none;
margin: 0;
min-width: 180px;
@@ -2477,7 +2481,7 @@ summary.accordion-header::-webkit-details-marker {
.modal:target .modal-overlay,
.modal.active .modal-overlay {
- background: rgba(248, 249, 250, .75);
+ background: rgba(247, 248, 249, .75);
bottom: 0;
cursor: default;
display: block;
@@ -2510,7 +2514,7 @@ summary.accordion-header::-webkit-details-marker {
.modal-container {
background: #fff;
border-radius: .1rem;
- box-shadow: 0 .2rem .5rem rgba(69, 77, 93, .3);
+ box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3);
display: flex;
display: -ms-flexbox;
-ms-flex-direction: column;
@@ -2526,7 +2530,7 @@ summary.accordion-header::-webkit-details-marker {
}
.modal-container .modal-header {
- color: #454d5d;
+ color: #303742;
padding: .8rem;
}
@@ -2551,7 +2555,7 @@ summary.accordion-header::-webkit-details-marker {
}
.nav .nav-item a {
- color: #667189;
+ color: #66758c;
padding: .2rem .4rem;
text-decoration: none;
}
@@ -2562,7 +2566,7 @@ summary.accordion-header::-webkit-details-marker {
}
.nav .nav-item.active > a {
- color: #50596c;
+ color: #505c6e;
font-weight: bold;
}
@@ -2595,7 +2599,6 @@ summary.accordion-header::-webkit-details-marker {
.pagination .page-item a {
border-radius: .1rem;
- color: #667189;
display: inline-block;
padding: .2rem .4rem;
text-decoration: none;
@@ -2637,7 +2640,7 @@ summary.accordion-header::-webkit-details-marker {
}
.panel {
- border: .05rem solid #e7e9ed;
+ border: .05rem solid #dadee4;
border-radius: .1rem;
display: flex;
display: -ms-flexbox;
@@ -2685,7 +2688,7 @@ summary.accordion-header::-webkit-details-marker {
.popover:hover .popover-container {
display: block;
opacity: 1;
- transform: translate(-50%, -100%);
+ transform: translate(-50%, -100%) scale(1);
}
.popover.popover-right .popover-container {
@@ -2695,7 +2698,7 @@ summary.accordion-header::-webkit-details-marker {
.popover.popover-right *:focus + .popover-container,
.popover.popover-right:hover .popover-container {
- transform: translate(0, -50%);
+ transform: translate(0, -50%) scale(1);
}
.popover.popover-bottom .popover-container {
@@ -2705,7 +2708,7 @@ summary.accordion-header::-webkit-details-marker {
.popover.popover-bottom *:focus + .popover-container,
.popover.popover-bottom:hover .popover-container {
- transform: translate(-50%, 0);
+ transform: translate(-50%, 0) scale(1);
}
.popover.popover-left .popover-container {
@@ -2715,12 +2718,12 @@ summary.accordion-header::-webkit-details-marker {
.popover.popover-left *:focus + .popover-container,
.popover.popover-left:hover .popover-container {
- transform: translate(-100%, -50%);
+ transform: translate(-100%, -50%) scale(1);
}
.popover .card {
border: 0;
- box-shadow: 0 .2rem .5rem rgba(69, 77, 93, .3);
+ box-shadow: 0 .2rem .5rem rgba(48, 55, 66, .3);
}
.step {
@@ -2753,7 +2756,7 @@ summary.accordion-header::-webkit-details-marker {
}
.step .step-item a {
- color: #acb3c2;
+ color: #bcc3ce;
display: inline-block;
padding: 20px 10px 0;
text-decoration: none;
@@ -2780,16 +2783,16 @@ summary.accordion-header::-webkit-details-marker {
}
.step .step-item.active ~ .step-item::before {
- background: #e7e9ed;
+ background: #dadee4;
}
.step .step-item.active ~ .step-item a::before {
- background: #e7e9ed;
+ background: #f7f8f9;
}
.tab {
align-items: center;
- border-bottom: .05rem solid #e7e9ed;
+ border-bottom: .05rem solid #dadee4;
display: flex;
display: -ms-flexbox;
-ms-flex-align: center;
@@ -2905,9 +2908,9 @@ summary.accordion-header::-webkit-details-marker {
}
.toast {
- background: rgba(69, 77, 93, .9);
- border: .05rem solid #454d5d;
- border-color: #454d5d;
+ background: rgba(48, 55, 66, .95);
+ border: .05rem solid #303742;
+ border-color: #303742;
border-radius: .1rem;
color: #fff;
display: block;
@@ -2916,22 +2919,22 @@ summary.accordion-header::-webkit-details-marker {
}
.toast.toast-primary {
- background: rgba(87, 85, 217, .9);
+ background: rgba(87, 85, 217, .95);
border-color: #5755d9;
}
.toast.toast-success {
- background: rgba(50, 182, 67, .9);
+ background: rgba(50, 182, 67, .95);
border-color: #32b643;
}
.toast.toast-warning {
- background: rgba(255, 183, 0, .9);
+ background: rgba(255, 183, 0, .95);
border-color: #ffb700;
}
.toast.toast-error {
- background: rgba(232, 86, 0, .9);
+ background: rgba(232, 86, 0, .95);
border-color: #e85600;
}
@@ -2956,7 +2959,7 @@ summary.accordion-header::-webkit-details-marker {
}
.tooltip::after {
- background: rgba(69, 77, 93, .9);
+ background: rgba(48, 55, 66, .95);
border-radius: .1rem;
bottom: 100%;
color: #fff;
@@ -3043,7 +3046,7 @@ summary.accordion-header::-webkit-details-marker {
}
.text-primary {
- color: #5755d9;
+ color: #5755d9 !important;
}
a.text-primary:focus,
@@ -3056,7 +3059,7 @@ a.text-primary:visited {
}
.text-secondary {
- color: #e5e5f9;
+ color: #e5e5f9 !important;
}
a.text-secondary:focus,
@@ -3069,20 +3072,20 @@ a.text-secondary:visited {
}
.text-gray {
- color: #acb3c2;
+ color: #66758c !important;
}
a.text-gray:focus,
a.text-gray:hover {
- color: #9ea6b7;
+ color: #5b687d;
}
a.text-gray:visited {
- color: #bbc1cd;
+ color: #728199;
}
.text-light {
- color: #fff;
+ color: #fff !important;
}
a.text-light:focus,
@@ -3095,20 +3098,20 @@ a.text-light:visited {
}
.text-dark {
- color: #50596c;
+ color: #3b4351 !important;
}
a.text-dark:focus,
a.text-dark:hover {
- color: #454d5d;
+ color: #303742;
}
a.text-dark:visited {
- color: #5b657a;
+ color: #455060;
}
.text-success {
- color: #32b643;
+ color: #32b643 !important;
}
a.text-success:focus,
@@ -3121,7 +3124,7 @@ a.text-success:visited {
}
.text-warning {
- color: #ffb700;
+ color: #ffb700 !important;
}
a.text-warning:focus,
@@ -3134,7 +3137,7 @@ a.text-warning:visited {
}
.text-error {
- color: #e85600;
+ color: #e85600 !important;
}
a.text-error:focus,
@@ -3147,35 +3150,35 @@ a.text-error:visited {
}
.bg-primary {
- background: #5755d9;
+ background: #5755d9 !important;
color: #fff;
}
.bg-secondary {
- background: #f1f1fc;
+ background: #f1f1fc !important;
}
.bg-dark {
- background: #454d5d;
+ background: #303742 !important;
color: #fff;
}
.bg-gray {
- background: #f8f9fa;
+ background: #f7f8f9 !important;
}
.bg-success {
- background: #32b643;
+ background: #32b643 !important;
color: #fff;
}
.bg-warning {
- background: #ffb700;
+ background: #ffb700 !important;
color: #fff;
}
.bg-error {
- background: #e85600;
+ background: #e85600 !important;
color: #fff;
}
@@ -3267,7 +3270,7 @@ a.text-error:visited {
.divider[data-content]::after,
.divider-vert[data-content]::after {
background: #fff;
- color: #acb3c2;
+ color: #bcc3ce;
content: attr(data-content);
display: inline-block;
font-size: .7rem;
@@ -3276,7 +3279,7 @@ a.text-error:visited {
}
.divider {
- border-top: .05rem solid #e7e9ed;
+ border-top: .05rem solid #dadee4;
height: .05rem;
margin: .4rem 0;
}
@@ -3291,7 +3294,7 @@ a.text-error:visited {
}
.divider-vert::before {
- border-left: .05rem solid #e7e9ed;
+ border-left: .05rem solid #dadee4;
bottom: .4rem;
content: "";
display: block;
@@ -3360,19 +3363,24 @@ a.text-error:visited {
float: right !important;
}
-.relative {
+.p-relative {
position: relative !important;
}
-.absolute {
+.p-absolute {
position: absolute !important;
}
-.fixed {
+.p-fixed {
position: fixed !important;
}
-.centered {
+.p-sticky {
+ position: sticky !important;
+ position: -webkit-sticky !important;
+}
+
+.p-centered {
display: block;
float: none;
margin-left: auto;
generated by cgit v1.3.1-23-gd82d (git 2.54.0) at 2026-11-12 10:52:28 +0000