diff --git a/src/pages/submit.astro b/src/pages/submit.astro index 4726280..734ab19 100644 --- a/src/pages/submit.astro +++ b/src/pages/submit.astro @@ -10,31 +10,29 @@ import BaseLayout from '../layouts/BaseLayout.astro';

If you work in the tech industry and own a cat that you'd like to share, then you've come to the right place! Fill out the form below and Mac should add your feline friend.

-
+

Guidelines

@@ -96,6 +94,7 @@ import BaseLayout from '../layouts/BaseLayout.astro'; a { text-decoration: underline; + color: var(--bg-color); } form { @@ -105,13 +104,22 @@ import BaseLayout from '../layouts/BaseLayout.astro'; gap: 1.25rem; } + input, + textarea { + border-color: var(--color-grey); + background-color: transparent; + color: var(--font-color); + } + button[type='submit'] { margin-top: 0.5rem; + color: var(--bg-color); } #guidelines { padding: 0.05rem 1rem 0.5rem 2rem; padding-top: 0.05rem; margin-bottom: 1.5rem; + color: var(--bg-color); } diff --git a/src/styles/global.css b/src/styles/global.css index e023383..1b4df8a 100644 --- a/src/styles/global.css +++ b/src/styles/global.css @@ -3,11 +3,30 @@ --grid-max-width: 100rem; } -body { - margin: 0 auto; - max-width: min(var(--grid-max-width), 75%); +body.dark { + --bg-color: #000; + --color-primary: #26b670; + --bg-secondary-color: #131316; + --font-color: #f5f5f5; + --color-grey: #ccc; + --color-darkGrey: #777; } -a:focus { +body { + margin: 0 auto; + max-width: min(var(--grid-max-width), 80%); +} + +a:focus, +button:focus { outline: var(--color-primary) solid 3px; } + +@media screen and (min-width: 768px) and (max-width: 1024px) { + .col-6-md { + -webkit-box-flex: 0; + -ms-flex: 0 0 calc(50% - var(--grid-gutter)); + flex: 0 0 calc(50% - var(--grid-gutter)); + max-width: calc(50% - var(--grid-gutter)); + } +}