aboutsummaryrefslogtreecommitdiff
path: root/src/styles/input.css
diff options
context:
space:
mode:
authorFuwn <[email protected]>2024-10-09 00:41:20 -0700
committerFuwn <[email protected]>2024-10-09 00:41:43 -0700
commit998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch)
tree50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/styles/input.css
parentfeat(graphql): add badgeCount field (diff)
downloaddue.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.tar.xz
due.moe-998b63a35256ac985a5a2714dd1ca451af4dfd8a.zip
chore(prettier): use spaces instead of tabs
Diffstat (limited to 'src/styles/input.css')
-rw-r--r--src/styles/input.css150
1 files changed, 75 insertions, 75 deletions
diff --git a/src/styles/input.css b/src/styles/input.css
index a78a4cbf..125f214f 100644
--- a/src/styles/input.css
+++ b/src/styles/input.css
@@ -1,51 +1,51 @@
input,
select,
textarea {
- cursor: pointer;
- position: relative;
- background-color: var(--base01);
- /* margin: 0; */
- /* width: 1.15em;
+ cursor: pointer;
+ position: relative;
+ background-color: var(--base01);
+ /* margin: 0; */
+ /* width: 1.15em;
height: 1.15em; */
- padding: 0.25em;
- border: none;
- border-radius: 4px;
- place-content: center;
- transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
- /* box-shadow: 0 4px 30px var(--base01); */
- box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
+ padding: 0.25em;
+ border: none;
+ border-radius: 4px;
+ place-content: center;
+ transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
+ /* box-shadow: 0 4px 30px var(--base01); */
+ box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
}
input,
select,
textarea,
button {
- vertical-align: middle;
- transform: translateY(-0.125em);
- margin-top: 0.25em;
+ vertical-align: middle;
+ transform: translateY(-0.125em);
+ margin-top: 0.25em;
}
@media (prefers-color-scheme: dark) {
- input,
- select,
- textarea {
- background-color: var(--base07);
- /* color: var(--base05); */
- }
+ input,
+ select,
+ textarea {
+ background-color: var(--base07);
+ /* color: var(--base05); */
+ }
- input[type='number']::-webkit-inner-spin-button,
- input[type='number']::-webkit-outer-spin-button {
- -webkit-appearance: none;
- margin: 0;
- }
+ input[type='number']::-webkit-inner-spin-button,
+ input[type='number']::-webkit-outer-spin-button {
+ -webkit-appearance: none;
+ margin: 0;
+ }
- input[type='number'] {
- appearance: textfield;
- }
+ input[type='number'] {
+ appearance: textfield;
+ }
- input[type='file'] {
- color: var(--base02);
- }
+ input[type='file'] {
+ color: var(--base02);
+ }
}
input[type='text'],
@@ -54,118 +54,118 @@ input[type='date'],
input[type='time'],
input[type='file'],
button {
- padding: 0.25em 0.5em;
+ padding: 0.25em 0.5em;
}
input,
button,
select {
- height: 2em;
+ height: 2em;
}
select {
- padding: 0.25em 0.5em;
+ padding: 0.25em 0.5em;
}
input[type='checkbox'] {
- -webkit-appearance: none;
- appearance: none;
- margin: 0;
- width: 1.15em;
- height: 1.15em;
- transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
+ -webkit-appearance: none;
+ appearance: none;
+ margin: 0;
+ width: 1.15em;
+ height: 1.15em;
+ transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
}
input[type='checkbox']:checked {
- background-color: var(--base0C);
+ background-color: var(--base0C);
}
input[type='checkbox']:checked:before {
- position: absolute;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
}
input[type='checkbox']:active {
- transform: scale(1);
- transition: transform 0.15s ease-in-out;
+ transform: scale(1);
+ transition: transform 0.15s ease-in-out;
}
input[type='checkbox']:hover {
- background-color: var(--base0A);
+ background-color: var(--base0A);
}
button {
- cursor: pointer;
- position: relative;
- background-color: var(--base0C);
- color: var(--base00);
- border: none;
- border-radius: 4px;
- transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
- /* box-shadow: 0 4px 30px var(--base01); */
- box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
+ cursor: pointer;
+ position: relative;
+ background-color: var(--base0C);
+ color: var(--base00);
+ border: none;
+ border-radius: 4px;
+ transition: background-color 0.15s ease-in-out, transform 0.15s ease-in-out;
+ /* box-shadow: 0 4px 30px var(--base01); */
+ box-shadow: rgba(0, 0, 11, 0.1) 0px 7px 29px 0px;
}
button:hover {
- background-color: var(--base0A);
+ background-color: var(--base0A);
}
button:active {
- transform: scale(0.975);
+ transform: scale(0.975);
}
input:disabled,
select:disabled,
button:disabled {
- cursor: not-allowed;
- opacity: 0.5;
+ cursor: not-allowed;
+ opacity: 0.5;
}
input:disabled:hover,
select:disabled:hover,
button:disabled:hover {
- background-color: var(--base0C);
+ background-color: var(--base0C);
}
input:disabled:active,
select:disabled:active,
button:disabled:active {
- transform: scale(1);
+ transform: scale(1);
}
.small-button {
- transform: scale(0.875);
+ transform: scale(0.875);
}
.small-button:active {
- transform: scale(0.75);
+ transform: scale(0.75);
}
.unclickable-button {
- transform: scale(1);
+ transform: scale(1);
}
.unclickable-button:active {
- transform: scale(1) !important;
+ transform: scale(1) !important;
}
.smaller-button {
- background-color: var(--base0C);
- transform: scale(0.75);
+ background-color: var(--base0C);
+ transform: scale(0.75);
}
.button-square {
- background-color: var(--base0C);
- transform: scale(0.75);
- padding: 0.125em 0.575em;
+ background-color: var(--base0C);
+ transform: scale(0.75);
+ padding: 0.125em 0.575em;
}
.button-action {
- background-color: var(--base0E);
+ background-color: var(--base0E);
}
.no-shadow {
- box-shadow: none;
+ box-shadow: none;
}