Merge pull request #123 from FAC-Sixteen/modal

create modal
FAC-Sixteen · May 23, 2019 · 99c6b11 · 99c6b11
2 parents e36da2e + a8cf430
commit 99c6b11
Show file tree

Hide file tree

Showing 6 changed files with 189 additions and 120 deletions.
diff --git a/public/css/components/_modal.scss b/public/css/components/_modal.scss
@@ -0,0 +1,34 @@
+.modal {
+  display: none;
+  position: fixed;
+  z-index: 1;
+  padding-top: 100px;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+  background-color: rgb(0, 0, 0);
+  background-color: rgba(0, 0, 0, 0.4);
+}
+.modal-content {
+  position: relative;
+  background-color: #fefefe;
+  margin: auto;
+  padding: 0;
+  border: 1px solid #888;
+  width: 80%;
+  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
+  -webkit-animation-name: animatetop;
+  -webkit-animation-duration: 0.4s;
+  animation-name: animatetop;
+  animation-duration: 0.4s;
+}
+
+// adds animation
+@-webkit-keyframes animatetop {
+  from {
+    top: -300px;
+    opacity: 0;
+  }
+}