Move styles and add mixins

frontend/src/styles/mixins/display.scss

@@ -0,0 +1,11 @@
+@mixin flex {
+    display: flex;
+}
+@mixin flex-col {
+    display: flex;
+    flex-direction: column;
+}
+@mixin flex-row {
+    display: flex;
+    flex-direction: row;
+}

frontend/src/styles/mixins/effects.scss

@@ -0,0 +1,18 @@
+@mixin transition($timing) {
+    -moz-transition: $timing;
+    -webkit-transition: $timing;
+    -o-transition: $timing;
+    -ms-transition: $timing;
+    transition: $timing;
+}
+@mixin appear($timing) {
+    animation: appear $timing forwards;
+}
+@keyframes appear {
+    From {
+        opacity: 0;
+    }
+    To {
+        opacity: 1;
+    }
+}

frontend/src/styles/mixins/variables.scss

@@ -0,0 +1 @@
+$theme: #282c34;