Summary Files Commits Branches @commit @diff @stats
path: root / docs / dist / spectre.css
diff options
context:
space:
mode:
1 files changed, 746 insertions, 541 deletions
-rw-r--r--docs/dist/spectre.css1287
diff --git a/docs/dist/spectre.css b/docs/dist/spectre.css
index cb821d4..bca18e2 100644
--- a/docs/dist/spectre.css
+++ b/docs/dist/spectre.css
@@ -142,6 +142,8 @@ dfn {
*/
small {
font-size: 80%;
+ font-weight: 400;
+ /* (added) */
}
/**
* Prevent `sub` and `sup` elements from affecting the line height in
@@ -385,15 +387,15 @@ template {
}
html {
box-sizing: border-box;
- font-size: 10px;
+ font-size: 20px;
line-height: 1.42857143;
-webkit-tap-highlight-color: transparent;
}
body {
background: #fff;
- color: #50596c;
+ color: #454d5d;
font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
- font-size: 1.4rem;
+ font-size: .7rem;
overflow-x: hidden;
text-rendering: optimizeLegibility;
}
@@ -403,13 +405,13 @@ a {
text-decoration: none;
}
a:focus {
- box-shadow: 0 0 0 .2rem rgba(87, 100, 198, .15);
+ box-shadow: 0 0 0 .1rem rgba(87, 100, 198, .2);
}
a:focus,
a:hover,
a:active,
a.active {
- color: #3b49af;
+ color: #4452c0;
text-decoration: underline;
}
h1,
@@ -419,32 +421,46 @@ h4,
h5,
h6 {
color: inherit;
- font-weight: 300;
+ font-weight: 500;
line-height: 1.2;
- margin-bottom: 1.5rem;
+ margin-bottom: .5em;
margin-top: 0;
}
-h1 {
- font-size: 5rem;
+.h1,
+.h2,
+.h3,
+.h4,
+.h5,
+.h6 {
+ font-weight: 500;
}
-h2 {
- font-size: 4rem;
+h1,
+.h1 {
+ font-size: 2rem;
}
-h3 {
- font-size: 3rem;
+h2,
+.h2 {
+ font-size: 1.6rem;
}
-h4 {
- font-size: 2.4rem;
+h3,
+.h3 {
+ font-size: 1.4rem;
}
-h5 {
- font-size: 2rem;
+h4,
+.h4 {
+ font-size: 1.2rem;
}
-h6 {
- font-size: 1.6rem;
+h5,
+.h5 {
+ font-size: 1rem;
+}
+h6,
+.h6 {
+ font-size: .8rem;
}
p {
- line-height: 2.4rem;
- margin: 0 0 1rem;
+ line-height: 1.2rem;
+ margin: 0 0 .8rem;
}
a,
ins,
@@ -452,10 +468,33 @@ u {
-webkit-text-decoration-skip: ink edges;
text-decoration-skip: ink edges;
}
+abbr[title] {
+ border-bottom: .05rem dotted;
+ cursor: help;
+ text-decoration: none;
+}
+kbd {
+ background: #454d5d;
+ border-radius: .1rem;
+ color: #fff;
+ display: inline-block;
+ line-height: 1;
+ padding: .2em .3em;
+ vertical-align: baseline;
+}
+mark {
+ background: #ffe9b3;
+ border-radius: .1rem;
+ color: #454d5d;
+ display: inline-block;
+ line-height: 1;
+ padding: .2em .3em;
+ vertical-align: baseline;
+}
blockquote {
- border-left: .2rem solid #f0f1f4;
+ border-left: .1rem solid #e7e9ed;
margin-left: 0;
- padding: 1rem 2rem;
+ padding: .4rem .8rem;
}
blockquote p:last-child {
margin-bottom: 0;
@@ -465,18 +504,18 @@ blockquote cite {
}
ul,
ol {
- margin: 2rem 0 2rem 2rem;
+ margin: .8rem 0 .8rem .8rem;
padding: 0;
}
ul ul,
ol ul,
ul ol,
ol ol {
- margin: 1.5rem 0 1.5rem 2rem;
+ margin: .8rem 0 .8rem .8rem;
}
ul li,
ol li {
- margin-top: 1rem;
+ margin-top: .4rem;
}
ul {
list-style: disc inside;
@@ -494,36 +533,16 @@ dl dt {
font-weight: bold;
}
dl dd {
- margin: .5rem 0 1.5rem 0;
+ margin: .4rem 0 .8rem 0;
}
-mark {
- background: #ffe9b3;
- border-radius: .2rem;
- color: #50596c;
- display: inline-block;
- line-height: 1;
- padding: .3rem .4rem;
- vertical-align: baseline;
+:lang(zh) {
+ font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", sans-serif;
}
-kbd {
- background: #454d5d;
- border-radius: .2rem;
- color: #fff;
- display: inline-block;
- line-height: 1;
- padding: .3rem .4rem;
- vertical-align: baseline;
+:lang(ja) {
+ font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Hiragino Kaku Gothic Pro", "Yu Gothic", YuGothic, Meiryo, "Helvetica Neue", sans-serif;
}
-abbr[title] {
- border-bottom: .1rem dotted;
- cursor: help;
- text-decoration: none;
-}
-:lang(zh),
-:lang(ja),
-:lang(ko),
-.cjk {
- font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Hiragino Kaku Gothic Pro", Meiryo, "Malgun Gothic", "Helvetica Neue", sans-serif;
+:lang(ko) {
+ font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Malgun Gothic", "Helvetica Neue", sans-serif;
}
:lang(zh) ins,
:lang(ja) ins,
@@ -531,7 +550,7 @@ abbr[title] {
:lang(zh) u,
:lang(ja) u,
.cjk u {
- border-bottom: .1rem solid;
+ border-bottom: .05rem solid;
text-decoration: none;
}
:lang(zh) del + del,
@@ -576,29 +595,29 @@ abbr[title] {
.table.table-striped tbody tr.active {
background: #f0f1f4;
}
-.table td {
- border-bottom: .1rem solid #f0f1f4;
- padding: 1.5rem 1rem;
+.table td,
+.table th {
+ border-bottom: .05rem solid #e7e9ed;
+ padding: .6rem .4rem;
}
.table th {
- border-bottom: .1rem solid #727e96;
- padding: 1.5rem 1rem;
+ border-bottom-width: .1rem;
}
.btn {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: #fff;
- border: .1rem solid #5764c6;
- border-radius: .2rem;
+ border: .05rem solid #5764c6;
+ border-radius: .1rem;
color: #5764c6;
cursor: pointer;
display: inline-block;
- font-size: 1.4rem;
- height: 3.2rem;
- line-height: 2rem;
+ font-size: .7rem;
+ height: 1.6rem;
+ line-height: 1rem;
outline: none;
- padding: .5rem .8rem;
+ padding: .25rem .4rem;
text-align: center;
text-decoration: none;
transition: all .2s ease;
@@ -610,14 +629,13 @@ abbr[title] {
white-space: nowrap;
}
.btn:focus {
- background: #fbfbfe;
- box-shadow: 0 0 0 .2rem rgba(87, 100, 198, .15);
+ background: #eff1fa;
+ box-shadow: 0 0 0 .1rem rgba(87, 100, 198, .2);
text-decoration: none;
}
.btn:hover {
- background: #5764c6;
+ background: #eff1fa;
border-color: #4c59c2;
- color: #fff;
text-decoration: none;
}
.btn:active,
@@ -627,6 +645,11 @@ abbr[title] {
color: #fff;
text-decoration: none;
}
+.btn:active.loading::after,
+.btn.active.loading::after {
+ border-bottom-color: #fff;
+ border-left-color: #fff;
+}
.btn[disabled],
.btn:disabled,
.btn.disabled {
@@ -664,17 +687,17 @@ abbr[title] {
.btn.btn-link:hover,
.btn.btn-link:active,
.btn.btn-link.active {
- color: #3b49af;
+ color: #4452c0;
}
.btn.btn-sm {
- font-size: 1.2rem;
- height: 2.4rem;
- padding: .1rem .8rem;
+ font-size: .6rem;
+ height: 1.2rem;
+ padding: .05rem .4rem;
}
.btn.btn-lg {
- font-size: 1.6rem;
- height: 4rem;
- padding: .9rem .8rem;
+ font-size: .8rem;
+ height: 2rem;
+ padding: .45rem .4rem;
}
.btn.btn-block {
display: block;
@@ -683,26 +706,26 @@ abbr[title] {
.btn.btn-action {
padding-left: 0;
padding-right: 0;
- width: 3.2rem;
+ width: 1.6rem;
}
.btn.btn-action.btn-sm {
- width: 2.4rem;
+ width: 1.2rem;
}
.btn.btn-action.btn-lg {
- width: 4rem;
+ width: 2rem;
}
.btn.btn-clear {
background: transparent;
border: 0;
color: currentColor;
- height: 1.6rem;
- line-height: 1.6rem;
- margin-left: .4rem;
- margin-right: -.2rem;
+ height: .8rem;
+ line-height: .8rem;
+ margin-left: .2rem;
+ margin-right: -2px;
opacity: .45;
- padding: 0 .2rem;
+ padding: 0 2px;
text-decoration: none;
- width: 1.6rem;
+ width: .8rem;
}
.btn.btn-clear:hover {
opacity: .85;
@@ -729,12 +752,12 @@ abbr[title] {
}
.btn-group .btn:not(:first-child):not(:last-child) {
border-radius: 0;
- margin-left: -.1rem;
+ margin-left: -.05rem;
}
.btn-group .btn:last-child:not(:first-child) {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
- margin-left: -.1rem;
+ margin-left: -.05rem;
}
.btn-group .btn:focus,
.btn-group .btn:hover,
@@ -753,17 +776,25 @@ abbr[title] {
flex: 1 0 0;
}
.form-group:not(:last-child) {
- margin-bottom: 1rem;
+ margin-bottom: .4rem;
+}
+fieldset {
+ margin-bottom: .8rem;
+}
+legend {
+ font-size: .8rem;
+ font-weight: 500;
+ margin-bottom: .8rem;
}
.form-label {
display: block;
- padding: .6rem 0;
+ padding: .3rem 0;
}
.form-label.label-sm {
- padding: .2rem 0;
+ padding: .1rem 0;
}
.form-label.label-lg {
- padding: 1rem 0;
+ padding: .5rem 0;
}
.form-input {
-webkit-appearance: none;
@@ -771,23 +802,23 @@ abbr[title] {
appearance: none;
background: #fff;
background-image: none;
- border: .1rem solid #c4c9d3;
- border-radius: .2rem;
- color: #50596c;
+ border: .05rem solid #caced7;
+ border-radius: .1rem;
+ color: #454d5d;
display: block;
- font-size: 1.4rem;
- height: 3.2rem;
- line-height: 2rem;
+ font-size: .7rem;
+ height: 1.6rem;
+ line-height: 1rem;
max-width: 100%;
outline: none;
- padding: .5rem .8rem;
+ padding: .25rem .4rem;
position: relative;
transition: all .2s ease;
width: 100%;
}
.form-input:focus {
border-color: #5764c6;
- box-shadow: 0 0 0 .2rem rgba(87, 100, 198, .15);
+ box-shadow: 0 0 0 .1rem rgba(87, 100, 198, .2);
}
.form-input::-webkit-input-placeholder {
color: #acb3c2;
@@ -802,14 +833,14 @@ abbr[title] {
color: #acb3c2;
}
.form-input.input-sm {
- font-size: 1.2rem;
- height: 2.4rem;
- padding: .1rem .8rem;
+ font-size: .6rem;
+ height: 1.2rem;
+ padding: .05rem .4rem;
}
.form-input.input-lg {
- font-size: 1.6rem;
- height: 4rem;
- padding: .9rem .8rem;
+ font-size: .8rem;
+ height: 2rem;
+ padding: .45rem .4rem;
}
.form-input.input-inline {
display: inline-block;
@@ -824,7 +855,8 @@ textarea.form-input {
}
.form-input-hint {
color: #acb3c2;
- margin-top: .4rem;
+ font-size: .6rem;
+ margin-top: .2rem;
}
.has-success .form-input-hint,
.is-success + .form-input-hint {
@@ -838,73 +870,40 @@ textarea.form-input {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
- border: .1rem solid #c4c9d3;
- border-radius: .2rem;
+ border: .05rem solid #caced7;
+ border-radius: .1rem;
color: inherit;
- font-size: 1.4rem;
- line-height: 2rem;
+ font-size: .7rem;
+ line-height: 1rem;
outline: none;
- padding: .5rem .8rem;
+ padding: .25rem .4rem;
vertical-align: middle;
width: 100%;
}
.form-select[multiple] option {
- padding: .2rem .4rem;
+ padding: .1rem .2rem;
}
.form-select:not([multiple]) {
- background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23667189' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .75rem center / .8rem 1rem;
- height: 3.2rem;
- padding-right: 2.4rem;
+ background: #fff url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23667189' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") no-repeat right .35rem center / .4rem .5rem;
+ height: 1.6rem;
+ padding-right: 1.1rem;
}
.form-select:focus {
border-color: #5764c6;
- box-shadow: 0 0 0 .2rem rgba(87, 100, 198, .15);
+ box-shadow: 0 0 0 .1rem rgba(87, 100, 198, .2);
}
.form-select::-ms-expand {
display: none;
}
.form-select.select-sm {
- font-size: 1.2rem;
- height: 2.4rem;
- padding: .1rem 2rem .1rem .6rem;
+ font-size: .6rem;
+ height: 1.2rem;
+ padding: .05rem 1.1rem .05rem .4rem;
}
.form-select.select-lg {
- font-size: 1.6rem;
- height: 4rem;
- padding: .9rem 2.4rem .9rem .8rem;
-}
-.has-success .form-input,
-.has-success .form-select,
-.form-input.is-success,
-.form-select.is-success {
- border-color: #32b643;
-}
-.has-success .form-input:focus,
-.has-success .form-select:focus,
-.form-input.is-success:focus,
-.form-select.is-success:focus {
- box-shadow: 0 0 0 .2rem rgba(50, 182, 67, .15);
-}
-.has-error .form-input,
-.has-error .form-select,
-.form-input.is-error,
-.form-select.is-error {
- border-color: #e85600;
-}
-.has-error .form-input:focus,
-.has-error .form-select:focus,
-.form-input.is-error:focus,
-.form-select.is-error:focus {
- box-shadow: 0 0 0 .2rem rgba(232, 86, 0, .15);
-}
-.form-input:not(:placeholder-shown):invalid {
- border-color: #e85600;
-}
-.form-input:not(:placeholder-shown):invalid:focus {
- box-shadow: 0 0 0 .2rem rgba(232, 86, 0, .15);
-}
-.form-input:not(:placeholder-shown):invalid + .form-input-hint {
- color: #e85600;
+ font-size: .8rem;
+ height: 2rem;
+ padding: .45rem 1.1rem .45rem .4rem;
}
.has-icon-left,
.has-icon-right {
@@ -912,48 +911,50 @@ textarea.form-input {
}
.has-icon-left .form-icon,
.has-icon-right .form-icon {
- margin: 0 .8rem;
- min-width: 1.4rem;
+ height: .7rem;
+ margin: 0 .25rem;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
+ width: .7rem;
}
.has-icon-left .form-icon {
- left: 0;
+ left: .05rem;
}
.has-icon-left .form-input {
- padding-left: 3rem;
+ padding-left: 1.2rem;
}
.has-icon-right .form-icon {
- right: 0;
+ right: .05rem;
}
.has-icon-right .form-input {
- padding-right: 3rem;
+ padding-right: 1.2rem;
}
.form-checkbox,
.form-radio,
.form-switch {
display: inline-block;
- line-height: 2rem;
+ line-height: 1rem;
+ padding: .1rem 1.1rem;
position: relative;
}
.form-checkbox input,
.form-radio input,
.form-switch input {
clip: rect(0, 0, 0, 0);
- height: .1rem;
- margin: -.1rem;
+ height: 1px;
+ margin: -1px;
overflow: hidden;
position: absolute;
- width: .1rem;
+ width: 1px;
}
.form-checkbox input:focus + .form-icon,
.form-radio input:focus + .form-icon,
.form-switch input:focus + .form-icon {
border-color: #5764c6;
- box-shadow: 0 0 0 .2rem rgba(87, 100, 198, .15);
+ box-shadow: 0 0 0 .1rem rgba(87, 100, 198, .2);
}
.form-checkbox input:checked + .form-icon,
.form-radio input:checked + .form-icon,
@@ -964,47 +965,43 @@ textarea.form-input {
.form-checkbox .form-icon,
.form-radio .form-icon,
.form-switch .form-icon {
- border: .1rem solid #c4c9d3;
+ border: .05rem solid #caced7;
cursor: pointer;
display: inline-block;
position: absolute;
transition: all .2s ease;
}
-.form-checkbox,
-.form-radio {
- padding: .2rem 2rem;
-}
.form-checkbox .form-icon,
.form-radio .form-icon {
background: #fff;
- height: 1.4rem;
+ height: .7rem;
left: 0;
- top: .5rem;
- width: 1.4rem;
+ top: .25rem;
+ width: .7rem;
}
.form-checkbox input:active + .form-icon,
.form-radio input:active + .form-icon {
background: #f0f1f4;
}
.form-checkbox .form-icon {
- border-radius: .2rem;
+ border-radius: .1rem;
}
.form-checkbox input:checked + .form-icon::before {
background-clip: padding-box;
- border: .2rem solid #fff;
+ border: .1rem solid #fff;
border-left-width: 0;
border-top-width: 0;
content: "";
- height: 1rem;
+ height: 10px;
left: 50%;
- margin-left: -.3rem;
- margin-top: -.6rem;
+ margin-left: -3px;
+ margin-top: -6px;
position: absolute;
top: 50%;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
- width: .6rem;
+ width: 6px;
}
.form-checkbox input:indeterminate + .form-icon {
background: #5764c6;
@@ -1013,55 +1010,55 @@ textarea.form-input {
.form-checkbox input:indeterminate + .form-icon::before {
background: #fff;
content: "";
- height: .2rem;
+ height: 2px;
left: 50%;
- margin-left: -.5rem;
- margin-top: -.1rem;
+ margin-left: -5px;
+ margin-top: -1px;
position: absolute;
top: 50%;
- width: 1rem;
+ width: 10px;
}
.form-radio .form-icon {
- border-radius: .7rem;
+ border-radius: .35rem;
}
.form-radio input:checked + .form-icon::before {
background: #fff;
- border-radius: .2rem;
+ border-radius: .1rem;
content: "";
- height: .4rem;
+ height: 4px;
left: 50%;
- margin-left: -.2rem;
- margin-top: -.2rem;
+ margin-left: -2px;
+ margin-top: -2px;
position: absolute;
top: 50%;
- width: .4rem;
+ width: 4px;
}
.form-switch {
- padding: .2rem 2rem .2rem 3.6rem;
+ padding-left: 2rem;
}
.form-switch .form-icon {
background: #e7e9ed;
background-clip: padding-box;
- border-radius: .9rem;
- height: 1.8rem;
+ border-radius: .45rem;
+ height: .9rem;
left: 0;
- top: .3rem;
- width: 3rem;
+ top: .15rem;
+ width: 1.6rem;
}
.form-switch .form-icon::before {
background: #fff;
- border-radius: .8rem;
+ border-radius: .4rem;
content: "";
display: block;
- height: 1.6rem;
+ height: .8rem;
left: 0;
position: absolute;
top: 0;
transition: all .2s ease;
- width: 1.6rem;
+ width: .8rem;
}
.form-switch input:checked + .form-icon::before {
- left: 1.2rem;
+ left: 14px;
}
.form-switch input:active + .form-icon::before {
background: #f8f9fa;
@@ -1073,18 +1070,18 @@ textarea.form-input {
}
.input-group .input-group-addon {
background: #f8f9fa;
- border: .1rem solid #c4c9d3;
- border-radius: .2rem;
- line-height: 2rem;
- padding: .5rem .8rem;
+ border: .05rem solid #caced7;
+ border-radius: .1rem;
+ line-height: 1rem;
+ padding: .25rem .4rem;
}
.input-group .input-group-addon.addon-sm {
- font-size: 1.2rem;
- padding: .1rem .8rem;
+ font-size: .6rem;
+ padding: .05rem .4rem;
}
.input-group .input-group-addon.addon-lg {
- font-size: 1.6rem;
- padding: .9rem .8rem;
+ font-size: .8rem;
+ padding: .45rem .4rem;
}
.input-group .input-group-addon,
.input-group .input-group-btn {
@@ -1104,7 +1101,7 @@ textarea.form-input {
.input-group .input-group-addon:not(:first-child):not(:last-child),
.input-group .input-group-btn:not(:first-child):not(:last-child) {
border-radius: 0;
- margin-left: -.1rem;
+ margin-left: -.05rem;
}
.input-group .form-input:last-child:not(:first-child),
.input-group .form-select:last-child:not(:first-child),
@@ -1112,7 +1109,7 @@ textarea.form-input {
.input-group .input-group-btn:last-child:not(:first-child) {
border-bottom-left-radius: 0;
border-top-left-radius: 0;
- margin-left: -.1rem;
+ margin-left: -.05rem;
}
.input-group .form-input:focus,
.input-group .form-select:focus,
@@ -1128,6 +1125,65 @@ textarea.form-input {
display: -ms-inline-flexbox;
display: -webkit-inline-flex;
}
+.has-success .form-input,
+.has-success .form-select,
+.form-input.is-success,
+.form-select.is-success {
+ border-color: #32b643;
+}
+.has-success .form-input:focus,
+.has-success .form-select:focus,
+.form-input.is-success:focus,
+.form-select.is-success:focus {
+ box-shadow: 0 0 0 .1rem rgba(50, 182, 67, .2);
+}
+.has-error .form-input,
+.has-error .form-select,
+.form-input.is-error,
+.form-select.is-error {
+ border-color: #e85600;
+}
+.has-error .form-input:focus,
+.has-error .form-select:focus,
+.form-input.is-error:focus,
+.form-select.is-error:focus {
+ box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2);
+}
+.has-error .form-checkbox .form-icon,
+.has-error .form-radio .form-icon,
+.has-error .form-switch .form-icon,
+.form-checkbox.is-error .form-icon,
+.form-radio.is-error .form-icon,
+.form-switch.is-error .form-icon {
+ border-color: #e85600;
+}
+.has-error .form-checkbox input:checked + .form-icon,
+.has-error .form-radio input:checked + .form-icon,
+.has-error .form-switch input:checked + .form-icon,
+.form-checkbox.is-error input:checked + .form-icon,
+.form-radio.is-error input:checked + .form-icon,
+.form-switch.is-error input:checked + .form-icon {
+ background: #e85600;
+ border-color: #e85600;
+}
+.has-error .form-checkbox input:focus + .form-icon,
+.has-error .form-radio input:focus + .form-icon,
+.has-error .form-switch input:focus + .form-icon,
+.form-checkbox.is-error input:focus + .form-icon,
+.form-radio.is-error input:focus + .form-icon,
+.form-switch.is-error input:focus + .form-icon {
+ border-color: #e85600;
+ box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2);
+}
+.form-input:not(:placeholder-shown):invalid {
+ border-color: #e85600;
+}
+.form-input:not(:placeholder-shown):invalid:focus {
+ box-shadow: 0 0 0 .1rem rgba(232, 86, 0, .2);
+}
+.form-input:not(:placeholder-shown):invalid + .form-input-hint {
+ color: #e85600;
+}
.form-input:disabled,
.form-select:disabled,
.form-input.disabled,
@@ -1150,7 +1206,7 @@ input.disabled + .form-icon {
background: #fff;
}
.form-horizontal {
- padding: 1rem;
+ padding: .4rem;
}
.form-horizontal .form-group {
display: flex;
@@ -1160,15 +1216,15 @@ input.disabled + .form-icon {
.form-horizontal .form-checkbox,
.form-horizontal .form-radio,
.form-horizontal .form-switch {
- margin: .4rem 0;
+ margin: .2rem 0;
}
.label {
background: #f8f9fa;
- border-radius: .2rem;
- color: #5b657a;
+ border-radius: .1rem;
+ color: #50596c;
display: inline-block;
line-height: 1;
- padding: .3rem .4rem;
+ padding: .2em .3em;
vertical-align: baseline;
}
.label.label-primary {
@@ -1189,26 +1245,26 @@ input.disabled + .form-icon {
}
code {
background: #fdf4f4;
- border-radius: .2rem;
+ border-radius: .1rem;
color: #e06870;
display: inline-block;
line-height: 1;
- padding: .3rem .4rem;
+ padding: .2em .3em;
vertical-align: baseline;
}
.code {
- border-radius: .2rem;
- color: #50596c;
- line-height: 2rem;
+ border-radius: .1rem;
+ color: #454d5d;
+ line-height: 1rem;
position: relative;
}
.code::before {
color: #acb3c2;
content: attr(data-lang);
- font-size: 1.2rem;
+ font-size: .6rem;
position: absolute;
- right: 1rem;
- top: .2rem;
+ right: .4rem;
+ top: .1rem;
}
.code code {
background: #f8f9fa;
@@ -1216,7 +1272,7 @@ code {
display: block;
line-height: inherit;
overflow-x: auto;
- padding: 2rem;
+ padding: 1rem;
width: 100%;
}
.img-responsive {
@@ -1265,27 +1321,33 @@ code {
padding-bottom: 100%;
}
.figure {
- margin: 0 0 1rem 0;
+ margin: 0 0 .4rem 0;
}
.figure .figure-caption {
color: #727e96;
- margin-top: 1rem;
+ margin-top: .4rem;
}
.container {
margin-left: auto;
margin-right: auto;
- padding-left: 1rem;
- padding-right: 1rem;
+ padding-left: .4rem;
+ padding-right: .4rem;
width: 100%;
}
-.container.grid-1280 {
- max-width: 130rem;
+.container.grid-xl {
+ max-width: 1296px;
+}
+.container.grid-lg {
+ max-width: 976px;
+}
+.container.grid-md {
+ max-width: 856px;
}
-.container.grid-960 {
- max-width: 98rem;
+.container.grid-sm {
+ max-width: 616px;
}
-.container.grid-480 {
- max-width: 50rem;
+.container.grid-xs {
+ max-width: 496px;
}
.columns {
display: flex;
@@ -1294,8 +1356,8 @@ code {
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
- margin-left: -1rem;
- margin-right: -1rem;
+ margin-left: -.4rem;
+ margin-right: -.4rem;
}
.columns.col-gapless {
margin-left: 0;
@@ -1316,7 +1378,8 @@ code {
-ms-flex: 1;
flex: 1;
max-width: 100%;
- padding: 1rem;
+ padding-left: .4rem;
+ padding-right: .4rem;
}
.column.col-12,
.column.col-11,
@@ -1729,13 +1792,13 @@ code {
-ms-flex-align: center;
}
.navbar .navbar-brand {
- font-size: 1.6rem;
+ font-size: .8rem;
font-weight: 500;
text-decoration: none;
}
.panel {
- border: .1rem solid #f0f1f4;
- border-radius: .2rem;
+ border: .05rem solid #e7e9ed;
+ border-radius: .1rem;
display: flex;
display: -ms-flexbox;
display: -webkit-flex;
@@ -1748,7 +1811,7 @@ code {
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
- padding: 1.5rem;
+ padding: .8rem;
}
.panel .panel-nav {
-webkit-flex: 0 0 auto;
@@ -1760,30 +1823,51 @@ code {
-ms-flex: 1 1 auto;
flex: 1 1 auto;
overflow-y: auto;
- padding: 0 1.5rem;
-}
-.panel .panel-title {
- font-size: 2rem;
+ padding: 0 .8rem;
}
.panel .panel-subtitle {
- color: #bbc1cd;
+ color: #acb3c2;
}
.empty {
background: #f8f9fa;
- border-radius: .2rem;
+ border-radius: .1rem;
color: #727e96;
- padding: 4rem;
+ padding: 1.6rem;
text-align: center;
}
+.empty .empty-icon {
+ margin-bottom: .8rem;
+}
.empty .empty-title,
.empty .empty-subtitle {
- margin: 1rem auto;
+ margin: .4rem auto;
}
.empty .empty-subtitle {
- color: #bbc1cd;
+ color: #acb3c2;
}
.empty .empty-action {
- margin-top: 1.5rem;
+ margin-top: .8rem;
+}
+.accordion .accordion-item input:checked ~ .accordion-header .icon {
+ -webkit-transform: rotate(90deg);
+ -ms-transform: rotate(90deg);
+ transform: rotate(90deg);
+}
+.accordion .accordion-item input:checked ~ .accordion-body {
+ max-height: 1000px;
+}
+.accordion .accordion-item .accordion-header {
+ display: block;
+ padding: .2rem .4rem;
+}
+.accordion .accordion-item .accordion-header .icon {
+ transition: all .2s ease;
+}
+.accordion .accordion-item .accordion-body {
+ margin-bottom: .4rem;
+ max-height: 0;
+ overflow: hidden;
+ transition: max-height .2s ease;
}
.form-autocomplete {
position: relative;
@@ -1799,12 +1883,12 @@ code {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
height: auto;
- min-height: 3.2rem;
- padding: .1rem 0 0 .1rem;
+ min-height: 1.6rem;
+ padding: .05rem 0 0 .05rem;
}
.form-autocomplete .form-autocomplete-input.is-focused {
border-color: #5764c6;
- box-shadow: 0 0 0 .2rem rgba(87, 100, 198, .15);
+ box-shadow: 0 0 0 .1rem rgba(87, 100, 198, .2);
}
.form-autocomplete .form-autocomplete-input .form-input {
border-color: transparent;
@@ -1813,8 +1897,8 @@ code {
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
- height: 2.8rem;
- padding: .3rem .8rem;
+ height: 1.4rem;
+ line-height: .8rem;
width: auto;
}
.form-autocomplete mark {
@@ -1832,34 +1916,34 @@ code {
border-radius: 50%;
color: rgba(255, 255, 255, .85);
display: inline-block;
- font-size: 1.4rem;
+ font-size: .72727273rem;
font-weight: 300;
- height: 3.2rem;
+ height: 1.6rem;
line-height: 1;
margin: 0;
position: relative;
vertical-align: middle;
- width: 3.2rem;
+ width: 1.6rem;
}
.avatar.avatar-xs {
- font-size: .8rem;
- height: 1.6rem;
- width: 1.6rem;
+ font-size: .36363636rem;
+ height: .8rem;
+ width: .8rem;
}
.avatar.avatar-sm {
- font-size: 1rem;
- height: 2.4rem;
- width: 2.4rem;
+ font-size: .54545455rem;
+ height: 1.2rem;
+ width: 1.2rem;
}
.avatar.avatar-lg {
- font-size: 2rem;
- height: 4.8rem;
- width: 4.8rem;
+ font-size: 1.09090909rem;
+ height: 2.4rem;
+ width: 2.4rem;
}
.avatar.avatar-xl {
- font-size: 2.6rem;
- height: 6.4rem;
- width: 6.4rem;
+ font-size: 1.45454545rem;
+ height: 3.2rem;
+ width: 3.2rem;
}
.avatar img {
border-radius: 50%;
@@ -1872,7 +1956,7 @@ code {
background: #fff;
bottom: 14.64%;
height: 50%;
- padding: .2rem;
+ padding: .1rem;
position: absolute;
right: 14.64%;
-webkit-transform: translate(50%, 50%);
@@ -1899,30 +1983,30 @@ code {
.badge:not([data-badge])::after {
background: #5764c6;
background-clip: padding-box;
- border-radius: 1rem;
- box-shadow: 0 0 0 .2rem #fff;
+ border-radius: .5rem;
+ box-shadow: 0 0 0 .1rem #fff;
color: #fff;
content: attr(data-badge);
display: inline-block;
- -webkit-transform: translate(-.2rem, -1rem);
- -ms-transform: translate(-.2rem, -1rem);
- transform: translate(-.2rem, -1rem);
+ -webkit-transform: translate(-.1rem, -.5rem);
+ -ms-transform: translate(-.1rem, -.5rem);
+ transform: translate(-.1rem, -.5rem);
}
.badge[data-badge]::after {
- font-size: 1.2rem;
- height: 1.8rem;
+ font-size: .6rem;
+ height: 18px;
line-height: 1;
- min-width: 1.8rem;
- padding: .3rem .5rem;
+ min-width: 18px;
+ padding: 3px 5px;
text-align: center;
white-space: nowrap;
}
.badge:not([data-badge])::after,
.badge[data-badge=""]::after {
- height: .6rem;
- min-width: .6rem;
+ height: 6px;
+ min-width: 6px;
padding: 0;
- width: .6rem;
+ width: 6px;
}
.badge.btn::after {
position: absolute;
@@ -1943,25 +2027,25 @@ code {
}
.badge.avatar-xs::after {
content: "";
- height: .8rem;
- min-width: .8rem;
+ height: .4rem;
+ min-width: .4rem;
padding: 0;
- width: .8rem;
+ width: .4rem;
}
.bar {
background: #f0f1f4;
- border-radius: .2rem;
+ border-radius: .1rem;
display: flex;
display: -ms-flexbox;
display: -webkit-flex;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
- height: 1.6rem;
+ height: .8rem;
width: 100%;
}
.bar.bar-sm {
- height: .4rem;
+ height: .2rem;
}
.bar .bar-item {
background: #5764c6;
@@ -1970,28 +2054,27 @@ code {
-ms-flex-negative: 0;
-webkit-flex-shrink: 0;
flex-shrink: 0;
- font-size: 1.2rem;
+ font-size: .6rem;
height: 100%;
- line-height: 1;
- padding: .2rem 0;
+ line-height: .8rem;
position: relative;
text-align: center;
width: 0;
}
.bar .bar-item:first-child {
- border-bottom-left-radius: .2rem;
- border-top-left-radius: .2rem;
+ border-bottom-left-radius: .1rem;
+ border-top-left-radius: .1rem;
}
.bar .bar-item:last-child {
- border-bottom-right-radius: .2rem;
- border-top-right-radius: .2rem;
+ border-bottom-right-radius: .1rem;
+ border-top-right-radius: .1rem;
-ms-flex-negative: 1;
-webkit-flex-shrink: 1;
flex-shrink: 1;
}
.bar-slider {
- height: .2rem;
- margin: 1rem 0;
+ height: .1rem;
+ margin: .4rem 0;
position: relative;
}
.bar-slider .bar-item {
@@ -2007,7 +2090,7 @@ code {
background: #5764c6;
border: 0;
border-radius: 50%;
- height: 1.2rem;
+ height: .6rem;
padding: 0;
position: absolute;
right: 0;
@@ -2015,63 +2098,59 @@ code {
-webkit-transform: translate(50%, -50%);
-ms-transform: translate(50%, -50%);
transform: translate(50%, -50%);
- width: 1.2rem;
+ width: .6rem;
}
.bar-slider .bar-slider-btn:active {
- box-shadow: 0 0 0 .2rem #5764c6;
+ box-shadow: 0 0 0 .1rem #5764c6;
}
.card {
background: #fff;
- border: .1rem solid #f0f1f4;
- border-radius: .2rem;
+ border: .05rem solid #e7e9ed;
+ border-radius: .1rem;
display: block;
}
.card .card-header,
.card .card-body,
.card .card-footer {
- padding: 1.5rem;
+ padding: .8rem;
padding-bottom: 0;
}
.card .card-header:last-child,
.card .card-body:last-child,
.card .card-footer:last-child {
- padding-bottom: 1.5rem;
+ padding-bottom: .8rem;
}
.card .card-image {
- padding-top: 1.5rem;
+ padding-top: .8rem;
}
.card .card-image:first-child {
padding-top: 0;
}
.card .card-image:first-child img {
- border-top-left-radius: .2rem;
- border-top-right-radius: .2rem;
+ border-top-left-radius: .1rem;
+ border-top-right-radius: .1rem;
}
.card .card-image:last-child img {
- border-bottom-left-radius: .2rem;
- border-bottom-right-radius: .2rem;
-}
-.card .card-title {
- font-size: 2rem;
+ border-bottom-left-radius: .1rem;
+ border-bottom-right-radius: .1rem;
}
.card .card-subtitle {
- color: #bbc1cd;
- font-size: 1.2rem;
+ color: #acb3c2;
}
.chip {
-webkit-align-items: center;
align-items: center;
background: #f0f1f4;
- border-radius: .2rem;
+ border-radius: .1rem;
color: #727e96;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-inline-flex;
-ms-flex-align: center;
- height: 2.8rem;
- margin: 0 .1rem .1rem 0;
+ height: 1.4rem;
+ margin: 0 .05rem .05rem 0;
max-width: 100%;
- padding: .1rem .8rem;
+ padding: .05rem .4rem;
text-decoration: none;
vertical-align: middle;
}
@@ -2080,18 +2159,20 @@ code {
color: #fff;
}
.chip .avatar {
- margin-left: -.4rem;
- margin-right: .4rem;
+ margin-left: -.2rem;
+ margin-right: .2rem;
}
.dropdown {
display: inline-block;
position: relative;
}
.dropdown .menu {
- -webkit-animation: slide-down .2s ease 1;
- animation: slide-down .2s ease 1;
+ -webkit-animation: slide-down .15s ease 1;
+ animation: slide-down .15s ease 1;
display: none;
left: 0;
+ max-height: 50vh;
+ overflow-y: auto;
position: absolute;
top: 100%;
}
@@ -2105,25 +2186,29 @@ code {
display: block;
}
.dropdown .btn-group .dropdown-toggle:nth-last-child(2) {
- border-bottom-right-radius: .2rem;
- border-top-right-radius: .2rem;
+ border-bottom-right-radius: .1rem;
+ border-top-right-radius: .1rem;
}
.menu {
background: #fff;
- border-radius: .2rem;
- box-shadow: 0 .1rem .4rem rgba(69, 77, 93, .3);
+ border-radius: .1rem;
+ box-shadow: 0 .05rem .2rem rgba(69, 77, 93, .3);
list-style: none;
margin: 0;
- min-width: 18rem;
- padding: 1rem;
- -webkit-transform: translateY(.5rem);
- -ms-transform: translateY(.5rem);
- transform: translateY(.5rem);
+ min-width: 180px;
+ padding: .4rem;
+ -webkit-transform: translateY(.2rem);
+ -ms-transform: translateY(.2rem);
+ transform: translateY(.2rem);
z-index: 100;
}
+.menu.menu-nav {
+ background: transparent;
+ box-shadow: none;
+}
.menu .menu-item {
margin-top: 0;
- padding: 0 .8rem;
+ padding: 0 .4rem;
text-decoration: none;
-webkit-user-select: none;
-moz-user-select: none;
@@ -2131,28 +2216,32 @@ code {
user-select: none;
}
.menu .menu-item > a {
- border-radius: .2rem;
+ border-radius: .1rem;
color: inherit;
display: block;
- margin: 0 -.8rem;
- padding: .6rem .8rem;
+ margin: 0 -.4rem;
+ padding: .2rem .4rem;
text-decoration: none;
}
.menu .menu-item > a:focus,
.menu .menu-item > a:hover {
+ background: #eff1fa;
color: #5764c6;
}
.menu .menu-item > a:active,
.menu .menu-item > a.active {
- background: #fbfbfe;
+ background: #eff1fa;
color: #5764c6;
}
+.menu .menu-item + .menu-item {
+ margin-top: .2rem;
+}
.menu .menu-badge {
float: right;
- padding: .6rem 0;
+ padding: .2rem 0;
}
.menu .menu-badge .btn {
- margin-top: -.2rem;
+ margin-top: -.1rem;
}
.modal {
-webkit-align-items: center;
@@ -2166,7 +2255,7 @@ code {
left: 0;
opacity: 0;
overflow: hidden;
- padding: 1rem;
+ padding: .4rem;
position: fixed;
right: 0;
top: 0;
@@ -2181,7 +2270,7 @@ code {
}
.modal:target .modal-overlay,
.modal.active .modal-overlay {
- background: rgba(69, 77, 93, .5);
+ background: rgba(248, 249, 250, .75);
bottom: 0;
cursor: default;
display: block;
@@ -2194,35 +2283,34 @@ code {
.modal.active .modal-container {
-webkit-animation: slide-down .2s ease 1;
animation: slide-down .2s ease 1;
- max-width: 64rem;
+ max-width: 640px;
z-index: 1;
}
.modal.modal-sm .modal-container {
- max-width: 32rem;
+ max-width: 320px;
}
.modal-container {
background: #fff;
- border-radius: .2rem;
- box-shadow: 0 .4rem 1rem rgba(69, 77, 93, .3);
+ border-radius: .1rem;
+ box-shadow: 0 .2rem .5rem rgba(69, 77, 93, .3);
display: block;
padding: 0;
text-align: left;
}
.modal-container .modal-header {
- padding: 1.5rem;
+ padding: .8rem;
}
.modal-container .modal-header .modal-title {
- font-size: 1.6rem;
margin: 0;
}
.modal-container .modal-body {
max-height: 50vh;
overflow-y: auto;
- padding: 1.5rem;
+ padding: .8rem;
position: relative;
}
.modal-container .modal-footer {
- padding: 1.5rem;
+ padding: .8rem;
text-align: right;
}
.breadcrumb,
@@ -2230,22 +2318,27 @@ code {
.pagination,
.nav {
list-style: none;
- margin: .5rem 0;
+ margin: .2rem 0;
}
.breadcrumb {
- padding: 1.2rem;
+ padding: .2rem 0;
}
.breadcrumb .breadcrumb-item {
+ color: #727e96;
display: inline-block;
margin: 0;
+ padding: .2rem 0;
}
-.breadcrumb .breadcrumb-item:last-child {
- color: #acb3c2;
+.breadcrumb .breadcrumb-item:not(:last-child) {
+ margin-right: .2rem;
+}
+.breadcrumb .breadcrumb-item:not(:last-child) a {
+ color: #727e96;
}
.breadcrumb .breadcrumb-item:not(:first-child)::before {
color: #e7e9ed;
content: "/";
- padding: 0 .4rem;
+ padding-right: .2rem;
}
.tab {
-webkit-align-items: center;
@@ -2268,11 +2361,11 @@ code {
text-align: right;
}
.tab .tab-item a {
- border-bottom: .2rem solid transparent;
+ border-bottom: .1rem solid transparent;
color: inherit;
display: block;
margin-top: 0;
- padding: .6rem 1.2rem .4rem 1.2rem;
+ padding: 6px 12px 4px 12px;
text-decoration: none;
}
.tab .tab-item a:focus,
@@ -2292,40 +2385,40 @@ code {
}
.tab.tab-block .tab-item .badge[data-badge]::after {
position: absolute;
- right: -.4rem;
- top: -.4rem;
+ right: -4px;
+ top: -4px;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.tab:not(.tab-block) .badge {
- padding-right: .2rem;
+ padding-right: 2px;
}
.pagination {
display: flex;
display: -ms-flexbox;
display: -webkit-flex;
+ padding: .2rem 0;
}
.pagination .page-item {
- margin: 1rem .1rem;
+ margin: .2rem .05rem;
}
.pagination .page-item span {
display: inline-block;
- padding: .6rem .4rem;
+ padding: .2rem .2rem;
}
.pagination .page-item a {
- border-radius: .2rem;
+ border-radius: .1rem;
color: #727e96;
display: inline-block;
- padding: .6rem .8rem;
+ padding: .2rem .4rem;
text-decoration: none;
}
.pagination .page-item a:focus,
.pagination .page-item a:hover {
color: #5764c6;
}
-.pagination .page-item a[disabled],
-.pagination .page-item a.disabled {
+.pagination .page-item.disabled a {
cursor: default;
opacity: .5;
pointer-events: none;
@@ -2360,7 +2453,7 @@ code {
}
.nav .nav-item a {
color: #727e96;
- padding: .6rem .8rem;
+ padding: .2rem .4rem;
text-decoration: none;
}
.nav .nav-item a:focus,
@@ -2368,6 +2461,7 @@ code {
color: #5764c6;
}
.nav .nav-item.active > a {
+ color: #5b657a;
font-weight: bold;
}
.nav .nav-item.active > a:focus,
@@ -2375,11 +2469,8 @@ code {
color: #5764c6;
}
.nav .nav {
- margin-bottom: 1rem;
- margin-left: 2rem;
-}
-.nav .nav a {
- color: #acb3c2;
+ margin-bottom: .4rem;
+ margin-left: .8rem;
}
.popover {
display: inline-block;
@@ -2389,7 +2480,7 @@ code {
content: attr(data-tooltip);
left: 50%;
opacity: 0;
- padding: 1rem;
+ padding: .4rem;
position: absolute;
top: 0;
-webkit-transform: translate(-50%, -50%) scale(0);
@@ -2398,7 +2489,7 @@ code {
transition: transform .2s ease, -webkit-transform .2s ease;
transition: transform .2s ease;
transition: -webkit-transform .2s ease;
- width: 32rem;
+ width: 320px;
z-index: 400;
}
.popover :focus + .popover-container,
@@ -2445,7 +2536,7 @@ code {
}
.popover .card {
border: 0;
- box-shadow: 0 .4rem 1rem rgba(69, 77, 93, .3);
+ box-shadow: 0 .2rem .5rem rgba(69, 77, 93, .3);
}
.step {
display: flex;
@@ -2455,7 +2546,7 @@ code {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
list-style: none;
- margin: .5rem 0;
+ margin: .2rem 0;
width: 100%;
}
.step .step-item {
@@ -2463,47 +2554,47 @@ code {
-ms-flex: 1 1 0;
flex: 1 1 0;
margin-top: 0;
- min-height: 2rem;
+ min-height: 20px;
position: relative;
text-align: center;
}
.step .step-item:not(:first-child)::before {
background: #5764c6;
content: "";
- height: .2rem;
+ height: 2px;
left: -50%;
position: absolute;
- top: .9rem;
+ top: 9px;
width: 100%;
}
.step .step-item a {
color: #acb3c2;
display: inline-block;
- padding: 2rem 1rem 0;
+ padding: 20px 10px 0;
text-decoration: none;
}
.step .step-item a::before {
background: #5764c6;
- border: .2rem solid #fff;
+ border: .1rem solid #fff;
border-radius: 50%;
content: "";
display: block;
- height: 1.2rem;
+ height: .6rem;
left: 50%;
position: absolute;
- top: .4rem;
+ top: .2rem;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
- width: 1.2rem;
+ width: .6rem;
z-index: 1;
}
.step .step-item.active a::before {
background: #fff;
- border: .2rem solid #5764c6;
+ border: .1rem solid #5764c6;
}
.step .step-item.active ~ .step-item::before {
- background: #f0f1f4;
+ background: #e7e9ed;
}
.step .step-item.active ~ .step-item a::before {
background: #e7e9ed;
@@ -2531,17 +2622,17 @@ code {
flex: 1 1 auto;
}
.tile .tile-content:not(:first-child) {
- padding-left: 1rem;
+ padding-left: .4rem;
}
.tile .tile-content:not(:last-child) {
- padding-right: 1rem;
+ padding-right: .4rem;
}
.tile .tile-title {
- line-height: 2rem;
+ line-height: 1rem;
}
.tile .tile-subtitle {
- color: #bbc1cd;
- line-height: 2rem;
+ color: #acb3c2;
+ line-height: 1rem;
}
.tile.tile-centered {
-webkit-align-items: center;
@@ -2560,12 +2651,12 @@ code {
}
.toast {
background: rgba(69, 77, 93, .9);
- border: .1rem solid #454d5d;
+ border: .05rem solid #454d5d;
border-color: #454d5d;
- border-radius: .2rem;
+ border-radius: .1rem;
color: #fff;
display: block;
- padding: 1rem;
+ padding: .4rem;
width: 100%;
}
.toast.toast-primary {
@@ -2594,38 +2685,41 @@ code {
.toast a.active {
opacity: .75;
}
+.toast .btn-clear {
+ margin: 2px -2px 2px 4px;
+}
.tooltip {
position: relative;
}
.tooltip::after {
background: rgba(69, 77, 93, .9);
- border-radius: .2rem;
+ border-radius: .1rem;
bottom: 100%;
color: #fff;
content: attr(data-tooltip);
display: block;
- font-size: 1.2rem;
+ font-size: .6rem;
left: 50%;
- max-width: 32rem;
+ max-width: 320px;
opacity: 0;
overflow: hidden;
- padding: .4rem .8rem;
+ padding: .2rem .4rem;
pointer-events: none;
position: absolute;
text-overflow: ellipsis;
- -webkit-transform: translate(-50%, 1rem);
- -ms-transform: translate(-50%, 1rem);
- transform: translate(-50%, 1rem);
+ -webkit-transform: translate(-50%, .4rem);
+ -ms-transform: translate(-50%, .4rem);
+ transform: translate(-50%, .4rem);
transition: all .2s ease;
white-space: nowrap;
- z-index: 200;
+ z-index: 300;
}
.tooltip:focus::after,
.tooltip:hover::after {
opacity: 1;
- -webkit-transform: translate(-50%, -.5rem);
- -ms-transform: translate(-50%, -.5rem);
- transform: translate(-50%, -.5rem);
+ -webkit-transform: translate(-50%, -.2rem);
+ -ms-transform: translate(-50%, -.2rem);
+ transform: translate(-50%, -.2rem);
}
.tooltip[disabled],
.tooltip.disabled {
@@ -2634,42 +2728,42 @@ code {
.tooltip.tooltip-right::after {
bottom: 50%;
left: 100%;
- -webkit-transform: translate(-1rem, 50%);
- -ms-transform: translate(-1rem, 50%);
- transform: translate(-1rem, 50%);
+ -webkit-transform: translate(-.2rem, 50%);
+ -ms-transform: translate(-.2rem, 50%);
+ transform: translate(-.2rem, 50%);
}
.tooltip.tooltip-right:focus::after,
.tooltip.tooltip-right:hover::after {
- -webkit-transform: translate(.5rem, 50%);
- -ms-transform: translate(.5rem, 50%);
- transform: translate(.5rem, 50%);
+ -webkit-transform: translate(.2rem, 50%);
+ -ms-transform: translate(.2rem, 50%);
+ transform: translate(.2rem, 50%);
}
.tooltip.tooltip-bottom::after {
bottom: auto;
top: 100%;
- -webkit-transform: translate(-50%, -1rem);
- -ms-transform: translate(-50%, -1rem);
- transform: translate(-50%, -1rem);
+ -webkit-transform: translate(-50%, -.4rem);
+ -ms-transform: translate(-50%, -.4rem);
+ transform: translate(-50%, -.4rem);
}
.tooltip.tooltip-bottom:focus::after,
.tooltip.tooltip-bottom:hover::after {
- -webkit-transform: translate(-50%, .5rem);
- -ms-transform: translate(-50%, .5rem);
- transform: translate(-50%, .5rem);
+ -webkit-transform: translate(-50%, .2rem);
+ -ms-transform: translate(-50%, .2rem);
+ transform: translate(-50%, .2rem);
}
.tooltip.tooltip-left::after {
bottom: 50%;
left: auto;
right: 100%;
- -webkit-transform: translate(1rem, 50%);
- -ms-transform: translate(1rem, 50%);
- transform: translate(1rem, 50%);
+ -webkit-transform: translate(.4rem, 50%);
+ -ms-transform: translate(.4rem, 50%);
+ transform: translate(.4rem, 50%);
}
.tooltip.tooltip-left:focus::after,
.tooltip.tooltip-left:hover::after {
- -webkit-transform: translate(-.5rem, 50%);
- -ms-transform: translate(-.5rem, 50%);
- transform: translate(-.5rem, 50%);
+ -webkit-transform: translate(-.2rem, 50%);
+ -ms-transform: translate(-.2rem, 50%);
+ transform: translate(-.2rem, 50%);
}
@-webkit-keyframes loading {
0% {
@@ -2694,8 +2788,8 @@ code {
@-webkit-keyframes slide-down {
0% {
opacity: 0;
- -webkit-transform: translateY(-3rem);
- transform: translateY(-3rem);
+ -webkit-transform: translateY(-1.6rem);
+ transform: translateY(-1.6rem);
}
100% {
opacity: 1;
@@ -2706,8 +2800,8 @@ code {
@keyframes slide-down {
0% {
opacity: 0;
- -webkit-transform: translateY(-3rem);
- transform: translateY(-3rem);
+ -webkit-transform: translateY(-1.6rem);
+ transform: translateY(-1.6rem);
}
100% {
opacity: 1;
@@ -2715,6 +2809,125 @@ code {
transform: translateY(0);
}
}
+.text-primary {
+ color: #5764c6;
+}
+a.text-primary:focus,
+a.text-primary:hover {
+ color: #4452c0;
+}
+.text-secondary {
+ color: #e4e6f6;
+}
+a.text-secondary:focus,
+a.text-secondary:hover {
+ color: #d1d4ef;
+}
+.text-gray {
+ color: #acb3c2;
+}
+a.text-gray:focus,
+a.text-gray:hover {
+ color: #9ea6b7;
+}
+.text-light {
+ color: #fff;
+}
+a.text-light:focus,
+a.text-light:hover {
+ color: #f2f2f2;
+}
+.text-success {
+ color: #32b643;
+}
+a.text-success:focus,
+a.text-success:hover {
+ color: #2da23c;
+}
+.text-warning {
+ color: #ffb700;
+}
+a.text-warning:focus,
+a.text-warning:hover {
+ color: #e6a500;
+}
+.text-error {
+ color: #e85600;
+}
+a.text-error:focus,
+a.text-error:hover {
+ color: #cf4d00;
+}
+.bg-primary {
+ background: #5764c6;
+}
+.bg-secondary {
+ background: #eff1fa;
+}
+.bg-dark {
+ background: #454d5d;
+}
+.bg-gray {
+ background: #f8f9fa;
+}
+.bg-success {
+ background: #32b643;
+}
+.bg-warning {
+ background: #ffb700;
+}
+.bg-error {
+ background: #e85600;
+}
+.block {
+ display: block;
+}
+.inline {
+ display: inline;
+}
+.inline-block {
+ display: inline-block;
+}
+.flex {
+ display: flex;
+ display: -ms-flexbox;
+ display: -webkit-flex;
+}
+.inline-flex {
+ display: inline-flex;
+ display: -ms-inline-flexbox;
+ display: -webkit-inline-flex;
+}
+.hide {
+ display: none !important;
+}
+.visible {
+ visibility: visible;
+}
+.invisible {
+ visibility: hidden;
+}
+.text-hide {
+ background: transparent;
+ border: 0;
+ color: transparent;
+ font-size: 0;
+ line-height: 0;
+ text-shadow: none;
+}
+.text-assistive {
+ border: 0;
+ clip: rect(0, 0, 0, 0);
+ height: 1px;
+ margin: -1px;
+ overflow: hidden;
+ padding: 0;
+ position: absolute;
+ width: 1px;
+}
+.hand {
+ cursor: pointer;
+}
.divider,
.divider-vert {
display: block;
@@ -2723,39 +2936,42 @@ code {
.divider[data-content]::after,
.divider-vert[data-content]::after {
background: #fff;
- color: #e7e9ed;
+ color: #acb3c2;
content: attr(data-content);
display: inline-block;
- font-size: 1.2rem;
- padding: 0 .8rem;
- -webkit-transform: translateY(-1.1rem);
- -ms-transform: translateY(-1.1rem);
- transform: translateY(-1.1rem);
+ font-size: .6rem;
+ padding: 0 .4rem;
+ -webkit-transform: translateY(-.55rem);
+ -ms-transform: translateY(-.55rem);
+ transform: translateY(-.55rem);
}
.divider {
- border-top: .1rem solid #f0f1f4;
- height: .1rem;
- margin: 1rem 0;
+ border-top: .05rem solid #e7e9ed;
+ height: .05rem;
+ margin: .4rem 0;
+}
+.divider[data-content] {
+ margin: .8rem 0;
}
.divider-vert {
display: block;
- padding: 1rem;
+ padding: .8rem;
}
.divider-vert::before {
- border-left: .1rem solid #f0f1f4;
- bottom: 1rem;
+ border-left: .05rem solid #e7e9ed;
+ bottom: .4rem;
content: "";
display: block;
left: 50%;
position: absolute;
- top: 1rem;
+ top: .4rem;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.divider-vert[data-content]::after {
left: 50%;
- padding: .4rem 0;
+ padding: .2rem 0;
position: absolute;
top: 50%;
-webkit-transform: translate(-50%, -50%);
@@ -2764,28 +2980,37 @@ code {
}
.loading {
color: transparent !important;
- min-height: 1.6rem;
+ min-height: .8rem;
pointer-events: none;
position: relative;
}
.loading::after {
-webkit-animation: loading 500ms infinite linear;
animation: loading 500ms infinite linear;
- border: .2rem solid #5764c6;
- border-radius: .8rem;
+ border: .1rem solid #5764c6;
+ border-radius: 50%;
border-right-color: transparent;
border-top-color: transparent;
content: "";
display: block;
- height: 1.6rem;
+ height: .8rem;
left: 50%;
- margin-left: -.8rem;
- margin-top: -.8rem;
+ margin-left: -.4rem;
+ margin-top: -.4rem;
position: absolute;
top: 50%;
- width: 1.6rem;
+ width: .8rem;
z-index: 1;
}
+.loading.loading-lg {
+ min-height: 2rem;
+}
+.loading.loading-lg::after {
+ height: 1.6rem;
+ margin-left: -.8rem;
+ margin-top: -.8rem;
+ width: 1.6rem;
+}
.clearfix::after,
.container::after {
clear: both;
@@ -2798,10 +3023,10 @@ code {
.float-right {
float: right !important;
}
-.rel {
+.relative {
position: relative;
}
-.abs {
+.absolute {
position: absolute;
}
.fixed {
@@ -2813,99 +3038,103 @@ code {
margin-left: auto;
margin-right: auto;
}
-.mt-10 {
- margin-top: 1rem;
+.m-1 {
+ padding: .2rem;
}
-.mr-10 {
- margin-right: 1rem;
+.mb-1 {
+ padding-bottom: .2rem;
}
-.mb-10 {
- margin-bottom: 1rem;
+.ml-1 {
+ padding-left: .2rem;
}
-.ml-10 {
- margin-left: 1rem;
+.mr-1 {
+ padding-right: .2rem;
}
-.mt-5 {
- margin-top: .5rem;
+.mt-1 {
+ padding-top: .2rem;
}
-.mr-5 {
- margin-right: .5rem;
+.mx-1 {
+ padding-left: .2rem;
+ padding-right: .2rem;
}
-.mb-5 {
- margin-bottom: .5rem;
+.my-1 {
+ padding-bottom: .2rem;
+ padding-top: .2rem;
}
-.ml-5 {
- margin-left: .5rem;
+.m-2 {
+ padding: .4rem;
}
-.pt-10 {
- padding-top: 1rem;
+.mb-2 {
+ padding-bottom: .4rem;
}
-.pr-10 {
- padding-right: 1rem;
+.ml-2 {
+ padding-left: .4rem;
}
-.pb-10 {
- padding-bottom: 1rem;
+.mr-2 {
+ padding-right: .4rem;
}
-.pl-10 {
- padding-left: 1rem;
+.mt-2 {
+ padding-top: .4rem;
}
-.pt-5 {
- padding-top: .5rem;
+.mx-2 {
+ padding-left: .4rem;
+ padding-right: .4rem;
}
-.pr-5 {
- padding-right: .5rem;
+.my-2 {
+ padding-bottom: .4rem;
+ padding-top: .4rem;
}
-.pb-5 {
- padding-bottom: .5rem;
+.p-1 {
+ padding: .2rem;
}
-.pl-5 {
- padding-left: .5rem;
+.pb-1 {
+ padding-bottom: .2rem;
}
-.block {
- display: block;
+.pl-1 {
+ padding-left: .2rem;
}
-.inline {
- display: inline;
+.pr-1 {
+ padding-right: .2rem;
}
-.inline-block {
- display: inline-block;
+.pt-1 {
+ padding-top: .2rem;
}
-.flex {
- display: flex;
- display: -ms-flexbox;
- display: -webkit-flex;
+.px-1 {
+ padding-left: .2rem;
+ padding-right: .2rem;
}
-.inline-flex {
- display: inline-flex;
- display: -ms-inline-flexbox;
- display: -webkit-inline-flex;
+.py-1 {
+ padding-bottom: .2rem;
+ padding-top: .2rem;
}
-.hide {
- display: none !important;
+.p-2 {
+ padding: .4rem;
}
-.visible {
- visibility: visible;
+.pb-2 {
+ padding-bottom: .4rem;
}
-.invisible {
- visibility: hidden;
+.pl-2 {
+ padding-left: .4rem;
}
-.text-hide {
- background: transparent;
- border: 0;
- color: transparent;
- font-size: 0;
- line-height: 0;
- text-shadow: none;
+.pr-2 {
+ padding-right: .4rem;
}
-.text-assistive {
- border: 0;
- clip: rect(0, 0, 0, 0);
- height: .1rem;
- margin: -.1rem;
- overflow: hidden;
- padding: 0;
- position: absolute;
- width: .1rem;
+.pt-2 {
+ padding-top: .4rem;
+}
+.px-2 {
+ padding-left: .4rem;
+ padding-right: .4rem;
+}
+.py-2 {
+ padding-bottom: .4rem;
+ padding-top: .4rem;
+}
+.rounded {
+ border-radius: .1rem;
+}
+.circle {
+ border-radius: 50%;
}
.text-left {
text-align: left;
@@ -2956,28 +3185,4 @@ code {
hyphens: auto;
word-break: break-word;
word-wrap: break-word;
-}
-.hand {
- cursor: pointer;
-}
-.shadow-0 {
- box-shadow: 0 0 .2rem rgba(69, 77, 93, .3);
-}
-.shadow-1 {
- box-shadow: 0 .1rem .4rem rgba(69, 77, 93, .3);
-}
-.shadow-2 {
- box-shadow: 0 .2rem .6rem rgba(69, 77, 93, .3);
-}
-.shadow-3 {
- box-shadow: 0 .3rem .8rem rgba(69, 77, 93, .3);
-}
-.shadow-4 {
- box-shadow: 0 .4rem 1rem rgba(69, 77, 93, .3);
-}
-.rounded {
- border-radius: .2rem;
-}
-.circle {
- border-radius: 50%;
} \ No newline at end of file
generated by cgit v1.3.1-23-gd82d (git 2.54.0) at 2026-11-12 18:31:55 +0000