mirror of
https://github.com/Steffo99/bluelib.git
synced 2024-12-22 11:34:21 +00:00
✨ Style <select>, <option> and <optgroup>
This commit is contained in:
parent
64c1fc606d
commit
8233955dca
GPG key ID:
6965406171929D01
12 changed files with 843 additions and 1196 deletions
12
index.html
12
index.html
|
|
@ -2,7 +2,6 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<link rel="stylesheet" href="src/targets/paper.root.css">
|
||||
<link rel="stylesheet" href="src/targets/royalblue.root.css">
|
||||
<title>Bluelib 2</title>
|
||||
<style>
|
||||
|
|
@ -418,6 +417,17 @@
|
|||
<option>D.3</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<label for="input-multiple">Multiple</label>
|
||||
<select id="input-multiple" multiple>
|
||||
<option>A</option>
|
||||
<option>B</option>
|
||||
<option>C</option>
|
||||
<optgroup label="D">
|
||||
<option>D.1</option>
|
||||
<option>D.2</option>
|
||||
<option>D.3</option>
|
||||
</optgroup>
|
||||
</select>
|
||||
<div class="form-buttons">
|
||||
<input id="input-submit" type="submit" value="Submit"/>
|
||||
</div>
|
||||
|
|
|
|||
81
src/rules/skeleton.less
vendored
81
src/rules/skeleton.less
vendored
|
|
@ -283,30 +283,28 @@
|
|||
|
||||
// --- Inputs ---
|
||||
|
||||
@{input-field} {
|
||||
cursor: text;
|
||||
|
||||
border-width: 0 0 2px 0;
|
||||
@{input} {
|
||||
border-style: solid;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
|
||||
border-color: @b3;
|
||||
color: @bA;
|
||||
background-color: @b0;
|
||||
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
|
||||
&::placeholder {
|
||||
color: @b4;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
&:optional::placeholder {
|
||||
&:optional, &:optional::placeholder {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
// &:valid:not(:placeholder-shown) {
|
||||
// .bluelib-color(@hex-lime);
|
||||
// }
|
||||
|
||||
&:invalid:not(:placeholder-shown) {
|
||||
.bluelib-color(@hex-red);
|
||||
}
|
||||
|
|
@ -336,8 +334,67 @@
|
|||
}
|
||||
}
|
||||
|
||||
&@{input-select} {
|
||||
@{input-field} {
|
||||
cursor: text;
|
||||
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
}
|
||||
|
||||
@{input-select}, @{input-multiselect} {
|
||||
// Browsers add 4px of unremovable horizontal padding to options for some reason
|
||||
padding: 4px 2px;
|
||||
}
|
||||
|
||||
@{input-select-option}, @{input-multiselect-option} {
|
||||
font-weight: normal;
|
||||
color: @bA;
|
||||
|
||||
padding: 4px 4px;
|
||||
|
||||
// TODO: style checked elements, when it will be possible
|
||||
}
|
||||
|
||||
@{input-select-optgroup}, @{input-multiselect-optgroup} {
|
||||
font-weight: bold;
|
||||
color: @hex-accent;
|
||||
|
||||
padding: 4px 4px;
|
||||
|
||||
@{input-select-option}, @{input-multiselect-option} {
|
||||
padding: 4px 20px;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@{input-select-optgroup}, @{input-select-option}, @{input-multiselect-optgroup}, @{input-multiselect-option} {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
font-style: inherit;
|
||||
}
|
||||
|
||||
@{input-select} {
|
||||
cursor: context-menu;
|
||||
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
|
||||
@media screen and (-webkit-min-device-pixel-ratio:0) {
|
||||
@{input-select-option}, @{input-select-optgroup} {
|
||||
background-color: @hex-background;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@{input-multiselect} {
|
||||
cursor: vertical-text;
|
||||
|
||||
border-width: 0 0 0 2px;
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
// --- Element status ---
|
||||
|
|
|
|||
|
|
@ -344,53 +344,108 @@
|
|||
color: rgba(calc(var(--bluelib-color-r) - 50), calc(var(--bluelib-color-g) - 50), calc(var(--bluelib-color-b) - 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.2);
|
||||
}
|
||||
.bluelib .input-field {
|
||||
cursor: text;
|
||||
border-width: 0 0 2px 0;
|
||||
.bluelib .input {
|
||||
border-style: solid;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
.bluelib .input-field::placeholder {
|
||||
.bluelib .input::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
opacity: 1;
|
||||
}
|
||||
.bluelib .input-field:optional::placeholder {
|
||||
.bluelib .input:optional,
|
||||
.bluelib .input:optional::placeholder {
|
||||
font-style: italic;
|
||||
}
|
||||
.bluelib .input-field:invalid:not(:placeholder-shown) {
|
||||
.bluelib .input:invalid:not(:placeholder-shown) {
|
||||
--bluelib-color-r: 200;
|
||||
--bluelib-color-g: 0;
|
||||
--bluelib-color-b: 0;
|
||||
}
|
||||
.bluelib .input-field:hover,
|
||||
.bluelib .input-field:focus {
|
||||
.bluelib .input:hover,
|
||||
.bluelib .input:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.6);
|
||||
color: rgba(calc(var(--bluelib-color-r) - 50), calc(var(--bluelib-color-g) - 50), calc(var(--bluelib-color-b) - 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.1);
|
||||
}
|
||||
.bluelib .input-field:hover::placeholder,
|
||||
.bluelib .input-field:focus::placeholder {
|
||||
.bluelib .input:hover::placeholder,
|
||||
.bluelib .input:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.7);
|
||||
}
|
||||
.bluelib .input-field.status-disabled {
|
||||
.bluelib .input.status-disabled {
|
||||
border-style: dashed;
|
||||
}
|
||||
.bluelib .input-field.status-disabled:hover,
|
||||
.bluelib .input-field.status-disabled:focus {
|
||||
.bluelib .input.status-disabled:hover,
|
||||
.bluelib .input.status-disabled:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
}
|
||||
.bluelib .input-field.status-disabled:hover::placeholder,
|
||||
.bluelib .input-field.status-disabled:focus::placeholder {
|
||||
.bluelib .input.status-disabled:hover::placeholder,
|
||||
.bluelib .input.status-disabled:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
}
|
||||
.bluelib .input-field {
|
||||
cursor: text;
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
}
|
||||
.bluelib .input-select,
|
||||
.bluelib .input-multiselect {
|
||||
padding: 4px 2px;
|
||||
}
|
||||
.bluelib .input-select-option,
|
||||
.bluelib .input-multiselect-option {
|
||||
font-weight: normal;
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.bluelib .input-select-optgroup,
|
||||
.bluelib .input-multiselect-optgroup {
|
||||
font-weight: bold;
|
||||
color: #181818;
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.bluelib .input-select-optgroup .input-select-option,
|
||||
.bluelib .input-multiselect-optgroup .input-select-option,
|
||||
.bluelib .input-select-optgroup .input-multiselect-option,
|
||||
.bluelib .input-multiselect-optgroup .input-multiselect-option {
|
||||
padding: 4px 20px;
|
||||
}
|
||||
.bluelib .input-select-optgroup .input-select-option::before,
|
||||
.bluelib .input-multiselect-optgroup .input-select-option::before,
|
||||
.bluelib .input-select-optgroup .input-multiselect-option::before,
|
||||
.bluelib .input-multiselect-optgroup .input-multiselect-option::before {
|
||||
content: "";
|
||||
}
|
||||
.bluelib .input-select-optgroup,
|
||||
.bluelib .input-select-option,
|
||||
.bluelib .input-multiselect-optgroup,
|
||||
.bluelib .input-multiselect-option {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
font-style: inherit;
|
||||
}
|
||||
.bluelib .input-select {
|
||||
cursor: context-menu;
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
.bluelib .input-select .input-select-option,
|
||||
.bluelib .input-select .input-select-optgroup {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
}
|
||||
.bluelib .input-multiselect {
|
||||
cursor: vertical-text;
|
||||
border-width: 0 0 0 2px;
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
.bluelib .status-hoverable {
|
||||
cursor: help;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -860,8 +860,8 @@ body input[type="time"],
|
|||
body input[type="url"],
|
||||
.base-skeleton input[type="week"],
|
||||
body input[type="week"],
|
||||
.base-skeleton form select,
|
||||
body form select,
|
||||
.base-skeleton form select:not([multiple]),
|
||||
body form select:not([multiple]),
|
||||
.base-skeleton .input-select,
|
||||
body .input-select,
|
||||
.base-skeleton .form-input,
|
||||
|
|
@ -1068,6 +1068,150 @@ body .button-toggle-on .status-disabled:active {
|
|||
color: rgba(calc(var(--bluelib-color-r) - 50), calc(var(--bluelib-color-g) - 50), calc(var(--bluelib-color-b) - 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.2);
|
||||
}
|
||||
.base-skeleton .input,
|
||||
body .input,
|
||||
.base-skeleton input,
|
||||
body input,
|
||||
.base-skeleton select,
|
||||
body select {
|
||||
border-style: solid;
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
.base-skeleton .input::placeholder,
|
||||
body .input::placeholder,
|
||||
.base-skeleton input::placeholder,
|
||||
body input::placeholder,
|
||||
.base-skeleton select::placeholder,
|
||||
body select::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
opacity: 1;
|
||||
}
|
||||
.base-skeleton .input:optional,
|
||||
body .input:optional,
|
||||
.base-skeleton input:optional,
|
||||
body input:optional,
|
||||
.base-skeleton select:optional,
|
||||
body select:optional,
|
||||
.base-skeleton .input:optional::placeholder,
|
||||
body .input:optional::placeholder,
|
||||
.base-skeleton input:optional::placeholder,
|
||||
body input:optional::placeholder,
|
||||
.base-skeleton select:optional::placeholder,
|
||||
body select:optional::placeholder {
|
||||
font-style: italic;
|
||||
}
|
||||
.base-skeleton .input:invalid:not(:placeholder-shown),
|
||||
body .input:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input:invalid:not(:placeholder-shown),
|
||||
body input:invalid:not(:placeholder-shown),
|
||||
.base-skeleton select:invalid:not(:placeholder-shown),
|
||||
body select:invalid:not(:placeholder-shown) {
|
||||
--bluelib-color-r: 200;
|
||||
--bluelib-color-g: 0;
|
||||
--bluelib-color-b: 0;
|
||||
}
|
||||
.base-skeleton .input:hover,
|
||||
body .input:hover,
|
||||
.base-skeleton input:hover,
|
||||
body input:hover,
|
||||
.base-skeleton select:hover,
|
||||
body select:hover,
|
||||
.base-skeleton .input:focus,
|
||||
body .input:focus,
|
||||
.base-skeleton input:focus,
|
||||
body input:focus,
|
||||
.base-skeleton select:focus,
|
||||
body select:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.6);
|
||||
color: rgba(calc(var(--bluelib-color-r) - 50), calc(var(--bluelib-color-g) - 50), calc(var(--bluelib-color-b) - 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.1);
|
||||
}
|
||||
.base-skeleton .input:hover::placeholder,
|
||||
body .input:hover::placeholder,
|
||||
.base-skeleton input:hover::placeholder,
|
||||
body input:hover::placeholder,
|
||||
.base-skeleton select:hover::placeholder,
|
||||
body select:hover::placeholder,
|
||||
.base-skeleton .input:focus::placeholder,
|
||||
body .input:focus::placeholder,
|
||||
.base-skeleton input:focus::placeholder,
|
||||
body input:focus::placeholder,
|
||||
.base-skeleton select:focus::placeholder,
|
||||
body select:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.7);
|
||||
}
|
||||
.base-skeleton .input[disabled],
|
||||
body .input[disabled],
|
||||
.base-skeleton input[disabled],
|
||||
body input[disabled],
|
||||
.base-skeleton select[disabled],
|
||||
body select[disabled],
|
||||
.base-skeleton .input .status-disabled,
|
||||
body .input .status-disabled,
|
||||
.base-skeleton input .status-disabled,
|
||||
body input .status-disabled,
|
||||
.base-skeleton select .status-disabled,
|
||||
body select .status-disabled {
|
||||
border-style: dashed;
|
||||
}
|
||||
.base-skeleton .input[disabled]:hover,
|
||||
body .input[disabled]:hover,
|
||||
.base-skeleton input[disabled]:hover,
|
||||
body input[disabled]:hover,
|
||||
.base-skeleton select[disabled]:hover,
|
||||
body select[disabled]:hover,
|
||||
.base-skeleton .input .status-disabled:hover,
|
||||
body .input .status-disabled:hover,
|
||||
.base-skeleton input .status-disabled:hover,
|
||||
body input .status-disabled:hover,
|
||||
.base-skeleton select .status-disabled:hover,
|
||||
body select .status-disabled:hover,
|
||||
.base-skeleton .input[disabled]:focus,
|
||||
body .input[disabled]:focus,
|
||||
.base-skeleton input[disabled]:focus,
|
||||
body input[disabled]:focus,
|
||||
.base-skeleton select[disabled]:focus,
|
||||
body select[disabled]:focus,
|
||||
.base-skeleton .input .status-disabled:focus,
|
||||
body .input .status-disabled:focus,
|
||||
.base-skeleton input .status-disabled:focus,
|
||||
body input .status-disabled:focus,
|
||||
.base-skeleton select .status-disabled:focus,
|
||||
body select .status-disabled:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
}
|
||||
.base-skeleton .input[disabled]:hover::placeholder,
|
||||
body .input[disabled]:hover::placeholder,
|
||||
.base-skeleton input[disabled]:hover::placeholder,
|
||||
body input[disabled]:hover::placeholder,
|
||||
.base-skeleton select[disabled]:hover::placeholder,
|
||||
body select[disabled]:hover::placeholder,
|
||||
.base-skeleton .input .status-disabled:hover::placeholder,
|
||||
body .input .status-disabled:hover::placeholder,
|
||||
.base-skeleton input .status-disabled:hover::placeholder,
|
||||
body input .status-disabled:hover::placeholder,
|
||||
.base-skeleton select .status-disabled:hover::placeholder,
|
||||
body select .status-disabled:hover::placeholder,
|
||||
.base-skeleton .input[disabled]:focus::placeholder,
|
||||
body .input[disabled]:focus::placeholder,
|
||||
.base-skeleton input[disabled]:focus::placeholder,
|
||||
body input[disabled]:focus::placeholder,
|
||||
.base-skeleton select[disabled]:focus::placeholder,
|
||||
body select[disabled]:focus::placeholder,
|
||||
.base-skeleton .input .status-disabled:focus::placeholder,
|
||||
body .input .status-disabled:focus::placeholder,
|
||||
.base-skeleton input .status-disabled:focus::placeholder,
|
||||
body input .status-disabled:focus::placeholder,
|
||||
.base-skeleton select .status-disabled:focus::placeholder,
|
||||
body select .status-disabled:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
}
|
||||
.base-skeleton .input-field,
|
||||
body .input-field,
|
||||
.base-skeleton input[type="color"],
|
||||
|
|
@ -1102,581 +1246,166 @@ body input[type="url"],
|
|||
body input[type="week"] {
|
||||
cursor: text;
|
||||
border-width: 0 0 2px 0;
|
||||
border-style: solid;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
}
|
||||
.base-skeleton select:not([multiple]),
|
||||
body select:not([multiple]),
|
||||
.base-skeleton .input-select,
|
||||
body .input-select,
|
||||
.base-skeleton select[multiple],
|
||||
body select[multiple],
|
||||
.base-skeleton .input-multiselect,
|
||||
body .input-multiselect {
|
||||
padding: 4px 2px;
|
||||
}
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-select-option,
|
||||
body .input-select-option,
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-multiselect-option,
|
||||
body .input-multiselect-option {
|
||||
font-weight: normal;
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-select-optgroup,
|
||||
body .input-select-optgroup,
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-multiselect-optgroup,
|
||||
body .input-multiselect-optgroup {
|
||||
font-weight: bold;
|
||||
color: #181818;
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-select-optgroup option,
|
||||
body .input-select-optgroup option,
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-multiselect-optgroup option,
|
||||
body .input-multiselect-optgroup option,
|
||||
.base-skeleton optgroup .input-select-option,
|
||||
body optgroup .input-select-option,
|
||||
.base-skeleton .input-select-optgroup .input-select-option,
|
||||
body .input-select-optgroup .input-select-option,
|
||||
.base-skeleton optgroup .input-select-option,
|
||||
body optgroup .input-select-option,
|
||||
.base-skeleton .input-multiselect-optgroup .input-select-option,
|
||||
body .input-multiselect-optgroup .input-select-option,
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-select-optgroup option,
|
||||
body .input-select-optgroup option,
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-multiselect-optgroup option,
|
||||
body .input-multiselect-optgroup option,
|
||||
.base-skeleton optgroup .input-multiselect-option,
|
||||
body optgroup .input-multiselect-option,
|
||||
.base-skeleton .input-select-optgroup .input-multiselect-option,
|
||||
body .input-select-optgroup .input-multiselect-option,
|
||||
.base-skeleton optgroup .input-multiselect-option,
|
||||
body optgroup .input-multiselect-option,
|
||||
.base-skeleton .input-multiselect-optgroup .input-multiselect-option,
|
||||
body .input-multiselect-optgroup .input-multiselect-option {
|
||||
padding: 4px 20px;
|
||||
}
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-select-optgroup option::before,
|
||||
body .input-select-optgroup option::before,
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-multiselect-optgroup option::before,
|
||||
body .input-multiselect-optgroup option::before,
|
||||
.base-skeleton optgroup .input-select-option::before,
|
||||
body optgroup .input-select-option::before,
|
||||
.base-skeleton .input-select-optgroup .input-select-option::before,
|
||||
body .input-select-optgroup .input-select-option::before,
|
||||
.base-skeleton optgroup .input-select-option::before,
|
||||
body optgroup .input-select-option::before,
|
||||
.base-skeleton .input-multiselect-optgroup .input-select-option::before,
|
||||
body .input-multiselect-optgroup .input-select-option::before,
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-select-optgroup option::before,
|
||||
body .input-select-optgroup option::before,
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-multiselect-optgroup option::before,
|
||||
body .input-multiselect-optgroup option::before,
|
||||
.base-skeleton optgroup .input-multiselect-option::before,
|
||||
body optgroup .input-multiselect-option::before,
|
||||
.base-skeleton .input-select-optgroup .input-multiselect-option::before,
|
||||
body .input-select-optgroup .input-multiselect-option::before,
|
||||
.base-skeleton optgroup .input-multiselect-option::before,
|
||||
body optgroup .input-multiselect-option::before,
|
||||
.base-skeleton .input-multiselect-optgroup .input-multiselect-option::before,
|
||||
body .input-multiselect-optgroup .input-multiselect-option::before {
|
||||
content: "";
|
||||
}
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-select-optgroup,
|
||||
body .input-select-optgroup,
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-select-option,
|
||||
body .input-select-option,
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-multiselect-optgroup,
|
||||
body .input-multiselect-optgroup,
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-multiselect-option,
|
||||
body .input-multiselect-option {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
font-style: inherit;
|
||||
}
|
||||
.base-skeleton .input-field::placeholder,
|
||||
body .input-field::placeholder,
|
||||
.base-skeleton input[type="color"]::placeholder,
|
||||
body input[type="color"]::placeholder,
|
||||
.base-skeleton input[type="date"]::placeholder,
|
||||
body input[type="date"]::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]::placeholder,
|
||||
body input[type="datetime-local"]::placeholder,
|
||||
.base-skeleton input[type="email"]::placeholder,
|
||||
body input[type="email"]::placeholder,
|
||||
.base-skeleton input[type="file"]::placeholder,
|
||||
body input[type="file"]::placeholder,
|
||||
.base-skeleton input[type="image"]::placeholder,
|
||||
body input[type="image"]::placeholder,
|
||||
.base-skeleton input[type="month"]::placeholder,
|
||||
body input[type="month"]::placeholder,
|
||||
.base-skeleton input[type="number"]::placeholder,
|
||||
body input[type="number"]::placeholder,
|
||||
.base-skeleton input[type="password"]::placeholder,
|
||||
body input[type="password"]::placeholder,
|
||||
.base-skeleton input[type="search"]::placeholder,
|
||||
body input[type="search"]::placeholder,
|
||||
.base-skeleton input[type="tel"]::placeholder,
|
||||
body input[type="tel"]::placeholder,
|
||||
.base-skeleton input[type="text"]::placeholder,
|
||||
body input[type="text"]::placeholder,
|
||||
.base-skeleton input[type="time"]::placeholder,
|
||||
body input[type="time"]::placeholder,
|
||||
.base-skeleton input[type="url"]::placeholder,
|
||||
body input[type="url"]::placeholder,
|
||||
.base-skeleton input[type="week"]::placeholder,
|
||||
body input[type="week"]::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
opacity: 1;
|
||||
.base-skeleton select:not([multiple]),
|
||||
body select:not([multiple]),
|
||||
.base-skeleton .input-select,
|
||||
body .input-select {
|
||||
cursor: context-menu;
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
.base-skeleton .input-field:optional::placeholder,
|
||||
body .input-field:optional::placeholder,
|
||||
.base-skeleton input[type="color"]:optional::placeholder,
|
||||
body input[type="color"]:optional::placeholder,
|
||||
.base-skeleton input[type="date"]:optional::placeholder,
|
||||
body input[type="date"]:optional::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]:optional::placeholder,
|
||||
body input[type="datetime-local"]:optional::placeholder,
|
||||
.base-skeleton input[type="email"]:optional::placeholder,
|
||||
body input[type="email"]:optional::placeholder,
|
||||
.base-skeleton input[type="file"]:optional::placeholder,
|
||||
body input[type="file"]:optional::placeholder,
|
||||
.base-skeleton input[type="image"]:optional::placeholder,
|
||||
body input[type="image"]:optional::placeholder,
|
||||
.base-skeleton input[type="month"]:optional::placeholder,
|
||||
body input[type="month"]:optional::placeholder,
|
||||
.base-skeleton input[type="number"]:optional::placeholder,
|
||||
body input[type="number"]:optional::placeholder,
|
||||
.base-skeleton input[type="password"]:optional::placeholder,
|
||||
body input[type="password"]:optional::placeholder,
|
||||
.base-skeleton input[type="search"]:optional::placeholder,
|
||||
body input[type="search"]:optional::placeholder,
|
||||
.base-skeleton input[type="tel"]:optional::placeholder,
|
||||
body input[type="tel"]:optional::placeholder,
|
||||
.base-skeleton input[type="text"]:optional::placeholder,
|
||||
body input[type="text"]:optional::placeholder,
|
||||
.base-skeleton input[type="time"]:optional::placeholder,
|
||||
body input[type="time"]:optional::placeholder,
|
||||
.base-skeleton input[type="url"]:optional::placeholder,
|
||||
body input[type="url"]:optional::placeholder,
|
||||
.base-skeleton input[type="week"]:optional::placeholder,
|
||||
body input[type="week"]:optional::placeholder {
|
||||
font-style: italic;
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
.base-skeleton select:not([multiple]) option,
|
||||
body select:not([multiple]) option,
|
||||
.base-skeleton .input-select option,
|
||||
body .input-select option,
|
||||
.base-skeleton select:not([multiple]) .input-select-option,
|
||||
body select:not([multiple]) .input-select-option,
|
||||
.base-skeleton .input-select .input-select-option,
|
||||
body .input-select .input-select-option,
|
||||
.base-skeleton select:not([multiple]) optgroup,
|
||||
body select:not([multiple]) optgroup,
|
||||
.base-skeleton .input-select optgroup,
|
||||
body .input-select optgroup,
|
||||
.base-skeleton select:not([multiple]) .input-select-optgroup,
|
||||
body select:not([multiple]) .input-select-optgroup,
|
||||
.base-skeleton .input-select .input-select-optgroup,
|
||||
body .input-select .input-select-optgroup {
|
||||
background-color: #ffffff;
|
||||
}
|
||||
}
|
||||
.base-skeleton .input-field:invalid:not(:placeholder-shown),
|
||||
body .input-field:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="color"]:invalid:not(:placeholder-shown),
|
||||
body input[type="color"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="date"]:invalid:not(:placeholder-shown),
|
||||
body input[type="date"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="datetime-local"]:invalid:not(:placeholder-shown),
|
||||
body input[type="datetime-local"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="email"]:invalid:not(:placeholder-shown),
|
||||
body input[type="email"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="file"]:invalid:not(:placeholder-shown),
|
||||
body input[type="file"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="image"]:invalid:not(:placeholder-shown),
|
||||
body input[type="image"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="month"]:invalid:not(:placeholder-shown),
|
||||
body input[type="month"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="number"]:invalid:not(:placeholder-shown),
|
||||
body input[type="number"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="password"]:invalid:not(:placeholder-shown),
|
||||
body input[type="password"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="search"]:invalid:not(:placeholder-shown),
|
||||
body input[type="search"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="tel"]:invalid:not(:placeholder-shown),
|
||||
body input[type="tel"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="text"]:invalid:not(:placeholder-shown),
|
||||
body input[type="text"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="time"]:invalid:not(:placeholder-shown),
|
||||
body input[type="time"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="url"]:invalid:not(:placeholder-shown),
|
||||
body input[type="url"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="week"]:invalid:not(:placeholder-shown),
|
||||
body input[type="week"]:invalid:not(:placeholder-shown) {
|
||||
--bluelib-color-r: 200;
|
||||
--bluelib-color-g: 0;
|
||||
--bluelib-color-b: 0;
|
||||
}
|
||||
.base-skeleton .input-field:hover,
|
||||
body .input-field:hover,
|
||||
.base-skeleton input[type="color"]:hover,
|
||||
body input[type="color"]:hover,
|
||||
.base-skeleton input[type="date"]:hover,
|
||||
body input[type="date"]:hover,
|
||||
.base-skeleton input[type="datetime-local"]:hover,
|
||||
body input[type="datetime-local"]:hover,
|
||||
.base-skeleton input[type="email"]:hover,
|
||||
body input[type="email"]:hover,
|
||||
.base-skeleton input[type="file"]:hover,
|
||||
body input[type="file"]:hover,
|
||||
.base-skeleton input[type="image"]:hover,
|
||||
body input[type="image"]:hover,
|
||||
.base-skeleton input[type="month"]:hover,
|
||||
body input[type="month"]:hover,
|
||||
.base-skeleton input[type="number"]:hover,
|
||||
body input[type="number"]:hover,
|
||||
.base-skeleton input[type="password"]:hover,
|
||||
body input[type="password"]:hover,
|
||||
.base-skeleton input[type="search"]:hover,
|
||||
body input[type="search"]:hover,
|
||||
.base-skeleton input[type="tel"]:hover,
|
||||
body input[type="tel"]:hover,
|
||||
.base-skeleton input[type="text"]:hover,
|
||||
body input[type="text"]:hover,
|
||||
.base-skeleton input[type="time"]:hover,
|
||||
body input[type="time"]:hover,
|
||||
.base-skeleton input[type="url"]:hover,
|
||||
body input[type="url"]:hover,
|
||||
.base-skeleton input[type="week"]:hover,
|
||||
body input[type="week"]:hover,
|
||||
.base-skeleton .input-field:focus,
|
||||
body .input-field:focus,
|
||||
.base-skeleton input[type="color"]:focus,
|
||||
body input[type="color"]:focus,
|
||||
.base-skeleton input[type="date"]:focus,
|
||||
body input[type="date"]:focus,
|
||||
.base-skeleton input[type="datetime-local"]:focus,
|
||||
body input[type="datetime-local"]:focus,
|
||||
.base-skeleton input[type="email"]:focus,
|
||||
body input[type="email"]:focus,
|
||||
.base-skeleton input[type="file"]:focus,
|
||||
body input[type="file"]:focus,
|
||||
.base-skeleton input[type="image"]:focus,
|
||||
body input[type="image"]:focus,
|
||||
.base-skeleton input[type="month"]:focus,
|
||||
body input[type="month"]:focus,
|
||||
.base-skeleton input[type="number"]:focus,
|
||||
body input[type="number"]:focus,
|
||||
.base-skeleton input[type="password"]:focus,
|
||||
body input[type="password"]:focus,
|
||||
.base-skeleton input[type="search"]:focus,
|
||||
body input[type="search"]:focus,
|
||||
.base-skeleton input[type="tel"]:focus,
|
||||
body input[type="tel"]:focus,
|
||||
.base-skeleton input[type="text"]:focus,
|
||||
body input[type="text"]:focus,
|
||||
.base-skeleton input[type="time"]:focus,
|
||||
body input[type="time"]:focus,
|
||||
.base-skeleton input[type="url"]:focus,
|
||||
body input[type="url"]:focus,
|
||||
.base-skeleton input[type="week"]:focus,
|
||||
body input[type="week"]:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.6);
|
||||
color: rgba(calc(var(--bluelib-color-r) - 50), calc(var(--bluelib-color-g) - 50), calc(var(--bluelib-color-b) - 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.1);
|
||||
}
|
||||
.base-skeleton .input-field:hover::placeholder,
|
||||
body .input-field:hover::placeholder,
|
||||
.base-skeleton input[type="color"]:hover::placeholder,
|
||||
body input[type="color"]:hover::placeholder,
|
||||
.base-skeleton input[type="date"]:hover::placeholder,
|
||||
body input[type="date"]:hover::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]:hover::placeholder,
|
||||
body input[type="datetime-local"]:hover::placeholder,
|
||||
.base-skeleton input[type="email"]:hover::placeholder,
|
||||
body input[type="email"]:hover::placeholder,
|
||||
.base-skeleton input[type="file"]:hover::placeholder,
|
||||
body input[type="file"]:hover::placeholder,
|
||||
.base-skeleton input[type="image"]:hover::placeholder,
|
||||
body input[type="image"]:hover::placeholder,
|
||||
.base-skeleton input[type="month"]:hover::placeholder,
|
||||
body input[type="month"]:hover::placeholder,
|
||||
.base-skeleton input[type="number"]:hover::placeholder,
|
||||
body input[type="number"]:hover::placeholder,
|
||||
.base-skeleton input[type="password"]:hover::placeholder,
|
||||
body input[type="password"]:hover::placeholder,
|
||||
.base-skeleton input[type="search"]:hover::placeholder,
|
||||
body input[type="search"]:hover::placeholder,
|
||||
.base-skeleton input[type="tel"]:hover::placeholder,
|
||||
body input[type="tel"]:hover::placeholder,
|
||||
.base-skeleton input[type="text"]:hover::placeholder,
|
||||
body input[type="text"]:hover::placeholder,
|
||||
.base-skeleton input[type="time"]:hover::placeholder,
|
||||
body input[type="time"]:hover::placeholder,
|
||||
.base-skeleton input[type="url"]:hover::placeholder,
|
||||
body input[type="url"]:hover::placeholder,
|
||||
.base-skeleton input[type="week"]:hover::placeholder,
|
||||
body input[type="week"]:hover::placeholder,
|
||||
.base-skeleton .input-field:focus::placeholder,
|
||||
body .input-field:focus::placeholder,
|
||||
.base-skeleton input[type="color"]:focus::placeholder,
|
||||
body input[type="color"]:focus::placeholder,
|
||||
.base-skeleton input[type="date"]:focus::placeholder,
|
||||
body input[type="date"]:focus::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]:focus::placeholder,
|
||||
body input[type="datetime-local"]:focus::placeholder,
|
||||
.base-skeleton input[type="email"]:focus::placeholder,
|
||||
body input[type="email"]:focus::placeholder,
|
||||
.base-skeleton input[type="file"]:focus::placeholder,
|
||||
body input[type="file"]:focus::placeholder,
|
||||
.base-skeleton input[type="image"]:focus::placeholder,
|
||||
body input[type="image"]:focus::placeholder,
|
||||
.base-skeleton input[type="month"]:focus::placeholder,
|
||||
body input[type="month"]:focus::placeholder,
|
||||
.base-skeleton input[type="number"]:focus::placeholder,
|
||||
body input[type="number"]:focus::placeholder,
|
||||
.base-skeleton input[type="password"]:focus::placeholder,
|
||||
body input[type="password"]:focus::placeholder,
|
||||
.base-skeleton input[type="search"]:focus::placeholder,
|
||||
body input[type="search"]:focus::placeholder,
|
||||
.base-skeleton input[type="tel"]:focus::placeholder,
|
||||
body input[type="tel"]:focus::placeholder,
|
||||
.base-skeleton input[type="text"]:focus::placeholder,
|
||||
body input[type="text"]:focus::placeholder,
|
||||
.base-skeleton input[type="time"]:focus::placeholder,
|
||||
body input[type="time"]:focus::placeholder,
|
||||
.base-skeleton input[type="url"]:focus::placeholder,
|
||||
body input[type="url"]:focus::placeholder,
|
||||
.base-skeleton input[type="week"]:focus::placeholder,
|
||||
body input[type="week"]:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.7);
|
||||
}
|
||||
.base-skeleton .input-field[disabled],
|
||||
body .input-field[disabled],
|
||||
.base-skeleton input[type="color"][disabled],
|
||||
body input[type="color"][disabled],
|
||||
.base-skeleton input[type="date"][disabled],
|
||||
body input[type="date"][disabled],
|
||||
.base-skeleton input[type="datetime-local"][disabled],
|
||||
body input[type="datetime-local"][disabled],
|
||||
.base-skeleton input[type="email"][disabled],
|
||||
body input[type="email"][disabled],
|
||||
.base-skeleton input[type="file"][disabled],
|
||||
body input[type="file"][disabled],
|
||||
.base-skeleton input[type="image"][disabled],
|
||||
body input[type="image"][disabled],
|
||||
.base-skeleton input[type="month"][disabled],
|
||||
body input[type="month"][disabled],
|
||||
.base-skeleton input[type="number"][disabled],
|
||||
body input[type="number"][disabled],
|
||||
.base-skeleton input[type="password"][disabled],
|
||||
body input[type="password"][disabled],
|
||||
.base-skeleton input[type="search"][disabled],
|
||||
body input[type="search"][disabled],
|
||||
.base-skeleton input[type="tel"][disabled],
|
||||
body input[type="tel"][disabled],
|
||||
.base-skeleton input[type="text"][disabled],
|
||||
body input[type="text"][disabled],
|
||||
.base-skeleton input[type="time"][disabled],
|
||||
body input[type="time"][disabled],
|
||||
.base-skeleton input[type="url"][disabled],
|
||||
body input[type="url"][disabled],
|
||||
.base-skeleton input[type="week"][disabled],
|
||||
body input[type="week"][disabled],
|
||||
.base-skeleton .input-field .status-disabled,
|
||||
body .input-field .status-disabled,
|
||||
.base-skeleton input[type="color"] .status-disabled,
|
||||
body input[type="color"] .status-disabled,
|
||||
.base-skeleton input[type="date"] .status-disabled,
|
||||
body input[type="date"] .status-disabled,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled,
|
||||
body input[type="datetime-local"] .status-disabled,
|
||||
.base-skeleton input[type="email"] .status-disabled,
|
||||
body input[type="email"] .status-disabled,
|
||||
.base-skeleton input[type="file"] .status-disabled,
|
||||
body input[type="file"] .status-disabled,
|
||||
.base-skeleton input[type="image"] .status-disabled,
|
||||
body input[type="image"] .status-disabled,
|
||||
.base-skeleton input[type="month"] .status-disabled,
|
||||
body input[type="month"] .status-disabled,
|
||||
.base-skeleton input[type="number"] .status-disabled,
|
||||
body input[type="number"] .status-disabled,
|
||||
.base-skeleton input[type="password"] .status-disabled,
|
||||
body input[type="password"] .status-disabled,
|
||||
.base-skeleton input[type="search"] .status-disabled,
|
||||
body input[type="search"] .status-disabled,
|
||||
.base-skeleton input[type="tel"] .status-disabled,
|
||||
body input[type="tel"] .status-disabled,
|
||||
.base-skeleton input[type="text"] .status-disabled,
|
||||
body input[type="text"] .status-disabled,
|
||||
.base-skeleton input[type="time"] .status-disabled,
|
||||
body input[type="time"] .status-disabled,
|
||||
.base-skeleton input[type="url"] .status-disabled,
|
||||
body input[type="url"] .status-disabled,
|
||||
.base-skeleton input[type="week"] .status-disabled,
|
||||
body input[type="week"] .status-disabled {
|
||||
border-style: dashed;
|
||||
}
|
||||
.base-skeleton .input-field[disabled]:hover,
|
||||
body .input-field[disabled]:hover,
|
||||
.base-skeleton input[type="color"][disabled]:hover,
|
||||
body input[type="color"][disabled]:hover,
|
||||
.base-skeleton input[type="date"][disabled]:hover,
|
||||
body input[type="date"][disabled]:hover,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:hover,
|
||||
body input[type="datetime-local"][disabled]:hover,
|
||||
.base-skeleton input[type="email"][disabled]:hover,
|
||||
body input[type="email"][disabled]:hover,
|
||||
.base-skeleton input[type="file"][disabled]:hover,
|
||||
body input[type="file"][disabled]:hover,
|
||||
.base-skeleton input[type="image"][disabled]:hover,
|
||||
body input[type="image"][disabled]:hover,
|
||||
.base-skeleton input[type="month"][disabled]:hover,
|
||||
body input[type="month"][disabled]:hover,
|
||||
.base-skeleton input[type="number"][disabled]:hover,
|
||||
body input[type="number"][disabled]:hover,
|
||||
.base-skeleton input[type="password"][disabled]:hover,
|
||||
body input[type="password"][disabled]:hover,
|
||||
.base-skeleton input[type="search"][disabled]:hover,
|
||||
body input[type="search"][disabled]:hover,
|
||||
.base-skeleton input[type="tel"][disabled]:hover,
|
||||
body input[type="tel"][disabled]:hover,
|
||||
.base-skeleton input[type="text"][disabled]:hover,
|
||||
body input[type="text"][disabled]:hover,
|
||||
.base-skeleton input[type="time"][disabled]:hover,
|
||||
body input[type="time"][disabled]:hover,
|
||||
.base-skeleton input[type="url"][disabled]:hover,
|
||||
body input[type="url"][disabled]:hover,
|
||||
.base-skeleton input[type="week"][disabled]:hover,
|
||||
body input[type="week"][disabled]:hover,
|
||||
.base-skeleton .input-field .status-disabled:hover,
|
||||
body .input-field .status-disabled:hover,
|
||||
.base-skeleton input[type="color"] .status-disabled:hover,
|
||||
body input[type="color"] .status-disabled:hover,
|
||||
.base-skeleton input[type="date"] .status-disabled:hover,
|
||||
body input[type="date"] .status-disabled:hover,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:hover,
|
||||
body input[type="datetime-local"] .status-disabled:hover,
|
||||
.base-skeleton input[type="email"] .status-disabled:hover,
|
||||
body input[type="email"] .status-disabled:hover,
|
||||
.base-skeleton input[type="file"] .status-disabled:hover,
|
||||
body input[type="file"] .status-disabled:hover,
|
||||
.base-skeleton input[type="image"] .status-disabled:hover,
|
||||
body input[type="image"] .status-disabled:hover,
|
||||
.base-skeleton input[type="month"] .status-disabled:hover,
|
||||
body input[type="month"] .status-disabled:hover,
|
||||
.base-skeleton input[type="number"] .status-disabled:hover,
|
||||
body input[type="number"] .status-disabled:hover,
|
||||
.base-skeleton input[type="password"] .status-disabled:hover,
|
||||
body input[type="password"] .status-disabled:hover,
|
||||
.base-skeleton input[type="search"] .status-disabled:hover,
|
||||
body input[type="search"] .status-disabled:hover,
|
||||
.base-skeleton input[type="tel"] .status-disabled:hover,
|
||||
body input[type="tel"] .status-disabled:hover,
|
||||
.base-skeleton input[type="text"] .status-disabled:hover,
|
||||
body input[type="text"] .status-disabled:hover,
|
||||
.base-skeleton input[type="time"] .status-disabled:hover,
|
||||
body input[type="time"] .status-disabled:hover,
|
||||
.base-skeleton input[type="url"] .status-disabled:hover,
|
||||
body input[type="url"] .status-disabled:hover,
|
||||
.base-skeleton input[type="week"] .status-disabled:hover,
|
||||
body input[type="week"] .status-disabled:hover,
|
||||
.base-skeleton .input-field[disabled]:focus,
|
||||
body .input-field[disabled]:focus,
|
||||
.base-skeleton input[type="color"][disabled]:focus,
|
||||
body input[type="color"][disabled]:focus,
|
||||
.base-skeleton input[type="date"][disabled]:focus,
|
||||
body input[type="date"][disabled]:focus,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:focus,
|
||||
body input[type="datetime-local"][disabled]:focus,
|
||||
.base-skeleton input[type="email"][disabled]:focus,
|
||||
body input[type="email"][disabled]:focus,
|
||||
.base-skeleton input[type="file"][disabled]:focus,
|
||||
body input[type="file"][disabled]:focus,
|
||||
.base-skeleton input[type="image"][disabled]:focus,
|
||||
body input[type="image"][disabled]:focus,
|
||||
.base-skeleton input[type="month"][disabled]:focus,
|
||||
body input[type="month"][disabled]:focus,
|
||||
.base-skeleton input[type="number"][disabled]:focus,
|
||||
body input[type="number"][disabled]:focus,
|
||||
.base-skeleton input[type="password"][disabled]:focus,
|
||||
body input[type="password"][disabled]:focus,
|
||||
.base-skeleton input[type="search"][disabled]:focus,
|
||||
body input[type="search"][disabled]:focus,
|
||||
.base-skeleton input[type="tel"][disabled]:focus,
|
||||
body input[type="tel"][disabled]:focus,
|
||||
.base-skeleton input[type="text"][disabled]:focus,
|
||||
body input[type="text"][disabled]:focus,
|
||||
.base-skeleton input[type="time"][disabled]:focus,
|
||||
body input[type="time"][disabled]:focus,
|
||||
.base-skeleton input[type="url"][disabled]:focus,
|
||||
body input[type="url"][disabled]:focus,
|
||||
.base-skeleton input[type="week"][disabled]:focus,
|
||||
body input[type="week"][disabled]:focus,
|
||||
.base-skeleton .input-field .status-disabled:focus,
|
||||
body .input-field .status-disabled:focus,
|
||||
.base-skeleton input[type="color"] .status-disabled:focus,
|
||||
body input[type="color"] .status-disabled:focus,
|
||||
.base-skeleton input[type="date"] .status-disabled:focus,
|
||||
body input[type="date"] .status-disabled:focus,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:focus,
|
||||
body input[type="datetime-local"] .status-disabled:focus,
|
||||
.base-skeleton input[type="email"] .status-disabled:focus,
|
||||
body input[type="email"] .status-disabled:focus,
|
||||
.base-skeleton input[type="file"] .status-disabled:focus,
|
||||
body input[type="file"] .status-disabled:focus,
|
||||
.base-skeleton input[type="image"] .status-disabled:focus,
|
||||
body input[type="image"] .status-disabled:focus,
|
||||
.base-skeleton input[type="month"] .status-disabled:focus,
|
||||
body input[type="month"] .status-disabled:focus,
|
||||
.base-skeleton input[type="number"] .status-disabled:focus,
|
||||
body input[type="number"] .status-disabled:focus,
|
||||
.base-skeleton input[type="password"] .status-disabled:focus,
|
||||
body input[type="password"] .status-disabled:focus,
|
||||
.base-skeleton input[type="search"] .status-disabled:focus,
|
||||
body input[type="search"] .status-disabled:focus,
|
||||
.base-skeleton input[type="tel"] .status-disabled:focus,
|
||||
body input[type="tel"] .status-disabled:focus,
|
||||
.base-skeleton input[type="text"] .status-disabled:focus,
|
||||
body input[type="text"] .status-disabled:focus,
|
||||
.base-skeleton input[type="time"] .status-disabled:focus,
|
||||
body input[type="time"] .status-disabled:focus,
|
||||
.base-skeleton input[type="url"] .status-disabled:focus,
|
||||
body input[type="url"] .status-disabled:focus,
|
||||
.base-skeleton input[type="week"] .status-disabled:focus,
|
||||
body input[type="week"] .status-disabled:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
}
|
||||
.base-skeleton .input-field[disabled]:hover::placeholder,
|
||||
body .input-field[disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="color"][disabled]:hover::placeholder,
|
||||
body input[type="color"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="date"][disabled]:hover::placeholder,
|
||||
body input[type="date"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:hover::placeholder,
|
||||
body input[type="datetime-local"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="email"][disabled]:hover::placeholder,
|
||||
body input[type="email"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="file"][disabled]:hover::placeholder,
|
||||
body input[type="file"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="image"][disabled]:hover::placeholder,
|
||||
body input[type="image"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="month"][disabled]:hover::placeholder,
|
||||
body input[type="month"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="number"][disabled]:hover::placeholder,
|
||||
body input[type="number"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="password"][disabled]:hover::placeholder,
|
||||
body input[type="password"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="search"][disabled]:hover::placeholder,
|
||||
body input[type="search"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="tel"][disabled]:hover::placeholder,
|
||||
body input[type="tel"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="text"][disabled]:hover::placeholder,
|
||||
body input[type="text"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="time"][disabled]:hover::placeholder,
|
||||
body input[type="time"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="url"][disabled]:hover::placeholder,
|
||||
body input[type="url"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="week"][disabled]:hover::placeholder,
|
||||
body input[type="week"][disabled]:hover::placeholder,
|
||||
.base-skeleton .input-field .status-disabled:hover::placeholder,
|
||||
body .input-field .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="color"] .status-disabled:hover::placeholder,
|
||||
body input[type="color"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="date"] .status-disabled:hover::placeholder,
|
||||
body input[type="date"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:hover::placeholder,
|
||||
body input[type="datetime-local"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="email"] .status-disabled:hover::placeholder,
|
||||
body input[type="email"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="file"] .status-disabled:hover::placeholder,
|
||||
body input[type="file"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="image"] .status-disabled:hover::placeholder,
|
||||
body input[type="image"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="month"] .status-disabled:hover::placeholder,
|
||||
body input[type="month"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="number"] .status-disabled:hover::placeholder,
|
||||
body input[type="number"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="password"] .status-disabled:hover::placeholder,
|
||||
body input[type="password"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="search"] .status-disabled:hover::placeholder,
|
||||
body input[type="search"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="tel"] .status-disabled:hover::placeholder,
|
||||
body input[type="tel"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="text"] .status-disabled:hover::placeholder,
|
||||
body input[type="text"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="time"] .status-disabled:hover::placeholder,
|
||||
body input[type="time"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="url"] .status-disabled:hover::placeholder,
|
||||
body input[type="url"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="week"] .status-disabled:hover::placeholder,
|
||||
body input[type="week"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton .input-field[disabled]:focus::placeholder,
|
||||
body .input-field[disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="color"][disabled]:focus::placeholder,
|
||||
body input[type="color"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="date"][disabled]:focus::placeholder,
|
||||
body input[type="date"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:focus::placeholder,
|
||||
body input[type="datetime-local"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="email"][disabled]:focus::placeholder,
|
||||
body input[type="email"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="file"][disabled]:focus::placeholder,
|
||||
body input[type="file"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="image"][disabled]:focus::placeholder,
|
||||
body input[type="image"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="month"][disabled]:focus::placeholder,
|
||||
body input[type="month"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="number"][disabled]:focus::placeholder,
|
||||
body input[type="number"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="password"][disabled]:focus::placeholder,
|
||||
body input[type="password"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="search"][disabled]:focus::placeholder,
|
||||
body input[type="search"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="tel"][disabled]:focus::placeholder,
|
||||
body input[type="tel"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="text"][disabled]:focus::placeholder,
|
||||
body input[type="text"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="time"][disabled]:focus::placeholder,
|
||||
body input[type="time"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="url"][disabled]:focus::placeholder,
|
||||
body input[type="url"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="week"][disabled]:focus::placeholder,
|
||||
body input[type="week"][disabled]:focus::placeholder,
|
||||
.base-skeleton .input-field .status-disabled:focus::placeholder,
|
||||
body .input-field .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="color"] .status-disabled:focus::placeholder,
|
||||
body input[type="color"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="date"] .status-disabled:focus::placeholder,
|
||||
body input[type="date"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:focus::placeholder,
|
||||
body input[type="datetime-local"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="email"] .status-disabled:focus::placeholder,
|
||||
body input[type="email"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="file"] .status-disabled:focus::placeholder,
|
||||
body input[type="file"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="image"] .status-disabled:focus::placeholder,
|
||||
body input[type="image"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="month"] .status-disabled:focus::placeholder,
|
||||
body input[type="month"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="number"] .status-disabled:focus::placeholder,
|
||||
body input[type="number"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="password"] .status-disabled:focus::placeholder,
|
||||
body input[type="password"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="search"] .status-disabled:focus::placeholder,
|
||||
body input[type="search"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="tel"] .status-disabled:focus::placeholder,
|
||||
body input[type="tel"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="text"] .status-disabled:focus::placeholder,
|
||||
body input[type="text"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="time"] .status-disabled:focus::placeholder,
|
||||
body input[type="time"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="url"] .status-disabled:focus::placeholder,
|
||||
body input[type="url"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="week"] .status-disabled:focus::placeholder,
|
||||
body input[type="week"] .status-disabled:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
.base-skeleton select[multiple],
|
||||
body select[multiple],
|
||||
.base-skeleton .input-multiselect,
|
||||
body .input-multiselect {
|
||||
cursor: vertical-text;
|
||||
border-width: 0 0 0 2px;
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
.base-skeleton [title],
|
||||
body [title],
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -344,53 +344,108 @@
|
|||
color: rgba(calc(var(--bluelib-color-r) + 50), calc(var(--bluelib-color-g) + 50), calc(var(--bluelib-color-b) + 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.2);
|
||||
}
|
||||
.bluelib .input-field {
|
||||
cursor: text;
|
||||
border-width: 0 0 2px 0;
|
||||
.bluelib .input {
|
||||
border-style: solid;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
.bluelib .input-field::placeholder {
|
||||
.bluelib .input::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
opacity: 1;
|
||||
}
|
||||
.bluelib .input-field:optional::placeholder {
|
||||
.bluelib .input:optional,
|
||||
.bluelib .input:optional::placeholder {
|
||||
font-style: italic;
|
||||
}
|
||||
.bluelib .input-field:invalid:not(:placeholder-shown) {
|
||||
.bluelib .input:invalid:not(:placeholder-shown) {
|
||||
--bluelib-color-r: 255;
|
||||
--bluelib-color-g: 125;
|
||||
--bluelib-color-b: 125;
|
||||
}
|
||||
.bluelib .input-field:hover,
|
||||
.bluelib .input-field:focus {
|
||||
.bluelib .input:hover,
|
||||
.bluelib .input:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.6);
|
||||
color: rgba(calc(var(--bluelib-color-r) + 50), calc(var(--bluelib-color-g) + 50), calc(var(--bluelib-color-b) + 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.1);
|
||||
}
|
||||
.bluelib .input-field:hover::placeholder,
|
||||
.bluelib .input-field:focus::placeholder {
|
||||
.bluelib .input:hover::placeholder,
|
||||
.bluelib .input:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.7);
|
||||
}
|
||||
.bluelib .input-field.status-disabled {
|
||||
.bluelib .input.status-disabled {
|
||||
border-style: dashed;
|
||||
}
|
||||
.bluelib .input-field.status-disabled:hover,
|
||||
.bluelib .input-field.status-disabled:focus {
|
||||
.bluelib .input.status-disabled:hover,
|
||||
.bluelib .input.status-disabled:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
}
|
||||
.bluelib .input-field.status-disabled:hover::placeholder,
|
||||
.bluelib .input-field.status-disabled:focus::placeholder {
|
||||
.bluelib .input.status-disabled:hover::placeholder,
|
||||
.bluelib .input.status-disabled:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
}
|
||||
.bluelib .input-field {
|
||||
cursor: text;
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
}
|
||||
.bluelib .input-select,
|
||||
.bluelib .input-multiselect {
|
||||
padding: 4px 2px;
|
||||
}
|
||||
.bluelib .input-select-option,
|
||||
.bluelib .input-multiselect-option {
|
||||
font-weight: normal;
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.bluelib .input-select-optgroup,
|
||||
.bluelib .input-multiselect-optgroup {
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.bluelib .input-select-optgroup .input-select-option,
|
||||
.bluelib .input-multiselect-optgroup .input-select-option,
|
||||
.bluelib .input-select-optgroup .input-multiselect-option,
|
||||
.bluelib .input-multiselect-optgroup .input-multiselect-option {
|
||||
padding: 4px 20px;
|
||||
}
|
||||
.bluelib .input-select-optgroup .input-select-option::before,
|
||||
.bluelib .input-multiselect-optgroup .input-select-option::before,
|
||||
.bluelib .input-select-optgroup .input-multiselect-option::before,
|
||||
.bluelib .input-multiselect-optgroup .input-multiselect-option::before {
|
||||
content: "";
|
||||
}
|
||||
.bluelib .input-select-optgroup,
|
||||
.bluelib .input-select-option,
|
||||
.bluelib .input-multiselect-optgroup,
|
||||
.bluelib .input-multiselect-option {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
font-style: inherit;
|
||||
}
|
||||
.bluelib .input-select {
|
||||
cursor: context-menu;
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
.bluelib .input-select .input-select-option,
|
||||
.bluelib .input-select .input-select-optgroup {
|
||||
background-color: #0d193b;
|
||||
}
|
||||
}
|
||||
.bluelib .input-multiselect {
|
||||
cursor: vertical-text;
|
||||
border-width: 0 0 0 2px;
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
.bluelib .status-hoverable {
|
||||
cursor: help;
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -860,8 +860,8 @@ body input[type="time"],
|
|||
body input[type="url"],
|
||||
.base-skeleton input[type="week"],
|
||||
body input[type="week"],
|
||||
.base-skeleton form select,
|
||||
body form select,
|
||||
.base-skeleton form select:not([multiple]),
|
||||
body form select:not([multiple]),
|
||||
.base-skeleton .input-select,
|
||||
body .input-select,
|
||||
.base-skeleton .form-input,
|
||||
|
|
@ -1068,6 +1068,150 @@ body .button-toggle-on .status-disabled:active {
|
|||
color: rgba(calc(var(--bluelib-color-r) + 50), calc(var(--bluelib-color-g) + 50), calc(var(--bluelib-color-b) + 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.2);
|
||||
}
|
||||
.base-skeleton .input,
|
||||
body .input,
|
||||
.base-skeleton input,
|
||||
body input,
|
||||
.base-skeleton select,
|
||||
body select {
|
||||
border-style: solid;
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
}
|
||||
.base-skeleton .input::placeholder,
|
||||
body .input::placeholder,
|
||||
.base-skeleton input::placeholder,
|
||||
body input::placeholder,
|
||||
.base-skeleton select::placeholder,
|
||||
body select::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
opacity: 1;
|
||||
}
|
||||
.base-skeleton .input:optional,
|
||||
body .input:optional,
|
||||
.base-skeleton input:optional,
|
||||
body input:optional,
|
||||
.base-skeleton select:optional,
|
||||
body select:optional,
|
||||
.base-skeleton .input:optional::placeholder,
|
||||
body .input:optional::placeholder,
|
||||
.base-skeleton input:optional::placeholder,
|
||||
body input:optional::placeholder,
|
||||
.base-skeleton select:optional::placeholder,
|
||||
body select:optional::placeholder {
|
||||
font-style: italic;
|
||||
}
|
||||
.base-skeleton .input:invalid:not(:placeholder-shown),
|
||||
body .input:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input:invalid:not(:placeholder-shown),
|
||||
body input:invalid:not(:placeholder-shown),
|
||||
.base-skeleton select:invalid:not(:placeholder-shown),
|
||||
body select:invalid:not(:placeholder-shown) {
|
||||
--bluelib-color-r: 255;
|
||||
--bluelib-color-g: 125;
|
||||
--bluelib-color-b: 125;
|
||||
}
|
||||
.base-skeleton .input:hover,
|
||||
body .input:hover,
|
||||
.base-skeleton input:hover,
|
||||
body input:hover,
|
||||
.base-skeleton select:hover,
|
||||
body select:hover,
|
||||
.base-skeleton .input:focus,
|
||||
body .input:focus,
|
||||
.base-skeleton input:focus,
|
||||
body input:focus,
|
||||
.base-skeleton select:focus,
|
||||
body select:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.6);
|
||||
color: rgba(calc(var(--bluelib-color-r) + 50), calc(var(--bluelib-color-g) + 50), calc(var(--bluelib-color-b) + 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.1);
|
||||
}
|
||||
.base-skeleton .input:hover::placeholder,
|
||||
body .input:hover::placeholder,
|
||||
.base-skeleton input:hover::placeholder,
|
||||
body input:hover::placeholder,
|
||||
.base-skeleton select:hover::placeholder,
|
||||
body select:hover::placeholder,
|
||||
.base-skeleton .input:focus::placeholder,
|
||||
body .input:focus::placeholder,
|
||||
.base-skeleton input:focus::placeholder,
|
||||
body input:focus::placeholder,
|
||||
.base-skeleton select:focus::placeholder,
|
||||
body select:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.7);
|
||||
}
|
||||
.base-skeleton .input[disabled],
|
||||
body .input[disabled],
|
||||
.base-skeleton input[disabled],
|
||||
body input[disabled],
|
||||
.base-skeleton select[disabled],
|
||||
body select[disabled],
|
||||
.base-skeleton .input .status-disabled,
|
||||
body .input .status-disabled,
|
||||
.base-skeleton input .status-disabled,
|
||||
body input .status-disabled,
|
||||
.base-skeleton select .status-disabled,
|
||||
body select .status-disabled {
|
||||
border-style: dashed;
|
||||
}
|
||||
.base-skeleton .input[disabled]:hover,
|
||||
body .input[disabled]:hover,
|
||||
.base-skeleton input[disabled]:hover,
|
||||
body input[disabled]:hover,
|
||||
.base-skeleton select[disabled]:hover,
|
||||
body select[disabled]:hover,
|
||||
.base-skeleton .input .status-disabled:hover,
|
||||
body .input .status-disabled:hover,
|
||||
.base-skeleton input .status-disabled:hover,
|
||||
body input .status-disabled:hover,
|
||||
.base-skeleton select .status-disabled:hover,
|
||||
body select .status-disabled:hover,
|
||||
.base-skeleton .input[disabled]:focus,
|
||||
body .input[disabled]:focus,
|
||||
.base-skeleton input[disabled]:focus,
|
||||
body input[disabled]:focus,
|
||||
.base-skeleton select[disabled]:focus,
|
||||
body select[disabled]:focus,
|
||||
.base-skeleton .input .status-disabled:focus,
|
||||
body .input .status-disabled:focus,
|
||||
.base-skeleton input .status-disabled:focus,
|
||||
body input .status-disabled:focus,
|
||||
.base-skeleton select .status-disabled:focus,
|
||||
body select .status-disabled:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
}
|
||||
.base-skeleton .input[disabled]:hover::placeholder,
|
||||
body .input[disabled]:hover::placeholder,
|
||||
.base-skeleton input[disabled]:hover::placeholder,
|
||||
body input[disabled]:hover::placeholder,
|
||||
.base-skeleton select[disabled]:hover::placeholder,
|
||||
body select[disabled]:hover::placeholder,
|
||||
.base-skeleton .input .status-disabled:hover::placeholder,
|
||||
body .input .status-disabled:hover::placeholder,
|
||||
.base-skeleton input .status-disabled:hover::placeholder,
|
||||
body input .status-disabled:hover::placeholder,
|
||||
.base-skeleton select .status-disabled:hover::placeholder,
|
||||
body select .status-disabled:hover::placeholder,
|
||||
.base-skeleton .input[disabled]:focus::placeholder,
|
||||
body .input[disabled]:focus::placeholder,
|
||||
.base-skeleton input[disabled]:focus::placeholder,
|
||||
body input[disabled]:focus::placeholder,
|
||||
.base-skeleton select[disabled]:focus::placeholder,
|
||||
body select[disabled]:focus::placeholder,
|
||||
.base-skeleton .input .status-disabled:focus::placeholder,
|
||||
body .input .status-disabled:focus::placeholder,
|
||||
.base-skeleton input .status-disabled:focus::placeholder,
|
||||
body input .status-disabled:focus::placeholder,
|
||||
.base-skeleton select .status-disabled:focus::placeholder,
|
||||
body select .status-disabled:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
}
|
||||
.base-skeleton .input-field,
|
||||
body .input-field,
|
||||
.base-skeleton input[type="color"],
|
||||
|
|
@ -1102,581 +1246,166 @@ body input[type="url"],
|
|||
body input[type="week"] {
|
||||
cursor: text;
|
||||
border-width: 0 0 2px 0;
|
||||
border-style: solid;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 4px 6px;
|
||||
}
|
||||
.base-skeleton select:not([multiple]),
|
||||
body select:not([multiple]),
|
||||
.base-skeleton .input-select,
|
||||
body .input-select,
|
||||
.base-skeleton select[multiple],
|
||||
body select[multiple],
|
||||
.base-skeleton .input-multiselect,
|
||||
body .input-multiselect {
|
||||
padding: 4px 2px;
|
||||
}
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-select-option,
|
||||
body .input-select-option,
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-multiselect-option,
|
||||
body .input-multiselect-option {
|
||||
font-weight: normal;
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-select-optgroup,
|
||||
body .input-select-optgroup,
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-multiselect-optgroup,
|
||||
body .input-multiselect-optgroup {
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
padding: 4px 4px;
|
||||
}
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-select-optgroup option,
|
||||
body .input-select-optgroup option,
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-multiselect-optgroup option,
|
||||
body .input-multiselect-optgroup option,
|
||||
.base-skeleton optgroup .input-select-option,
|
||||
body optgroup .input-select-option,
|
||||
.base-skeleton .input-select-optgroup .input-select-option,
|
||||
body .input-select-optgroup .input-select-option,
|
||||
.base-skeleton optgroup .input-select-option,
|
||||
body optgroup .input-select-option,
|
||||
.base-skeleton .input-multiselect-optgroup .input-select-option,
|
||||
body .input-multiselect-optgroup .input-select-option,
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-select-optgroup option,
|
||||
body .input-select-optgroup option,
|
||||
.base-skeleton optgroup option,
|
||||
body optgroup option,
|
||||
.base-skeleton .input-multiselect-optgroup option,
|
||||
body .input-multiselect-optgroup option,
|
||||
.base-skeleton optgroup .input-multiselect-option,
|
||||
body optgroup .input-multiselect-option,
|
||||
.base-skeleton .input-select-optgroup .input-multiselect-option,
|
||||
body .input-select-optgroup .input-multiselect-option,
|
||||
.base-skeleton optgroup .input-multiselect-option,
|
||||
body optgroup .input-multiselect-option,
|
||||
.base-skeleton .input-multiselect-optgroup .input-multiselect-option,
|
||||
body .input-multiselect-optgroup .input-multiselect-option {
|
||||
padding: 4px 20px;
|
||||
}
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-select-optgroup option::before,
|
||||
body .input-select-optgroup option::before,
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-multiselect-optgroup option::before,
|
||||
body .input-multiselect-optgroup option::before,
|
||||
.base-skeleton optgroup .input-select-option::before,
|
||||
body optgroup .input-select-option::before,
|
||||
.base-skeleton .input-select-optgroup .input-select-option::before,
|
||||
body .input-select-optgroup .input-select-option::before,
|
||||
.base-skeleton optgroup .input-select-option::before,
|
||||
body optgroup .input-select-option::before,
|
||||
.base-skeleton .input-multiselect-optgroup .input-select-option::before,
|
||||
body .input-multiselect-optgroup .input-select-option::before,
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-select-optgroup option::before,
|
||||
body .input-select-optgroup option::before,
|
||||
.base-skeleton optgroup option::before,
|
||||
body optgroup option::before,
|
||||
.base-skeleton .input-multiselect-optgroup option::before,
|
||||
body .input-multiselect-optgroup option::before,
|
||||
.base-skeleton optgroup .input-multiselect-option::before,
|
||||
body optgroup .input-multiselect-option::before,
|
||||
.base-skeleton .input-select-optgroup .input-multiselect-option::before,
|
||||
body .input-select-optgroup .input-multiselect-option::before,
|
||||
.base-skeleton optgroup .input-multiselect-option::before,
|
||||
body optgroup .input-multiselect-option::before,
|
||||
.base-skeleton .input-multiselect-optgroup .input-multiselect-option::before,
|
||||
body .input-multiselect-optgroup .input-multiselect-option::before {
|
||||
content: "";
|
||||
}
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-select-optgroup,
|
||||
body .input-select-optgroup,
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-select-option,
|
||||
body .input-select-option,
|
||||
.base-skeleton optgroup,
|
||||
body optgroup,
|
||||
.base-skeleton .input-multiselect-optgroup,
|
||||
body .input-multiselect-optgroup,
|
||||
.base-skeleton option,
|
||||
body option,
|
||||
.base-skeleton .input-multiselect-option,
|
||||
body .input-multiselect-option {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
font-style: inherit;
|
||||
}
|
||||
.base-skeleton .input-field::placeholder,
|
||||
body .input-field::placeholder,
|
||||
.base-skeleton input[type="color"]::placeholder,
|
||||
body input[type="color"]::placeholder,
|
||||
.base-skeleton input[type="date"]::placeholder,
|
||||
body input[type="date"]::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]::placeholder,
|
||||
body input[type="datetime-local"]::placeholder,
|
||||
.base-skeleton input[type="email"]::placeholder,
|
||||
body input[type="email"]::placeholder,
|
||||
.base-skeleton input[type="file"]::placeholder,
|
||||
body input[type="file"]::placeholder,
|
||||
.base-skeleton input[type="image"]::placeholder,
|
||||
body input[type="image"]::placeholder,
|
||||
.base-skeleton input[type="month"]::placeholder,
|
||||
body input[type="month"]::placeholder,
|
||||
.base-skeleton input[type="number"]::placeholder,
|
||||
body input[type="number"]::placeholder,
|
||||
.base-skeleton input[type="password"]::placeholder,
|
||||
body input[type="password"]::placeholder,
|
||||
.base-skeleton input[type="search"]::placeholder,
|
||||
body input[type="search"]::placeholder,
|
||||
.base-skeleton input[type="tel"]::placeholder,
|
||||
body input[type="tel"]::placeholder,
|
||||
.base-skeleton input[type="text"]::placeholder,
|
||||
body input[type="text"]::placeholder,
|
||||
.base-skeleton input[type="time"]::placeholder,
|
||||
body input[type="time"]::placeholder,
|
||||
.base-skeleton input[type="url"]::placeholder,
|
||||
body input[type="url"]::placeholder,
|
||||
.base-skeleton input[type="week"]::placeholder,
|
||||
body input[type="week"]::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
opacity: 1;
|
||||
.base-skeleton select:not([multiple]),
|
||||
body select:not([multiple]),
|
||||
.base-skeleton .input-select,
|
||||
body .input-select {
|
||||
cursor: context-menu;
|
||||
border-width: 0 0 2px 0;
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
.base-skeleton .input-field:optional::placeholder,
|
||||
body .input-field:optional::placeholder,
|
||||
.base-skeleton input[type="color"]:optional::placeholder,
|
||||
body input[type="color"]:optional::placeholder,
|
||||
.base-skeleton input[type="date"]:optional::placeholder,
|
||||
body input[type="date"]:optional::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]:optional::placeholder,
|
||||
body input[type="datetime-local"]:optional::placeholder,
|
||||
.base-skeleton input[type="email"]:optional::placeholder,
|
||||
body input[type="email"]:optional::placeholder,
|
||||
.base-skeleton input[type="file"]:optional::placeholder,
|
||||
body input[type="file"]:optional::placeholder,
|
||||
.base-skeleton input[type="image"]:optional::placeholder,
|
||||
body input[type="image"]:optional::placeholder,
|
||||
.base-skeleton input[type="month"]:optional::placeholder,
|
||||
body input[type="month"]:optional::placeholder,
|
||||
.base-skeleton input[type="number"]:optional::placeholder,
|
||||
body input[type="number"]:optional::placeholder,
|
||||
.base-skeleton input[type="password"]:optional::placeholder,
|
||||
body input[type="password"]:optional::placeholder,
|
||||
.base-skeleton input[type="search"]:optional::placeholder,
|
||||
body input[type="search"]:optional::placeholder,
|
||||
.base-skeleton input[type="tel"]:optional::placeholder,
|
||||
body input[type="tel"]:optional::placeholder,
|
||||
.base-skeleton input[type="text"]:optional::placeholder,
|
||||
body input[type="text"]:optional::placeholder,
|
||||
.base-skeleton input[type="time"]:optional::placeholder,
|
||||
body input[type="time"]:optional::placeholder,
|
||||
.base-skeleton input[type="url"]:optional::placeholder,
|
||||
body input[type="url"]:optional::placeholder,
|
||||
.base-skeleton input[type="week"]:optional::placeholder,
|
||||
body input[type="week"]:optional::placeholder {
|
||||
font-style: italic;
|
||||
@media screen and (-webkit-min-device-pixel-ratio: 0) {
|
||||
.base-skeleton select:not([multiple]) option,
|
||||
body select:not([multiple]) option,
|
||||
.base-skeleton .input-select option,
|
||||
body .input-select option,
|
||||
.base-skeleton select:not([multiple]) .input-select-option,
|
||||
body select:not([multiple]) .input-select-option,
|
||||
.base-skeleton .input-select .input-select-option,
|
||||
body .input-select .input-select-option,
|
||||
.base-skeleton select:not([multiple]) optgroup,
|
||||
body select:not([multiple]) optgroup,
|
||||
.base-skeleton .input-select optgroup,
|
||||
body .input-select optgroup,
|
||||
.base-skeleton select:not([multiple]) .input-select-optgroup,
|
||||
body select:not([multiple]) .input-select-optgroup,
|
||||
.base-skeleton .input-select .input-select-optgroup,
|
||||
body .input-select .input-select-optgroup {
|
||||
background-color: #0d193b;
|
||||
}
|
||||
}
|
||||
.base-skeleton .input-field:invalid:not(:placeholder-shown),
|
||||
body .input-field:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="color"]:invalid:not(:placeholder-shown),
|
||||
body input[type="color"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="date"]:invalid:not(:placeholder-shown),
|
||||
body input[type="date"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="datetime-local"]:invalid:not(:placeholder-shown),
|
||||
body input[type="datetime-local"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="email"]:invalid:not(:placeholder-shown),
|
||||
body input[type="email"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="file"]:invalid:not(:placeholder-shown),
|
||||
body input[type="file"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="image"]:invalid:not(:placeholder-shown),
|
||||
body input[type="image"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="month"]:invalid:not(:placeholder-shown),
|
||||
body input[type="month"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="number"]:invalid:not(:placeholder-shown),
|
||||
body input[type="number"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="password"]:invalid:not(:placeholder-shown),
|
||||
body input[type="password"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="search"]:invalid:not(:placeholder-shown),
|
||||
body input[type="search"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="tel"]:invalid:not(:placeholder-shown),
|
||||
body input[type="tel"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="text"]:invalid:not(:placeholder-shown),
|
||||
body input[type="text"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="time"]:invalid:not(:placeholder-shown),
|
||||
body input[type="time"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="url"]:invalid:not(:placeholder-shown),
|
||||
body input[type="url"]:invalid:not(:placeholder-shown),
|
||||
.base-skeleton input[type="week"]:invalid:not(:placeholder-shown),
|
||||
body input[type="week"]:invalid:not(:placeholder-shown) {
|
||||
--bluelib-color-r: 255;
|
||||
--bluelib-color-g: 125;
|
||||
--bluelib-color-b: 125;
|
||||
}
|
||||
.base-skeleton .input-field:hover,
|
||||
body .input-field:hover,
|
||||
.base-skeleton input[type="color"]:hover,
|
||||
body input[type="color"]:hover,
|
||||
.base-skeleton input[type="date"]:hover,
|
||||
body input[type="date"]:hover,
|
||||
.base-skeleton input[type="datetime-local"]:hover,
|
||||
body input[type="datetime-local"]:hover,
|
||||
.base-skeleton input[type="email"]:hover,
|
||||
body input[type="email"]:hover,
|
||||
.base-skeleton input[type="file"]:hover,
|
||||
body input[type="file"]:hover,
|
||||
.base-skeleton input[type="image"]:hover,
|
||||
body input[type="image"]:hover,
|
||||
.base-skeleton input[type="month"]:hover,
|
||||
body input[type="month"]:hover,
|
||||
.base-skeleton input[type="number"]:hover,
|
||||
body input[type="number"]:hover,
|
||||
.base-skeleton input[type="password"]:hover,
|
||||
body input[type="password"]:hover,
|
||||
.base-skeleton input[type="search"]:hover,
|
||||
body input[type="search"]:hover,
|
||||
.base-skeleton input[type="tel"]:hover,
|
||||
body input[type="tel"]:hover,
|
||||
.base-skeleton input[type="text"]:hover,
|
||||
body input[type="text"]:hover,
|
||||
.base-skeleton input[type="time"]:hover,
|
||||
body input[type="time"]:hover,
|
||||
.base-skeleton input[type="url"]:hover,
|
||||
body input[type="url"]:hover,
|
||||
.base-skeleton input[type="week"]:hover,
|
||||
body input[type="week"]:hover,
|
||||
.base-skeleton .input-field:focus,
|
||||
body .input-field:focus,
|
||||
.base-skeleton input[type="color"]:focus,
|
||||
body input[type="color"]:focus,
|
||||
.base-skeleton input[type="date"]:focus,
|
||||
body input[type="date"]:focus,
|
||||
.base-skeleton input[type="datetime-local"]:focus,
|
||||
body input[type="datetime-local"]:focus,
|
||||
.base-skeleton input[type="email"]:focus,
|
||||
body input[type="email"]:focus,
|
||||
.base-skeleton input[type="file"]:focus,
|
||||
body input[type="file"]:focus,
|
||||
.base-skeleton input[type="image"]:focus,
|
||||
body input[type="image"]:focus,
|
||||
.base-skeleton input[type="month"]:focus,
|
||||
body input[type="month"]:focus,
|
||||
.base-skeleton input[type="number"]:focus,
|
||||
body input[type="number"]:focus,
|
||||
.base-skeleton input[type="password"]:focus,
|
||||
body input[type="password"]:focus,
|
||||
.base-skeleton input[type="search"]:focus,
|
||||
body input[type="search"]:focus,
|
||||
.base-skeleton input[type="tel"]:focus,
|
||||
body input[type="tel"]:focus,
|
||||
.base-skeleton input[type="text"]:focus,
|
||||
body input[type="text"]:focus,
|
||||
.base-skeleton input[type="time"]:focus,
|
||||
body input[type="time"]:focus,
|
||||
.base-skeleton input[type="url"]:focus,
|
||||
body input[type="url"]:focus,
|
||||
.base-skeleton input[type="week"]:focus,
|
||||
body input[type="week"]:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.6);
|
||||
color: rgba(calc(var(--bluelib-color-r) + 50), calc(var(--bluelib-color-g) + 50), calc(var(--bluelib-color-b) + 50), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.1);
|
||||
}
|
||||
.base-skeleton .input-field:hover::placeholder,
|
||||
body .input-field:hover::placeholder,
|
||||
.base-skeleton input[type="color"]:hover::placeholder,
|
||||
body input[type="color"]:hover::placeholder,
|
||||
.base-skeleton input[type="date"]:hover::placeholder,
|
||||
body input[type="date"]:hover::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]:hover::placeholder,
|
||||
body input[type="datetime-local"]:hover::placeholder,
|
||||
.base-skeleton input[type="email"]:hover::placeholder,
|
||||
body input[type="email"]:hover::placeholder,
|
||||
.base-skeleton input[type="file"]:hover::placeholder,
|
||||
body input[type="file"]:hover::placeholder,
|
||||
.base-skeleton input[type="image"]:hover::placeholder,
|
||||
body input[type="image"]:hover::placeholder,
|
||||
.base-skeleton input[type="month"]:hover::placeholder,
|
||||
body input[type="month"]:hover::placeholder,
|
||||
.base-skeleton input[type="number"]:hover::placeholder,
|
||||
body input[type="number"]:hover::placeholder,
|
||||
.base-skeleton input[type="password"]:hover::placeholder,
|
||||
body input[type="password"]:hover::placeholder,
|
||||
.base-skeleton input[type="search"]:hover::placeholder,
|
||||
body input[type="search"]:hover::placeholder,
|
||||
.base-skeleton input[type="tel"]:hover::placeholder,
|
||||
body input[type="tel"]:hover::placeholder,
|
||||
.base-skeleton input[type="text"]:hover::placeholder,
|
||||
body input[type="text"]:hover::placeholder,
|
||||
.base-skeleton input[type="time"]:hover::placeholder,
|
||||
body input[type="time"]:hover::placeholder,
|
||||
.base-skeleton input[type="url"]:hover::placeholder,
|
||||
body input[type="url"]:hover::placeholder,
|
||||
.base-skeleton input[type="week"]:hover::placeholder,
|
||||
body input[type="week"]:hover::placeholder,
|
||||
.base-skeleton .input-field:focus::placeholder,
|
||||
body .input-field:focus::placeholder,
|
||||
.base-skeleton input[type="color"]:focus::placeholder,
|
||||
body input[type="color"]:focus::placeholder,
|
||||
.base-skeleton input[type="date"]:focus::placeholder,
|
||||
body input[type="date"]:focus::placeholder,
|
||||
.base-skeleton input[type="datetime-local"]:focus::placeholder,
|
||||
body input[type="datetime-local"]:focus::placeholder,
|
||||
.base-skeleton input[type="email"]:focus::placeholder,
|
||||
body input[type="email"]:focus::placeholder,
|
||||
.base-skeleton input[type="file"]:focus::placeholder,
|
||||
body input[type="file"]:focus::placeholder,
|
||||
.base-skeleton input[type="image"]:focus::placeholder,
|
||||
body input[type="image"]:focus::placeholder,
|
||||
.base-skeleton input[type="month"]:focus::placeholder,
|
||||
body input[type="month"]:focus::placeholder,
|
||||
.base-skeleton input[type="number"]:focus::placeholder,
|
||||
body input[type="number"]:focus::placeholder,
|
||||
.base-skeleton input[type="password"]:focus::placeholder,
|
||||
body input[type="password"]:focus::placeholder,
|
||||
.base-skeleton input[type="search"]:focus::placeholder,
|
||||
body input[type="search"]:focus::placeholder,
|
||||
.base-skeleton input[type="tel"]:focus::placeholder,
|
||||
body input[type="tel"]:focus::placeholder,
|
||||
.base-skeleton input[type="text"]:focus::placeholder,
|
||||
body input[type="text"]:focus::placeholder,
|
||||
.base-skeleton input[type="time"]:focus::placeholder,
|
||||
body input[type="time"]:focus::placeholder,
|
||||
.base-skeleton input[type="url"]:focus::placeholder,
|
||||
body input[type="url"]:focus::placeholder,
|
||||
.base-skeleton input[type="week"]:focus::placeholder,
|
||||
body input[type="week"]:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.7);
|
||||
}
|
||||
.base-skeleton .input-field[disabled],
|
||||
body .input-field[disabled],
|
||||
.base-skeleton input[type="color"][disabled],
|
||||
body input[type="color"][disabled],
|
||||
.base-skeleton input[type="date"][disabled],
|
||||
body input[type="date"][disabled],
|
||||
.base-skeleton input[type="datetime-local"][disabled],
|
||||
body input[type="datetime-local"][disabled],
|
||||
.base-skeleton input[type="email"][disabled],
|
||||
body input[type="email"][disabled],
|
||||
.base-skeleton input[type="file"][disabled],
|
||||
body input[type="file"][disabled],
|
||||
.base-skeleton input[type="image"][disabled],
|
||||
body input[type="image"][disabled],
|
||||
.base-skeleton input[type="month"][disabled],
|
||||
body input[type="month"][disabled],
|
||||
.base-skeleton input[type="number"][disabled],
|
||||
body input[type="number"][disabled],
|
||||
.base-skeleton input[type="password"][disabled],
|
||||
body input[type="password"][disabled],
|
||||
.base-skeleton input[type="search"][disabled],
|
||||
body input[type="search"][disabled],
|
||||
.base-skeleton input[type="tel"][disabled],
|
||||
body input[type="tel"][disabled],
|
||||
.base-skeleton input[type="text"][disabled],
|
||||
body input[type="text"][disabled],
|
||||
.base-skeleton input[type="time"][disabled],
|
||||
body input[type="time"][disabled],
|
||||
.base-skeleton input[type="url"][disabled],
|
||||
body input[type="url"][disabled],
|
||||
.base-skeleton input[type="week"][disabled],
|
||||
body input[type="week"][disabled],
|
||||
.base-skeleton .input-field .status-disabled,
|
||||
body .input-field .status-disabled,
|
||||
.base-skeleton input[type="color"] .status-disabled,
|
||||
body input[type="color"] .status-disabled,
|
||||
.base-skeleton input[type="date"] .status-disabled,
|
||||
body input[type="date"] .status-disabled,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled,
|
||||
body input[type="datetime-local"] .status-disabled,
|
||||
.base-skeleton input[type="email"] .status-disabled,
|
||||
body input[type="email"] .status-disabled,
|
||||
.base-skeleton input[type="file"] .status-disabled,
|
||||
body input[type="file"] .status-disabled,
|
||||
.base-skeleton input[type="image"] .status-disabled,
|
||||
body input[type="image"] .status-disabled,
|
||||
.base-skeleton input[type="month"] .status-disabled,
|
||||
body input[type="month"] .status-disabled,
|
||||
.base-skeleton input[type="number"] .status-disabled,
|
||||
body input[type="number"] .status-disabled,
|
||||
.base-skeleton input[type="password"] .status-disabled,
|
||||
body input[type="password"] .status-disabled,
|
||||
.base-skeleton input[type="search"] .status-disabled,
|
||||
body input[type="search"] .status-disabled,
|
||||
.base-skeleton input[type="tel"] .status-disabled,
|
||||
body input[type="tel"] .status-disabled,
|
||||
.base-skeleton input[type="text"] .status-disabled,
|
||||
body input[type="text"] .status-disabled,
|
||||
.base-skeleton input[type="time"] .status-disabled,
|
||||
body input[type="time"] .status-disabled,
|
||||
.base-skeleton input[type="url"] .status-disabled,
|
||||
body input[type="url"] .status-disabled,
|
||||
.base-skeleton input[type="week"] .status-disabled,
|
||||
body input[type="week"] .status-disabled {
|
||||
border-style: dashed;
|
||||
}
|
||||
.base-skeleton .input-field[disabled]:hover,
|
||||
body .input-field[disabled]:hover,
|
||||
.base-skeleton input[type="color"][disabled]:hover,
|
||||
body input[type="color"][disabled]:hover,
|
||||
.base-skeleton input[type="date"][disabled]:hover,
|
||||
body input[type="date"][disabled]:hover,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:hover,
|
||||
body input[type="datetime-local"][disabled]:hover,
|
||||
.base-skeleton input[type="email"][disabled]:hover,
|
||||
body input[type="email"][disabled]:hover,
|
||||
.base-skeleton input[type="file"][disabled]:hover,
|
||||
body input[type="file"][disabled]:hover,
|
||||
.base-skeleton input[type="image"][disabled]:hover,
|
||||
body input[type="image"][disabled]:hover,
|
||||
.base-skeleton input[type="month"][disabled]:hover,
|
||||
body input[type="month"][disabled]:hover,
|
||||
.base-skeleton input[type="number"][disabled]:hover,
|
||||
body input[type="number"][disabled]:hover,
|
||||
.base-skeleton input[type="password"][disabled]:hover,
|
||||
body input[type="password"][disabled]:hover,
|
||||
.base-skeleton input[type="search"][disabled]:hover,
|
||||
body input[type="search"][disabled]:hover,
|
||||
.base-skeleton input[type="tel"][disabled]:hover,
|
||||
body input[type="tel"][disabled]:hover,
|
||||
.base-skeleton input[type="text"][disabled]:hover,
|
||||
body input[type="text"][disabled]:hover,
|
||||
.base-skeleton input[type="time"][disabled]:hover,
|
||||
body input[type="time"][disabled]:hover,
|
||||
.base-skeleton input[type="url"][disabled]:hover,
|
||||
body input[type="url"][disabled]:hover,
|
||||
.base-skeleton input[type="week"][disabled]:hover,
|
||||
body input[type="week"][disabled]:hover,
|
||||
.base-skeleton .input-field .status-disabled:hover,
|
||||
body .input-field .status-disabled:hover,
|
||||
.base-skeleton input[type="color"] .status-disabled:hover,
|
||||
body input[type="color"] .status-disabled:hover,
|
||||
.base-skeleton input[type="date"] .status-disabled:hover,
|
||||
body input[type="date"] .status-disabled:hover,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:hover,
|
||||
body input[type="datetime-local"] .status-disabled:hover,
|
||||
.base-skeleton input[type="email"] .status-disabled:hover,
|
||||
body input[type="email"] .status-disabled:hover,
|
||||
.base-skeleton input[type="file"] .status-disabled:hover,
|
||||
body input[type="file"] .status-disabled:hover,
|
||||
.base-skeleton input[type="image"] .status-disabled:hover,
|
||||
body input[type="image"] .status-disabled:hover,
|
||||
.base-skeleton input[type="month"] .status-disabled:hover,
|
||||
body input[type="month"] .status-disabled:hover,
|
||||
.base-skeleton input[type="number"] .status-disabled:hover,
|
||||
body input[type="number"] .status-disabled:hover,
|
||||
.base-skeleton input[type="password"] .status-disabled:hover,
|
||||
body input[type="password"] .status-disabled:hover,
|
||||
.base-skeleton input[type="search"] .status-disabled:hover,
|
||||
body input[type="search"] .status-disabled:hover,
|
||||
.base-skeleton input[type="tel"] .status-disabled:hover,
|
||||
body input[type="tel"] .status-disabled:hover,
|
||||
.base-skeleton input[type="text"] .status-disabled:hover,
|
||||
body input[type="text"] .status-disabled:hover,
|
||||
.base-skeleton input[type="time"] .status-disabled:hover,
|
||||
body input[type="time"] .status-disabled:hover,
|
||||
.base-skeleton input[type="url"] .status-disabled:hover,
|
||||
body input[type="url"] .status-disabled:hover,
|
||||
.base-skeleton input[type="week"] .status-disabled:hover,
|
||||
body input[type="week"] .status-disabled:hover,
|
||||
.base-skeleton .input-field[disabled]:focus,
|
||||
body .input-field[disabled]:focus,
|
||||
.base-skeleton input[type="color"][disabled]:focus,
|
||||
body input[type="color"][disabled]:focus,
|
||||
.base-skeleton input[type="date"][disabled]:focus,
|
||||
body input[type="date"][disabled]:focus,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:focus,
|
||||
body input[type="datetime-local"][disabled]:focus,
|
||||
.base-skeleton input[type="email"][disabled]:focus,
|
||||
body input[type="email"][disabled]:focus,
|
||||
.base-skeleton input[type="file"][disabled]:focus,
|
||||
body input[type="file"][disabled]:focus,
|
||||
.base-skeleton input[type="image"][disabled]:focus,
|
||||
body input[type="image"][disabled]:focus,
|
||||
.base-skeleton input[type="month"][disabled]:focus,
|
||||
body input[type="month"][disabled]:focus,
|
||||
.base-skeleton input[type="number"][disabled]:focus,
|
||||
body input[type="number"][disabled]:focus,
|
||||
.base-skeleton input[type="password"][disabled]:focus,
|
||||
body input[type="password"][disabled]:focus,
|
||||
.base-skeleton input[type="search"][disabled]:focus,
|
||||
body input[type="search"][disabled]:focus,
|
||||
.base-skeleton input[type="tel"][disabled]:focus,
|
||||
body input[type="tel"][disabled]:focus,
|
||||
.base-skeleton input[type="text"][disabled]:focus,
|
||||
body input[type="text"][disabled]:focus,
|
||||
.base-skeleton input[type="time"][disabled]:focus,
|
||||
body input[type="time"][disabled]:focus,
|
||||
.base-skeleton input[type="url"][disabled]:focus,
|
||||
body input[type="url"][disabled]:focus,
|
||||
.base-skeleton input[type="week"][disabled]:focus,
|
||||
body input[type="week"][disabled]:focus,
|
||||
.base-skeleton .input-field .status-disabled:focus,
|
||||
body .input-field .status-disabled:focus,
|
||||
.base-skeleton input[type="color"] .status-disabled:focus,
|
||||
body input[type="color"] .status-disabled:focus,
|
||||
.base-skeleton input[type="date"] .status-disabled:focus,
|
||||
body input[type="date"] .status-disabled:focus,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:focus,
|
||||
body input[type="datetime-local"] .status-disabled:focus,
|
||||
.base-skeleton input[type="email"] .status-disabled:focus,
|
||||
body input[type="email"] .status-disabled:focus,
|
||||
.base-skeleton input[type="file"] .status-disabled:focus,
|
||||
body input[type="file"] .status-disabled:focus,
|
||||
.base-skeleton input[type="image"] .status-disabled:focus,
|
||||
body input[type="image"] .status-disabled:focus,
|
||||
.base-skeleton input[type="month"] .status-disabled:focus,
|
||||
body input[type="month"] .status-disabled:focus,
|
||||
.base-skeleton input[type="number"] .status-disabled:focus,
|
||||
body input[type="number"] .status-disabled:focus,
|
||||
.base-skeleton input[type="password"] .status-disabled:focus,
|
||||
body input[type="password"] .status-disabled:focus,
|
||||
.base-skeleton input[type="search"] .status-disabled:focus,
|
||||
body input[type="search"] .status-disabled:focus,
|
||||
.base-skeleton input[type="tel"] .status-disabled:focus,
|
||||
body input[type="tel"] .status-disabled:focus,
|
||||
.base-skeleton input[type="text"] .status-disabled:focus,
|
||||
body input[type="text"] .status-disabled:focus,
|
||||
.base-skeleton input[type="time"] .status-disabled:focus,
|
||||
body input[type="time"] .status-disabled:focus,
|
||||
.base-skeleton input[type="url"] .status-disabled:focus,
|
||||
body input[type="url"] .status-disabled:focus,
|
||||
.base-skeleton input[type="week"] .status-disabled:focus,
|
||||
body input[type="week"] .status-disabled:focus {
|
||||
border-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.3);
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 1);
|
||||
background-color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.025);
|
||||
}
|
||||
.base-skeleton .input-field[disabled]:hover::placeholder,
|
||||
body .input-field[disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="color"][disabled]:hover::placeholder,
|
||||
body input[type="color"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="date"][disabled]:hover::placeholder,
|
||||
body input[type="date"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:hover::placeholder,
|
||||
body input[type="datetime-local"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="email"][disabled]:hover::placeholder,
|
||||
body input[type="email"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="file"][disabled]:hover::placeholder,
|
||||
body input[type="file"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="image"][disabled]:hover::placeholder,
|
||||
body input[type="image"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="month"][disabled]:hover::placeholder,
|
||||
body input[type="month"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="number"][disabled]:hover::placeholder,
|
||||
body input[type="number"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="password"][disabled]:hover::placeholder,
|
||||
body input[type="password"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="search"][disabled]:hover::placeholder,
|
||||
body input[type="search"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="tel"][disabled]:hover::placeholder,
|
||||
body input[type="tel"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="text"][disabled]:hover::placeholder,
|
||||
body input[type="text"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="time"][disabled]:hover::placeholder,
|
||||
body input[type="time"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="url"][disabled]:hover::placeholder,
|
||||
body input[type="url"][disabled]:hover::placeholder,
|
||||
.base-skeleton input[type="week"][disabled]:hover::placeholder,
|
||||
body input[type="week"][disabled]:hover::placeholder,
|
||||
.base-skeleton .input-field .status-disabled:hover::placeholder,
|
||||
body .input-field .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="color"] .status-disabled:hover::placeholder,
|
||||
body input[type="color"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="date"] .status-disabled:hover::placeholder,
|
||||
body input[type="date"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:hover::placeholder,
|
||||
body input[type="datetime-local"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="email"] .status-disabled:hover::placeholder,
|
||||
body input[type="email"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="file"] .status-disabled:hover::placeholder,
|
||||
body input[type="file"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="image"] .status-disabled:hover::placeholder,
|
||||
body input[type="image"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="month"] .status-disabled:hover::placeholder,
|
||||
body input[type="month"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="number"] .status-disabled:hover::placeholder,
|
||||
body input[type="number"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="password"] .status-disabled:hover::placeholder,
|
||||
body input[type="password"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="search"] .status-disabled:hover::placeholder,
|
||||
body input[type="search"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="tel"] .status-disabled:hover::placeholder,
|
||||
body input[type="tel"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="text"] .status-disabled:hover::placeholder,
|
||||
body input[type="text"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="time"] .status-disabled:hover::placeholder,
|
||||
body input[type="time"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="url"] .status-disabled:hover::placeholder,
|
||||
body input[type="url"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton input[type="week"] .status-disabled:hover::placeholder,
|
||||
body input[type="week"] .status-disabled:hover::placeholder,
|
||||
.base-skeleton .input-field[disabled]:focus::placeholder,
|
||||
body .input-field[disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="color"][disabled]:focus::placeholder,
|
||||
body input[type="color"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="date"][disabled]:focus::placeholder,
|
||||
body input[type="date"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="datetime-local"][disabled]:focus::placeholder,
|
||||
body input[type="datetime-local"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="email"][disabled]:focus::placeholder,
|
||||
body input[type="email"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="file"][disabled]:focus::placeholder,
|
||||
body input[type="file"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="image"][disabled]:focus::placeholder,
|
||||
body input[type="image"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="month"][disabled]:focus::placeholder,
|
||||
body input[type="month"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="number"][disabled]:focus::placeholder,
|
||||
body input[type="number"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="password"][disabled]:focus::placeholder,
|
||||
body input[type="password"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="search"][disabled]:focus::placeholder,
|
||||
body input[type="search"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="tel"][disabled]:focus::placeholder,
|
||||
body input[type="tel"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="text"][disabled]:focus::placeholder,
|
||||
body input[type="text"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="time"][disabled]:focus::placeholder,
|
||||
body input[type="time"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="url"][disabled]:focus::placeholder,
|
||||
body input[type="url"][disabled]:focus::placeholder,
|
||||
.base-skeleton input[type="week"][disabled]:focus::placeholder,
|
||||
body input[type="week"][disabled]:focus::placeholder,
|
||||
.base-skeleton .input-field .status-disabled:focus::placeholder,
|
||||
body .input-field .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="color"] .status-disabled:focus::placeholder,
|
||||
body input[type="color"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="date"] .status-disabled:focus::placeholder,
|
||||
body input[type="date"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="datetime-local"] .status-disabled:focus::placeholder,
|
||||
body input[type="datetime-local"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="email"] .status-disabled:focus::placeholder,
|
||||
body input[type="email"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="file"] .status-disabled:focus::placeholder,
|
||||
body input[type="file"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="image"] .status-disabled:focus::placeholder,
|
||||
body input[type="image"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="month"] .status-disabled:focus::placeholder,
|
||||
body input[type="month"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="number"] .status-disabled:focus::placeholder,
|
||||
body input[type="number"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="password"] .status-disabled:focus::placeholder,
|
||||
body input[type="password"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="search"] .status-disabled:focus::placeholder,
|
||||
body input[type="search"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="tel"] .status-disabled:focus::placeholder,
|
||||
body input[type="tel"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="text"] .status-disabled:focus::placeholder,
|
||||
body input[type="text"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="time"] .status-disabled:focus::placeholder,
|
||||
body input[type="time"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="url"] .status-disabled:focus::placeholder,
|
||||
body input[type="url"] .status-disabled:focus::placeholder,
|
||||
.base-skeleton input[type="week"] .status-disabled:focus::placeholder,
|
||||
body input[type="week"] .status-disabled:focus::placeholder {
|
||||
color: rgba(var(--bluelib-color-r), var(--bluelib-color-g), var(--bluelib-color-b), 0.4);
|
||||
.base-skeleton select[multiple],
|
||||
body select[multiple],
|
||||
.base-skeleton .input-multiselect,
|
||||
body .input-multiselect {
|
||||
cursor: vertical-text;
|
||||
border-width: 0 0 0 2px;
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
.base-skeleton [title],
|
||||
body [title],
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -22,8 +22,14 @@
|
|||
@button-toggle: ~'.button-toggle';
|
||||
@button-toggle-off: ~'.button-toggle-off';
|
||||
@button-toggle-on: ~'.button-toggle-on';
|
||||
@input: ~'.input';
|
||||
@input-field: ~'.input-field';
|
||||
@input-select: ~'.input-select';
|
||||
@input-select-optgroup: ~'.input-select-optgroup';
|
||||
@input-select-option: ~'.input-select-option';
|
||||
@input-multiselect: ~'.input-multiselect';
|
||||
@input-multiselect-optgroup: ~'.input-multiselect-optgroup';
|
||||
@input-multiselect-option: ~'.input-multiselect-option';
|
||||
@spoiler: ~".spoiler";
|
||||
@element-title: ~".element-title";
|
||||
@element-paragraph: ~".element-paragraph";
|
||||
|
|
|
|||
|
|
@ -22,8 +22,14 @@
|
|||
@button-toggle: ~'.button-toggle';
|
||||
@button-toggle-off: ~'.button-toggle-off';
|
||||
@button-toggle-on: ~'.button-toggle-on';
|
||||
@input: ~'.input, input, select';
|
||||
@input-field: ~'.input-field, input[type="color"], input[type="date"], input[type="datetime-local"], input[type="email"], input[type="file"], input[type="image"], input[type="month"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="time"], input[type="url"], input[type="week"]';
|
||||
@input-select: ~'select, .input-select';
|
||||
@input-select: ~'select:not([multiple]), .input-select';
|
||||
@input-select-optgroup: ~'optgroup, .input-select-optgroup';
|
||||
@input-select-option: ~'option, .input-select-option';
|
||||
@input-multiselect: ~'select[multiple], .input-multiselect';
|
||||
@input-multiselect-optgroup: ~'optgroup, .input-multiselect-optgroup';
|
||||
@input-multiselect-option: ~'option, .input-multiselect-option';
|
||||
@spoiler: ~".spoiler";
|
||||
@element-title: ~".element-title, h1, h2, h3, h4, h5, h6";
|
||||
@element-paragraph: ~".element-paragraph, p";
|
||||
|
|
|
|||
Loading…
Reference in a new issue