Merge pull request #641 from aditya-bhaumik/improve-modal

improved the available modal and the main modal of all the pages
sk66641 · Aug 10, 2024 · ffccdc3 · ffccdc3
2 parents 26716c8 + 5423bf8
commit ffccdc3
Showing 1 changed file with 65 additions and 2 deletions.
diff --git a/css/style.css b/css/style.css
@@ -1194,7 +1194,7 @@ nav ul li a:hover {
   backdrop-filter:blur(1px);
 }
 .modal-content {
-  background: linear-gradient(135deg, #e0c3fc 0%, #8ec5fc 100%);  margin: 10% auto;
+  background: linear-gradient(135deg, #923ae4 0%, #3f95eb 100%);  margin: 10% auto;
   margin: 10% auto;
   padding: 20px;
   border-radius: 8px;
@@ -2364,7 +2364,70 @@ goog-logo-link,
 }
 
 .account-not-available-modal-content {
-  background: linear-gradient(to right, #d4fcff, #c8f7dc);
+  background: linear-gradient(to right, #42f58c, #c8f7dc);
+
+  color: #ffffff;
+  margin: auto;
+  padding: 30px;
+  border-radius: 15px;
+  width: 80%;
+  max-width: 600px;
+  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
+  text-align: center;
+  animation: fadeIn 0.5s;
+}
+
+.account-not-available-modal .close {
+  color: #ffffff;
+  float: right;
+  font-size: 28px;
+  font-weight: bold;
+  cursor: pointer;
+}
+
+.account-not-available-modal .close:hover,
+.account-not-available-modal .close:focus {
+  color: #bdc3c7;
+  text-decoration: none;
+}
+
+.account-not-available-modal h2 {
+  font-size: 24px;
+  margin-bottom: 20px;
+}
+
+.account-not-available-modal p {
+  font-size: 18px;
+  line-height: 1.6;
+  margin: 20px 0;
+}
+
+@keyframes fadeIn {
+  from {
+    opacity: 0;
+    transform: scale(0.9);
+  }
+  to {
+    opacity: 1;
+    transform: scale(1);
+  }
+}
+
+.account-not-available-modal {
+  display: none; 
+  position: fixed; 
+  z-index: 100; 
+  padding-top: 100px; 
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%; 
+  overflow: auto; 
+  background-color: rgba(0, 0, 0, 0.8); 
+}
+
+.account-not-available-modal-content {
+  background: linear-gradient(to right, #42f58c, #c8f7dc);
 
   color: #ffffff;
   margin: auto;