Merge pull request #22 from Klescouar/fix/users

improvement: add responsivity to users screen
fordevio · Oct 2, 2024 · 97547b0 · 97547b0
2 parents 59f061b + fc35633
commit 97547b0
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 7 deletions.
diff --git a/client/src/pages/Home/Users/card/index.css b/client/src/pages/Home/Users/card/index.css
@@ -1,6 +1,4 @@
 .user-card {
-  height: 200px;
-  width: 300px;
   background-color: rgb(92, 141, 153);
   border-radius: 10px;
   border: 2px solid rgb(4, 24, 110);

diff --git a/client/src/pages/Home/Users/index.css b/client/src/pages/Home/Users/index.css
@@ -1,10 +1,12 @@
+.user-page {
+  padding: 20px;
+}
+
 .users-cont {
+  padding: 10px;
   display: grid;
-  gap: 50px 50px;
-  padding: 50px 50px;
-  grid-template-columns: auto auto auto auto;
-  justify-content: space-evenly;
-  align-content: center;
+  grid-gap: 10px;
+  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
 }
 
 .btn {
@@ -34,6 +36,8 @@
 }
 
 .popup {
+  min-width: 220px;
+
   font-family: Arial, sans-serif;
 
   position: absolute;