INIT: initial commit

app/assets/css/currentMood.css

@@ -0,0 +1,19 @@
+.CurrentMood {
+    background: var(--clr-current-light);
+    color: var(--clr-current-dark);
+    height: 60dvh;
+    padding: 2rem .5rem;
+    font-family: 'Delius', sans-serif;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+
+    & .icon {
+        font-size: 14rem;
+    }
+
+    & h1 {
+        font-size: 1.5rem;
+    }
+}

app/assets/css/general.css

@@ -0,0 +1,34 @@
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+:root {
+    --clr-happy-dark: #009933;
+    --clr-happy-light: #d1ffe8;
+
+    --clr-sad-dark: #252ed5;
+    --clr-sad-light: #e5ecfc;
+
+    --clr-disappointed-dark: #ab6b0e;
+    --clr-disappointed-light: #fffbd8;
+
+    --clr-angry-dark: #851919;
+    --clr-angry-light: #ffe5e5;
+
+    --clr-empty-dark: #595959;
+    --clr-empty-light: #f1f1f1;
+
+    --clr-dead-dark: #ffffff;
+    --clr-dead-light: #000000;
+
+    --clr-sick-dark: #87ad00;
+    --clr-sick-light: #edffd8;
+
+    --clr-pissed-dark: #7853ff;
+    --clr-pissed-light: #f1efff;
+
+    --clr-current-dark: var(--clr-happy-dark);
+    --clr-current-light: var(--clr-happy-light);
+}

app/assets/css/moodDropdown.css

@@ -0,0 +1,27 @@
+.MoodDropdown {
+    display: grid;
+    grid-template-columns: repeat(4, 1fr);
+    grid-auto-rows: 4rem;
+
+    & > button {
+        all: unset;
+        --background: var(--clr-empty-light);
+        --color: var(--clr-empty-dark);
+
+        font-family: 'Delius', sans-serif;
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+        align-items: center;
+        background: var(--background);
+        color: var(--color);
+
+        & span {
+            font-size: .8rem;
+        }
+
+        & .icon {
+            font-size: 2rem;
+        }
+    }
+}