diff options
| author | Ubuntu <github@matdoes.dev> | 2022-02-14 16:33:38 +0000 |
|---|---|---|
| committer | Ubuntu <github@matdoes.dev> | 2022-02-14 16:33:38 +0000 |
| commit | 9f28b6d9160fee5eff92d1d9849191f2f12faeab (patch) | |
| tree | 4ae0ce31df50b0d34a240da1be9bdfa0d4bb6a66 /src/app.css | |
| download | skyblock-stats-9f28b6d9160fee5eff92d1d9849191f2f12faeab.tar.gz skyblock-stats-9f28b6d9160fee5eff92d1d9849191f2f12faeab.tar.bz2 skyblock-stats-9f28b6d9160fee5eff92d1d9849191f2f12faeab.zip | |
Initial commit
Diffstat (limited to 'src/app.css')
| -rw-r--r-- | src/app.css | 107 |
1 files changed, 107 insertions, 0 deletions
diff --git a/src/app.css b/src/app.css new file mode 100644 index 0000000..77bf6af --- /dev/null +++ b/src/app.css @@ -0,0 +1,107 @@ +@import '@fontsource/fira-mono'; + +:root { + font-family: Arial, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, + Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + --font-mono: 'Fira Mono', monospace; + --pure-white: #ffffff; + --primary-color: #b9c6d2; + --secondary-color: #d0dde9; + --tertiary-color: #edf0f8; + --accent-color: #ff3e00; + --heading-color: rgba(0, 0, 0, 0.7); + --text-color: #444444; + --background-without-opacity: rgba(255, 255, 255, 0.7); + --column-width: 42rem; + --column-margin-top: 4rem; +} + +body { + min-height: 100vh; + margin: 0; + background-color: var(--primary-color); + background: linear-gradient( + 180deg, + var(--primary-color) 0%, + var(--secondary-color) 10.45%, + var(--tertiary-color) 41.35% + ); +} + +body::before { + content: ''; + width: 80vw; + height: 100vh; + position: absolute; + top: 0; + left: 10vw; + z-index: -1; + background: radial-gradient( + 50% 50% at 50% 50%, + var(--pure-white) 0%, + rgba(255, 255, 255, 0) 100% + ); + opacity: 0.05; +} + +#svelte { + min-height: 100vh; + display: flex; + flex-direction: column; +} + +h1, +h2, +p { + font-weight: 400; + color: var(--heading-color); +} + +p { + line-height: 1.5; +} + +a { + color: var(--accent-color); + text-decoration: none; +} + +a:hover { + text-decoration: underline; +} + +h1 { + font-size: 2rem; + text-align: center; +} + +h2 { + font-size: 1rem; +} + +pre { + font-size: 16px; + font-family: var(--font-mono); + background-color: rgba(255, 255, 255, 0.45); + border-radius: 3px; + box-shadow: 2px 2px 6px rgb(255 255 255 / 25%); + padding: 0.5em; + overflow-x: auto; + color: var(--text-color); +} + +input, +button { + font-size: inherit; + font-family: inherit; +} + +button:focus:not(:focus-visible) { + outline: none; +} + +@media (min-width: 720px) { + h1 { + font-size: 2.4rem; + } +} |
