Split up SASS into multiple files

This will make adding pages much more easy, as some elements can be reused.

1 files changed, 31 insertions, 0 deletions

diff --git a/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss
new file mode 100644
index 0000000..c8705e4
--- /dev/null
+++ b/WebInterface/NodeJSServer/src/style/partials/modal/_base.scss
@@ -0,0 +1,31 @@
+.modal-container {
+  position:absolute;
+  top: 0;
+  width: 100vw;
+  height: 100vh;
+  background-color: #000000AA;
+  display: flex;
+  opacity: 1;
+  transition: opacity 200ms ease;
+
+  &.hidden {
+    opacity: 0;
+  }
+
+  .modal {
+    background-color: #546e7a;
+    margin: auto;
+    padding: 1rem;
+    border-style: none;
+    border-radius: 8px;
+    box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22);
+  }
+
+  .modal-title {
+    margin: 1rem;
+  }
+
+  .modal-body {
+    margin: 0.25rem;
+  }
+}