Populated the styling sheets

src/css/colors.css

@@ -0,0 +1,10 @@
+:root {
+  --intermate-yellow:       #f8a90c;
+  --intermate-yellow-hover: #b87e08;
+  --standard-blue:          #3f51b5;
+  --standard-blue-hover:    #1d34b1;
+  --soft-green:             #63E063;
+  --soft-red:               #f56565;
+  --background-white:       #f4f4f4;
+}
+/*# sourceMappingURL=colors.css.map */

src/css/colors.css.map

@@ -0,0 +1,9 @@
+{
+    "version": 3,
+    "mappings": "AAEA,AAAA,KAAK,CAAA;EACD,kBAAkB,CAAA,cAAC;EACnB,wBAAwB,CAAA,QAAC;EAEzB,eAAe,CAAA,iBAAC;EAChB,qBAAqB,CAAA,WAAC;EAEtB,YAAY,CAAA,oBAAC;EACb,UAAU,CAAA,sBAAC;EAEX,kBAAkB,CAAA,cAAC;CACtB",
+    "sources": [
+        "colors.scss"
+    ],
+    "names": [],
+    "file": "colors.css"
+}

src/css/colors.scss

@@ -1 +1,14 @@
 // This file contains the standardized colors!
+
+:root{
+    --intermate-yellow:       #f8a90c;
+    --intermate-yellow-hover: #b87e08;
+    
+    --standard-blue:          #3f51b5;
+    --standard-blue-hover:    #1d34b1;
+    
+    --soft-green:             #63E063;
+    --soft-red:               #f56565;
+    
+    --background-white:       #f4f4f4;
+}

src/css/forms.css

@@ -0,0 +1,30 @@
+input, button, textarea, select, .button {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  border: none;
+  border: 1px solid;
+  border-radius: 5px;
+  padding: 10px 10px;
+  margin: 10px 0;
+  color: black;
+  text-decoration: none;
+  background: white;
+}
+
+inputbutton, inputinput[type='submit'], inputinput[type='button'], input.button, buttonbutton, buttoninput[type='submit'], buttoninput[type='button'], button.button, textareabutton, textareainput[type='submit'], textareainput[type='button'], textarea.button, selectbutton, selectinput[type='submit'], selectinput[type='button'], select.button, .buttonbutton, .buttoninput[type='submit'], .buttoninput[type='button'], .button.button {
+  text-align: center;
+  background-color: var(--intermate-yellow);
+  color: white;
+  font-weight: bold;
+  cursor: pointer;
+}
+
+inputbutton.decline, inputinput[type='submit'].decline, inputinput[type='button'].decline, input.button.decline, buttonbutton.decline, buttoninput[type='submit'].decline, buttoninput[type='button'].decline, button.button.decline, textareabutton.decline, textareainput[type='submit'].decline, textareainput[type='button'].decline, textarea.button.decline, selectbutton.decline, selectinput[type='submit'].decline, selectinput[type='button'].decline, select.button.decline, .buttonbutton.decline, .buttoninput[type='submit'].decline, .buttoninput[type='button'].decline, .button.button.decline {
+  background-color: var(--soft-red);
+}
+
+inputbutton.accept, inputinput[type='submit'].accept, inputinput[type='button'].accept, input.button.accept, buttonbutton.accept, buttoninput[type='submit'].accept, buttoninput[type='button'].accept, button.button.accept, textareabutton.accept, textareainput[type='submit'].accept, textareainput[type='button'].accept, textarea.button.accept, selectbutton.accept, selectinput[type='submit'].accept, selectinput[type='button'].accept, select.button.accept, .buttonbutton.accept, .buttoninput[type='submit'].accept, .buttoninput[type='button'].accept, .button.button.accept {
+  background-color: var(--soft-green);
+}
+/*# sourceMappingURL=forms.css.map */

src/css/forms.css.map

@@ -0,0 +1,9 @@
+{
+    "version": 3,
+    "mappings": "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",
+    "sources": [
+        "forms.scss"
+    ],
+    "names": [],
+    "file": "forms.css"
+}

src/css/forms.scss

@@ -1 +1,52 @@
 // This file formats the forms and inputfields
+
+input, button, textarea, select, .button{
+    // We don't want the stupid browser appearance
+    appearance: none;
+
+    // Style the border
+    border: none;
+    border: 1px solid;
+    border-radius: 5px;
+
+    // Make it a bit bigger
+    padding: 10px 10px;
+
+    // And give it some space
+    margin: 10px 0;
+
+    color: black;
+    text-decoration: none;
+
+    // White background looks nice and distinct 
+    // (at least when using the slightly off-white background-white as background for the overall page)
+    background: white;
+
+    // If it is a button
+    &button, &input[type='submit'], &input[type='button'], &.button{
+        // Align text in the center
+        text-align: center;
+    
+        // The standard background color is intermate yellos
+        background-color: var(--intermate-yellow);
+    
+        // White looks good on intermate yellow
+        color: white;
+    
+        // We should be able to see it, so let's make the text bold
+        font-weight: bold;
+    
+        // When we hover over a buttton, we should see a pointer
+        cursor: pointer;
+    
+        // Here we give the buttons a different background color
+        // For example when you use it as a decline or accept button
+        &.decline{
+            background-color: var(--soft-red);
+        }
+    
+        &.accept{
+            background-color: var(--soft-green);
+        }
+    }
+}

src/css/intermate.css

@@ -0,0 +1,3 @@
+@use 'colors.scss';
+@use 'forms.scss';
+/*# sourceMappingURL=intermate.css.map */

src/css/intermate.css.map

@@ -0,0 +1,9 @@
+{
+    "version": 3,
+    "mappings": "AAGA,IAAI,CAAJ,aAAI;AACJ,IAAI,CAAJ,YAAI",
+    "sources": [
+        "intermate.scss"
+    ],
+    "names": [],
+    "file": "intermate.css"
+}

src/css/intermate.scss

@@ -1 +1,5 @@
 // This file combines the other stylesheets
+
+// This basically just inserts the other files here
+@use 'colors.scss';
+@use 'forms.scss';