Exporting base styles

src/base/_modal.scss

@@ -0,0 +1,58 @@
+.modal {
+    padding: 1rem;
+
+    margin: auto;
+    max-width: 600px;
+    min-width: 250px;
+    width: calc(100% - 2rem);
+
+    max-height: calc(100vh - 2rem);
+
+    transform: translate(-50%, -50%);
+
+    position: fixed;
+    top: 50%;
+    left: 50%;
+
+    .modal-title {
+        font-weight: 600;
+        font-size: 1.2rem;
+        margin-bottom: .5rem;
+    }
+
+    .modal-content {
+        overflow-y: auto;
+        max-height: calc(100vh - 10rem);
+        // margin: auto;
+    }
+
+    .modal-action {
+        margin-top: .5rem;
+        display: flex;
+
+        :first-child {
+            margin-left: auto;
+        }
+
+        button {
+            @extend .btn;
+        }
+    }
+
+    transform-origin: center;
+    animation: growModalBox .2s linear;
+}
+
+@keyframes growModalBox {
+    from {
+        filter: opacity(0);
+    }
+
+    to {
+        filter: opacity(1);
+    }
+}
+
+.modal-hidden {
+    display: none;
+}