fix: fix markeplace item grid

src/components/modals/main/scss/marketplace/_main.scss

@@ -6,17 +6,16 @@
 @import 'scss/variables';
 
 .items {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  gap: 15px;
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  grid-gap: 1rem;
   margin-top: 15px;
 
   .item {
     position: relative;
     border-radius: 12px;
     height: 70px;
-    width: 260px;
+    width: auto;
     padding: 10px;
     cursor: pointer;
     display: flex;
@@ -181,24 +180,6 @@
   }
 }
 
-@media (max-width: 1920px) {
-  .items {
-    grid-template-columns: repeat(3, 1fr);
-  }
-}
-
-@media (max-width: 1680px) and (min-width: 1500px) {
-  .items {
-    grid-template-columns: repeat(2, 1fr);
-  }
-}
-
-@media (max-width: 1440px) {
-  .items {
-    grid-template-columns: repeat(1, 1fr);
-  }
-}
-
 .emptyItems {
   width: 100%;
   height: 100%;
@@ -246,11 +227,6 @@ p.author {
   overflow-x: hidden;
 }
 
-@media (max-height: 1080px) {
-  .dropdownsortAddons {
-    margin-top: 40px !important;
-  }
-}
 
 .returnButton {
   display: grid;

src/components/modals/welcome/welcome.scss

@@ -1,6 +1,10 @@
 @import '../main/scss/index.scss';
 @import 'scss/variables';
 
+.welcomeContent {
+  height: 100%;
+}
+
 .welcomemodal {
   position: absolute;
   margin: auto;
@@ -8,14 +12,15 @@
   right: 0;
   bottom: 0;
   left: 0;
-  height: 80%;
-  width: 60%;
+  height: 90vh;
+  width: clamp(60vw, 1400px, 90vw);
   padding: 0;
+  overflow-x: hidden !important;
 
   section {
     width: 50%;
     display: inline;
-    height: 80vh;
+    height: 100%;
   }
 
   section:nth-child(1) {
@@ -200,7 +205,7 @@ a.privacy {
   align-items: center;
 
   img {
-    width: 30rem !important;
+    width: clamp(20rem, 300px, 40rem);
     height: auto !important;
     display: block;
     margin: 30px;
@@ -208,58 +213,7 @@ a.privacy {
   }
 }
 
-@media (max-width: 1820px) and (min-width: 1200px) {
-  .welcomemodal {
-    width: 85%;
-    height: 90%;
-  }
 
-  section {
-    height: 90vh !important;
-  }
-}
-
-@media (max-width: 1300px) {
-  .welcomemodal {
-    overflow-x: hidden !important;
-  }
-
-  .examples img {
-    width: 20rem !important;
-  }
-
-  .buttons {
-    position: relative !important;
-    bottom: 1rem !important;
-    right: -1rem !important;
-  }
-
-  section {
-    height: 100vh !important;
-  }
-}
-
-@media (max-width: 1190px) {
-  .welcomemodal {
-    width: 90%;
-    height: 90%;
-  }
-}
-
-@media (max-width: 800px) {
-  .welcomemodal {
-    width: 100%;
-    height: 100%;
-  }
-
-  .examples img {
-    width: 15rem !important;
-  }
-
-  section {
-    height: 140vh !important;
-  }
-}
 
 .createButtons {
   display: flex;