update style.css

Author: khushi-purwar

QR-CODE-Generator/style.css

@@ -1,36 +1,29 @@
-*{
+* {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
-}
-
-body{
+  }
+  
+  body {
     width: 100%;
     height: 100vh;
-    background:linear-gradient(to right top,#ff0f7b,#f89b29);
+    background: linear-gradient(to right top, #ff0f7b, #f89b29);
     display: flex;
     flex-direction: column;
     justify-content: center;
     align-items: center;
-}
-
-h1 {
+  }
+  
+  h1 {
     font-size: 55px;
-    text-shadow: 0 1px 0 #ccc,
-                 0 2px 0 #c9c9c9,
-                 0 3px 0 #bbb,
-                 0 4px 0 #b9b9b9,
-                 0 5px 0 #aaa,
-                 0 6px 1px rgba(0,0,0,.1),
-                 0 0 5px rgba(0,0,0,.1),
-                 0 1px 3px rgba(0,0,0,.3),
-                 0 3px 5px rgba(0,0,0,.2),
-                 0 5px 10px rgba(0,0,0,.25),
-                 0 10px 10px rgba(0,0,0,.2),
-                 0 20px 20px rgba(0,0,0,.15);
+    text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9,
+      0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1),
+      0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2),
+      0 5px 10px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.2),
+      0 20px 20px rgba(0, 0, 0, 0.15);
   }
-
-.main {
+  
+  .main {
     width: 25%;
     height: 70%;
     padding: 50px 15px;
@@ -39,47 +32,46 @@ h1 {
     align-items: center;
     flex-direction: column;
     background: #fff;
-    box-shadow: 0 10px 25px -10px rgba(0,0,0,0.5);
+    box-shadow: 0 10px 25px -10px rgba(0, 0, 0, 0.5);
     border-radius: 5px;
-    margin-top: 25px;   
+    margin-top: 25px;
     margin-bottom: 40px;
-}
-
-.main .input {
+  }
+  
+  .main .input {
     width: 90%;
     padding: 8px 25px;
     border: 3px solid #9e9e9e;
     outline: none;
     margin: 15px 0;
-}
-.main .input:focus {
+  }
+  .main .input:focus {
     border: 3px solid #f89b29;
-}
-.btn ,.input {
-    font-size:1.1rem;
+  }
+  .btn,
+  .input {
+    font-size: 1.1rem;
     border-radius: 5px;
-}
-.main .btn {
+  }
+  .main .btn {
     width: 90%;
     padding: 12px 0;
     outline: none;
-    border:none;
+    border: none;
     border-radius: 5px;
     background: #f89b29;
     color: #fff;
     transition: 0.3s;
-}
-.main .code {
+  }
+  .main .code {
     margin: 10px 0;
-}
-
-
-
-.main .btn:hover {
+  }
+  
+  .main .btn:hover {
     box-shadow: 0 10px 25px -10px #f89b29;
-}
-
-#toast {
+  }
+  
+  #toast {
     position: absolute;
     bottom: 0;
     border-radius: 5px;
@@ -89,12 +81,14 @@ h1 {
     visibility: hidden;
     box-shadow: 0 10px 25px -10px #07f49e;
     transition: 0.3s;
- 
+  
     font-size: 20px;
-}
-
-#toast.show {
+  }
+  
+  #toast.show {
     visibility: visible;
     opacity: 1;
     bottom: 50px;
-}
+  }
+
+