2 files changed, 55 insertions, 58 deletions
diff --git a/src/App.svelte b/src/App.svelte
index 45defe1..337e323 100644
--- a/src/App.svelte
+++ b/src/App.svelte
@@ -1,62 +1,8 @@
 <!-- This is the Root component that loads other components -->
 <script lang="ts">
-	import Sidebar from "./components/Sidebar.svelte";
+  import Sidebar from "./components/Sidebar.svelte";
 </script>
 
-<Sidebar />
-
-<style global lang="postcss">
-	@tailwind base;
-	@tailwind components;
-	@tailwind utilities;
-
-	@layer base {
-		html {
-			font-family: sans-serif, Proxima Nova;
-		}
-	}
-
-	/* Custom Styles */
-	@layer utilities {
-		.assign-box {
-			/* w-1/3 bg-green-500 flex flex-col border-solid hover:border-4 border-2 border-slate-400 */
-			flex: none;
-			flex-direction: column;
-			width: 33.33%;
-			display: flex;
-			border-width: 4px;
-			border-color: rgb(148 163 184);
-		}
-		.assign-box:hover {
-			/* border-width: 6px; */
-			border-color: black;
-			border-width: 6px;
-			/* border-width: 8px; */
-			/* transition-timing-function: ease-in-out; */
-		}
-
-		.assign-box:hover > .assign-box-header {
-			border-bottom-color: black;
-			border-bottom-width: 6px;
-		}
-
-		.assign-box-header {
-			font-size: 1.5rem;
-			font-family: sans;
-			border-bottom-color: rgb(148 163 184);
-			border-bottom-width: 4px;
-			text-align: center;
-			/* height: 9%; */
-			height: 10vh;
-			overflow: hidden;
-			flex: none;
-		}
-
-		.assign-box-body {
-			/* flex-direction: row; */
-			flex: 1 1 auto;
-			overflow-y: auto;
-			height: 100%;
-		}
-	}
-</style>
+<main>
+  <Sidebar />
+</main>
diff --git a/src/app.css b/src/app.css
index 1a7b7cf..3fd8fa6 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,4 +1,55 @@
 /* Write your global styles here, in PostCSS syntax */
+
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
+
+@layer base {
+  html {
+    font-family: sans-serif, Proxima Nova;
+  }
+}
+
+/* Custom Styles */
+@layer utilities {
+  .assign-box {
+    /* w-1/3 bg-green-500 flex flex-col border-solid hover:border-4 border-2 border-slate-400 */
+    flex: none;
+    flex-direction: column;
+    width: 33.33%;
+    display: flex;
+    border-width: 4px;
+    border-color: rgb(148 163 184);
+  }
+  .assign-box:hover {
+    /* border-width: 6px; */
+    border-color: black;
+    border-width: 6px;
+    /* border-width: 8px; */
+    /* transition-timing-function: ease-in-out; */
+  }
+
+  .assign-box:hover > .assign-box-header {
+    border-bottom-color: black;
+    border-bottom-width: 6px;
+  }
+
+  .assign-box-header {
+    font-size: 1.5rem;
+    font-family: sans;
+    border-bottom-color: rgb(148 163 184);
+    border-bottom-width: 4px;
+    text-align: center;
+    /* height: 9%; */
+    height: 10vh;
+    overflow: hidden;
+    flex: none;
+  }
+
+  .assign-box-body {
+    /* flex-direction: row; */
+    flex: 1 1 auto;
+    overflow-y: auto;
+    height: 100%;
+  }
+}