fix: some unified market ui issues in mobile (#1713)

decentraland · May 19, 2023 · f7bb18c · f7bb18c
1 parent 0ecf73a
commit f7bb18c
Show file tree

Hide file tree

Showing 4 changed files with 26 additions and 6 deletions.
diff --git a/webapp/src/components/AssetCard/AssetCard.css b/webapp/src/components/AssetCard/AssetCard.css
@@ -162,11 +162,6 @@
   transition: height 0.3s !important;
 }
 
-.AssetCard:hover .AssetImage.catalog {
-  height: 161px;
-  transition: height 0.3s !important;
-}
-
 .AssetCard .PriceInMana .ui.header.large {
   font-size: 30px;
   font-weight: 600;
@@ -196,6 +191,11 @@
 }
 
 @media (min-width: 1199px) {
+  .AssetCard:hover .AssetImage.catalog {
+    height: 161px;
+    transition: height 0.3s !important;
+  }
+
   .AssetCard .extraInformation {
     display: flex;
     visibility: hidden;
@@ -289,6 +289,15 @@
 }
 
 @media (max-width: 768px) {
+  .AssetCard.ui.card > .content.catalog,
+  .ui.cards > .AssetCard.card > .content.catalog {
+    display: flex;
+  }
+
+  .AssetCard .catalog .tags {
+    margin-top: auto;
+  }
+
   .AssetBrowse .ui.cards .ui.card.AssetCard {
     transform: translateY(0px);
   }

diff --git a/webapp/src/components/AssetImage/AssetImage.css b/webapp/src/components/AssetImage/AssetImage.css
@@ -326,6 +326,9 @@
 }
 
 @media (max-width: 768px) {
+  .AssetImage .image {
+    width: 100%;
+  }
   .AvailableForMintPopup {
     right: 0;
     width: 100%;

diff --git a/webapp/src/components/AssetPage/ListingsTable/ListingsTable.tsx b/webapp/src/components/AssetPage/ListingsTable/ListingsTable.tsx
@@ -50,7 +50,7 @@ const ListingsTable = (props: Props) => {
           setOrders(
             formatDataToTable(
               isNFT(asset)
-                ? response.data.filter(order => order.tokenId === asset.tokenId)
+                ? response.data.filter(order => order.tokenId !== asset.tokenId)
                 : response.data,
               isMobileOrTablet
             )

diff --git a/webapp/src/components/HomePage/Slideshow/Slideshow.css b/webapp/src/components/HomePage/Slideshow/Slideshow.css
@@ -141,6 +141,9 @@
   .Slideshow {
     overflow: hidden;
   }
+  .Slideshow .assets {
+    overflow: scroll;
+  }
 }
 
 .Slideshow .ItemsSection .tabs {
@@ -176,6 +179,11 @@
 }
 
 @media (max-width: 768px) {
+  .Slideshow .AssetCard .wrapBigText {
+    flex-direction: row;
+    align-items: center;
+  }
+
   .Slideshow .ItemsSection {
     display: flex;
     align-items: center;