made design better for tiling window manager

frontend/assets/style.css

@@ -6,24 +6,22 @@ body {
     margin: 0;
     height: 100vh;
 
-    padding-left: auto;
-    padding-right: auto;
     background-color: pink;
 
     display: flex;
     align-items: center;
     justify-content: center;
 
-    background: url("bg.svg") center center/auto repeat, linear-gradient(
-        to bottom, transparent, pink
-    );
+    background:
+        url("bg.svg") center center/auto repeat,
+        linear-gradient(to bottom, transparent, pink);
 }
 
 .search-grid {
-    margin-top: -10em;
+    width: 100%;
 
-    width: 40em;
-    height: 30em;
+    margin-left: 10em;
+    margin-right: 10em;
 
     display: grid;
     gap: 5em;
@@ -32,6 +30,8 @@ body {
 }
 
 .search {
+    width: 100%;
+
     grid-row: 2;
     grid-column: 1 / span 2;
 }
@@ -39,16 +39,17 @@ body {
 .search-logo {
     grid-row: 1;
     height: 100%;
+    width: 100%;
 
     display: flex;
     flex-direction: row;
     align-items: center;
-    justify-content:    space-between;
+    justify-content: space-between;
 
     color: black;
 }
 
-@media (min-height: 700px){
+@media (min-height: 700px) {
     .search-grid {
         margin-top: 0;
     }
@@ -62,7 +63,7 @@ body {
 }
 
 .card {
-    background-color: rgba(255, 255, 255, .5);
+    background-color: rgba(255, 255, 255, 0.5);
     width: 10em;
     display: flex;
     flex-direction: column;
@@ -85,5 +86,5 @@ body {
     background-color: lightblue;
 
     padding: 1em;
-    border-radius: .5em;
+    border-radius: 0.5em;
 }