diff options
Diffstat (limited to 'js/seed/style.css')
-rw-r--r-- | js/seed/style.css | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/js/seed/style.css b/js/seed/style.css new file mode 100644 index 0000000..da35a7a --- /dev/null +++ b/js/seed/style.css @@ -0,0 +1,82 @@ +body { + --color-bg: #f8f8ff; + --color-text: #222; + --color-main-bg: #fff; + --color-main-border: #222; + --color-shadow: #0001; + --color-label: #222; + --color-input-border: #222; + --color-button-bg: #222; + --color-button-text: #fff; + --color-button-disabled-bg: #888; + --color-result-border: #aaa; + --color-result-bg: #f6f6fa; + --color-error: #b30000; + + font-family: system-ui, sans-serif; + background: var(--color-bg); + color: var(--color-text); + margin: 0; + padding: 0; +} +main { + max-width: 400px; + margin: 3rem auto; + background: var(--color-main-bg); + border: 2px solid var(--color-main-border); + border-radius: 8px; + padding: 2rem 1.5rem; + box-shadow: 0 2px 8px var(--color-shadow); +} +label { + font-weight: bold; + text-transform: uppercase; + font-size: 0.98em; + margin-bottom: 0.2em; + display: block; + color: var(--color-label); +} +input[type="text"] { + width: 100%; + padding: 0.6em; + font-size: 1em; + border: 2px solid var(--color-input-border); + border-radius: 0.2em; + margin-bottom: 1em; + box-sizing: border-box; +} +button { + background: var(--color-button-bg); + color: var(--color-button-text); + border: none; + border-radius: 0.2em; + padding: 0.6em 1.2em; + font-weight: bold; + text-transform: uppercase; + cursor: pointer; + font-size: 1em; + margin-bottom: 1em; +} +button:disabled { + background: var(--color-button-disabled-bg); + cursor: not-allowed; +} +.result { + margin-top: 1.5em; + padding: 1em; + border: 1.5px solid var(--color-result-border); + border-radius: 0.3em; + background: var(--color-result-bg); +} +.pokemon-sprite { + width: 120px; + height: 120px; + object-fit: contain; + margin: 0 auto; + display: block; +} +.error { + color: var(--color-error); + font-weight: bold; + margin-top: 1em; +} \ No newline at end of file |