From 08ea2c4afb0460a50fbbfa6b12c611d9433d7af8 Mon Sep 17 00:00:00 2001
From: Steven Bister <stevebister@gmail.com>
Date: Tue, 19 Mar 2024 18:50:18 +0000
Subject: [PATCH 1/3] feat: add header component

---
 src/components/Header/Header.svelte | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)
 create mode 100644 src/components/Header/Header.svelte

diff --git a/src/components/Header/Header.svelte b/src/components/Header/Header.svelte
new file mode 100644
index 0000000..8059907
--- /dev/null
+++ b/src/components/Header/Header.svelte
@@ -0,0 +1,18 @@
+<script>
+
+</script>
+<header>
+    <h1>Scorecard</h1>
+</header>
+
+<style>
+    header {
+        display: flex;
+        padding: var(--size-fluid-2);
+        border-bottom: 1px solid var(--accent-color);
+    }
+
+    h1 {
+        font-size: var(--font-size-fluid-3);
+    }
+</style>
\ No newline at end of file

From 136a34618175295172d7f57cb0113ea9fbddc8ab Mon Sep 17 00:00:00 2001
From: Steven Bister <stevebister@gmail.com>
Date: Tue, 19 Mar 2024 18:50:33 +0000
Subject: [PATCH 2/3] feat: add layout component

---
 src/App.svelte                      |  6 ++----
 src/components/Layout/Layout.svelte | 16 ++++++++++++++++
 2 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 src/components/Layout/Layout.svelte

diff --git a/src/App.svelte b/src/App.svelte
index ac79152..b5d2534 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -1,7 +1,5 @@
 <script lang="ts">
-
+    import Layout from "./components/Layout/Layout.svelte";
 </script>
 
-<main>
-
-</main>
+<Layout />
diff --git a/src/components/Layout/Layout.svelte b/src/components/Layout/Layout.svelte
new file mode 100644
index 0000000..af876db
--- /dev/null
+++ b/src/components/Layout/Layout.svelte
@@ -0,0 +1,16 @@
+<script lang="ts">
+    import Header from "../Header/Header.svelte";
+</script>
+
+<Header />
+<main>
+    <slot />
+</main>
+
+<style>
+    main {
+        display: flex;
+        flex-direction: column;
+        height: 100dvh;
+    }
+</style>
\ No newline at end of file

From a46a007c0a51468ed8a89b68ca94ab40ccd7bc5f Mon Sep 17 00:00:00 2001
From: Steven Bister <stevebister@gmail.com>
Date: Tue, 19 Mar 2024 18:50:50 +0000
Subject: [PATCH 3/3] feat: add accent var

---
 src/styles/main.css | 10 ++++++++++
 1 file changed, 10 insertions(+)

diff --git a/src/styles/main.css b/src/styles/main.css
index 078fadd..1bbfd84 100644
--- a/src/styles/main.css
+++ b/src/styles/main.css
@@ -9,3 +9,13 @@
  normalize includes light and dark vars for adaptive theming
  */
 @import url('open-props/normalize');
+
+:root {
+    --accent-color: var(--gray-12);
+}
+
+@media (prefers-color-scheme: dark) {
+    :root {
+        --accent-color: var(--gray-3);
+    }
+}