1 files changed, 55 insertions, 5 deletions
diff --git a/signup/index.html b/signup/index.html
index bbce52e..a21b598 100644
--- a/signup/index.html
+++ b/signup/index.html
@@ -5,13 +5,63 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <meta http-equiv="X-UA-Compatible" content="ie=edge">
     <title>Firebase ECommerce Solution</title>
+    <style>
+            #snackbar {
+                visibility: hidden;
+                min-width: 250px;
+                background-color: rgb(231, 81, 81);
+                color: #fff;
+                text-align: center;
+                border-radius: 2px;
+                padding: 16px;
+                position: fixed;
+                z-index: 1;
+                top: 30px;
+                right:30px;
+            }
+            #snackbar.show {
+                visibility: visible;
+                -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
+                animation: fadein 0.5s, fadeout 0.5s 2.5s;
+            }
+            @-webkit-keyframes fadein {
+                from {opacity: 0;} 
+                to { opacity: 1;}
+            }
+    
+            @keyframes fadein {
+                from { opacity: 0;}
+                to { opacity: 1;}
+            }
+    
+            @-webkit-keyframes fadeout {
+                from {opacity: 1;} 
+                to {opacity: 0;}
+            }
+    
+            @keyframes fadeout {
+                from {opacity: 1;}
+                to {opacity: 0;}
+            }
+            .middle {
+                margin: 0 auto;
+                width: 50%;
+                justify-content: center;
+                justify-items: center;
+                align-content: center;
+                align-items: center;
+            }
+        </style>
 </head>
 <body>
-    <h1>ECommerce Signup</h1>
-    Email: <input type="email" id="email" placeholder="email"><br><br>
-    Password: <input type="password" placeholder="password" id="password"><br><br>
-    <button id="signup">Signup</button><br><br>
-    <a href="../">Already a user? Login Now!</a>
+    <div id="snackbar">Some text some message..</div>
+    <div class="middle">
+        <h1>ECommerce Signup</h1>
+        Email: <input type="email" id="email" placeholder="email"><br><br>
+        Password: <input type="password" placeholder="password" id="password"><br><br>
+        <button id="signup">Signup</button><br><br>
+        <a href="../">Already a user? Login Now!</a>
+    </div>
     <script src="../shared/jquery.js"></script>
     <script src="https://www.gstatic.com/firebasejs/6.1.0/firebase.js"></script>
     <script src="../shared/firebaseConfig.js"></script>