diff options
| -rw-r--r-- | index.html | 40 |
1 files changed, 40 insertions, 0 deletions
@@ -5,8 +5,48 @@ <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;} + } + </style> </head> <body> + <div id="snackbar">Some text some message..</div> <h1>ECommerce Login</h1> Email: <input type="email" id="email" placeholder="email"><br><br> Password: <input type="password" placeholder="password" id="password"><br><br> |