diff options
Diffstat (limited to 'src/layouts/Layout.astro')
| -rw-r--r-- | src/layouts/Layout.astro | 161 |
1 files changed, 80 insertions, 81 deletions
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index bed38f4..9c1584c 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,6 +1,6 @@ --- interface Props { - title: string; + title: string; } const { title } = Astro.props; @@ -8,97 +8,96 @@ const { title } = Astro.props; <!doctype html> <html lang="en"> - <head> - <meta charset="UTF-8" /> - <meta name="description" content="Astro description" /> - <meta name="viewport" content="width=device-width" /> - <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> - <meta name="generator" content={Astro.generator} /> - <title>{title}</title> - </head> - <body> - <slot /> - </body> + <head> + <meta charset="UTF-8" /> + <meta name="description" content="Astro description" /> + <meta name="viewport" content="width=device-width" /> + <link rel="icon" type="image/svg+xml" href="/favicon.svg" /> + <meta name="generator" content={Astro.generator} /> + <title>{title}</title> + </head> + <body> + <slot /> + </body> </html> <style is:global> -@import url("../styles/JetBrainsMono.css"); + @import url("../styles/JetBrainsMono.css"); -:root { - --primary: #ffbf00; - --secondary: #9b7eca; - --accent: #7ed4fb; - --extra: #8fcc75; - --text: #ffffff; - --alt: #999999; - --background: #000000; -} + :root { + --primary: #ffbf00; + --secondary: #9b7eca; + --accent: #7ed4fb; + --extra: #8fcc75; + --text: #ffffff; + --alt: #999999; + --background: #000000; + } -* { - margin: 0; - padding: 0; -} + * { + margin: 0; + padding: 0; + } -html { - background-color: var(--background); - color: var(--text); - font-family: "Jetbrains Mono", monospace; - user-select: none; -} + html { + background-color: var(--background); + color: var(--text); + font-family: "Jetbrains Mono", monospace; + user-select: none; + } -body { - overflow-y: scroll; - zoom: 1; -} -@media screen and (max-width: 768px) { body { - zoom: 0.8; + overflow-y: scroll; + zoom: 1; } -} -@media screen and (max-width: 480px) { - body { - zoom: 0.7; + @media screen and (max-width: 768px) { + body { + zoom: 0.8; + } + } + @media screen and (max-width: 480px) { + body { + zoom: 0.7; + } } -} - -main { - display: grid; - position: absolute; - top: 50%; - left: 50%; - grid-template-columns: minmax(200px, 1fr); - transform: translate(-50%, -50%); - border: 1px; - border-style: solid; - background: var(--background); - padding: 1.75rem; - width: 55rem; - max-width: 75%; - /* ! font-weight: 300; */ -} -h1, -h2, -h3 { - font-size: 1rem; - font-weight: bold; -} + main { + display: grid; + position: absolute; + top: 50%; + left: 50%; + grid-template-columns: minmax(200px, 1fr); + transform: translate(-50%, -50%); + border: 1px; + border-style: solid; + background: var(--background); + padding: 1.75rem; + width: 55rem; + max-width: 75%; + padding-top: 1.25rem; + } -a { - font-weight: 300; -} -a:link, -a:visited, -a:active { - background-color: transparent; - text-decoration: none; - color: var(--secondary); -} -a:hover { - transition-duration: 0.2s; - transition-property: color, text-decoration; - text-decoration: underline; - color: var(--accent); -} + h1, + h2, + h3 { + font-size: 1rem; + font-weight: bold; + } + a { + font-weight: 300; + } + a:link, + a:visited, + a:active { + background-color: transparent; + text-decoration: none; + color: var(--secondary); + } + a:hover { + transition-duration: 0.2s; + transition-property: color, text-decoration; + text-decoration: underline; + color: var(--accent); + } </style> |