diff options
| author | Fuwn <[email protected]> | 2024-10-09 00:41:20 -0700 |
|---|---|---|
| committer | Fuwn <[email protected]> | 2024-10-09 00:41:43 -0700 |
| commit | 998b63a35256ac985a5a2714dd1ca451af4dfd8a (patch) | |
| tree | 50796121a9d5ab0330fdc5d7e098bda2860d9726 /src/styles/input.css | |
| parent | feat(graphql): add badgeCount field (diff) | |
| download | due.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.css | 150 |
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; } |