File for animations

frontend/src/lib/css/colors.css

@@ -0,0 +1,31 @@
+:root {
+
+    --col_background_1: #fbefff;
+    --col_background_2: #f5e0fc;
+    --col_panel: #41bd79;
+    --col_panel_field: #46a871;
+    --col_footer: #3a3e41;
+    --col_footer_copyright: #000000;
+    --col_accent: #5dc98e;
+
+    --col_text: #000000;
+    --col_text_query: #ffffff;
+    --col_text_invalid: #cc0000;
+    --col_text_hint: #aaaaaa; 
+    --col_text_panel: #ffffff;
+    --col_text_footer: #ffffff;
+    --col_text_copyright: #ffffff;
+
+    --col_text_selection: #5dc98e;
+}
+
+@media (prefers-color-scheme: dark) {
+
+    /*TODO: Implement blue darkmode color theme*/
+
+}
+
+body {
+    background-color: var(--col_background_1);
+    color: var(--col_text);
+}

frontend/src/lib/css/fonts.css

@@ -1,7 +1,7 @@
-:global(*) {
+* {
     font-family: 'Montserrat', sans-serif;
 }
 
-:global(h1) {
+h1 {
     font-family: 'Montserrat_Alternates', sans-serif;
 }

frontend/src/routes/+layout.svelte

@@ -4,6 +4,8 @@
     import '$lib/css/normalize.css';
     import '$lib/css/font_imports.css';
     import '$lib/css/fonts.css';
+    import '$lib/css/colors.css';
+    import '$lib/css/anims.CSS';
     
 </script>