Merge pull request #312 from MoveOnOrg/cpa

Move modal styles to Giraffe
MoveOnOrg · Jun 29, 2023 · ce2a672 · ce2a672
2 parents 033e920 + 7755cfb
commit ce2a672
Showing 1 changed file with 48 additions and 0 deletions.
diff --git a/src/styles/pages/_cpa.scss b/src/styles/pages/_cpa.scss
@@ -20,6 +20,54 @@
 
     }
 
+    .modal-background {
+      display: none; /* Hidden by default */
+      position: fixed; /* Stay in place */
+      z-index: 2; /* Sit on top */
+      left: 0;
+      top: 0;
+      width: 100%; /* Full width */
+      height: 100%; /* Full height */
+      overflow: auto; /* Enable scroll if needed */
+      background-color: rgba(0,0,0,0.62);
+    }
+    .modal-content {
+      background-color: #fff;
+      margin: 20% auto 35% auto;
+      width: 50% !important;
+      padding-top: 40px;
+      padding-bottom: 40px;
+    }
+    .modal-buttons {
+      display: flex;
+      flex-direction: column;
+      align-content: center;
+      @media (min-width: $bp-md) {
+        flex-direction: row;
+        flex-wrap: wrap;
+    }
+    }
+    #modal-confirm, #modal-cancel {
+      background: #296190;
+      color: #FFFFFF;
+      text-align: center;
+      font-size: 18px;
+      font-family: Roboto Condensed, sans-serif;
+      font-weight: 700;
+      width: 30%;
+      margin-top: 10px;
+      margin-bottom: 10px;
+      padding: 10px;
+      text-transform: unset;
+    }
+    #modal-confirm {
+      margin-left:auto;
+    }
+    #modal-cancel {
+      margin-right:auto;
+    }
+
+
     form #survey-questions label {
       font-size:25px;
     }