diff --git a/webapp/src/components/AssetImage/AssetImage.tsx b/webapp/src/components/AssetImage/AssetImage.tsx
index 1619e3fd79..8a5cefe404 100644
--- a/webapp/src/components/AssetImage/AssetImage.tsx
+++ b/webapp/src/components/AssetImage/AssetImage.tsx
@@ -539,8 +539,9 @@ const AssetImageWrapper = (props: Props) => {
item.isOnSale,
[asset, item]
)
+ const isOwnerOfNFT = isNFT(asset) && wallet?.address === asset.owner
- let classes = `AssetImage ${isAvailableForMint ? 'hasMintAvailable' : ''}`
+ let classes = `AssetImage ${isAvailableForMint && !isOwnerOfNFT ? 'hasMintAvailable' : ''}`
if (className) {
classes += ' ' + className
}
diff --git a/webapp/src/components/AssetPage/AssetPage.css b/webapp/src/components/AssetPage/AssetPage.css
index 454f2762e1..dd73f09981 100644
--- a/webapp/src/components/AssetPage/AssetPage.css
+++ b/webapp/src/components/AssetPage/AssetPage.css
@@ -16,6 +16,10 @@
}
@media (max-width: 768px) {
+ .AssetPage {
+ margin-top: 0px;
+ }
+
.AssetPage .backText {
margin-top: -20px;
}
diff --git a/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.module.css b/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.module.css
index 3417460eba..204921f4cf 100644
--- a/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.module.css
+++ b/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.module.css
@@ -23,7 +23,6 @@
.EmoteDetail .badges {
margin-top: 8px;
- margin-bottom: 15px;
display: flex;
gap: 8px;
flex-wrap: wrap;
@@ -32,6 +31,7 @@
.EmoteDetail .wearableInformation {
display: flex;
+ gap: 15px;
flex-direction: column;
flex: 1;
justify-content: space-between;
@@ -52,7 +52,7 @@
.EmoteDetail .attributesRow {
display: flex;
flex-direction: row;
- gap: 10px;
+ gap: 30px;
word-wrap: break-word;
word-break: break-all;
}
@@ -64,8 +64,21 @@
@media (max-width: 768px) {
.EmoteDetail .attributesRow {
flex-direction: column;
+ gap: 20px;
+ }
+ .EmoteDetail :global(.dcl.stats) {
+ margin: 0px;
+ width: 100%;
+ }
+ .EmoteDetail :global(.dcl.tabs.fullscreen) {
+ padding-left: 21px;
+ margin: 0;
+ border-bottom: 1px solid var(--divider);
+ }
+ .EmoteDetail :global(.filtertabsContainer .dcl.tab) {
+ height: unset;
+ margin-bottom: 22px;
}
-
.EmoteDetail .wearableInformationContainer {
flex-direction: column;
}
@@ -82,14 +95,6 @@
.EmoteDetail .actionsContainer {
width: 100%;
}
- .EmoteDetail .badges {
- margin-bottom: 18px;
- }
- .EmoteDetail .emoteOwnerAndCollectionContainer {
- margin-top: 18px;
- display: flex;
- flex-direction: column;
- }
.EmoteDetail .assetImageContainer :global(.AssetImage .rarity-background) {
border-radius: 12px;
}
diff --git a/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.tsx b/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.tsx
index c1c5359467..e87a2a7ea5 100644
--- a/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.tsx
+++ b/webapp/src/components/AssetPage/EmoteDetail/EmoteDetail.tsx
@@ -114,9 +114,13 @@ const EmoteDetail = ({ nft }: Props) => {
) : null}
-
diff --git a/webapp/src/components/AssetPage/ItemDetail/ItemDetail.module.css b/webapp/src/components/AssetPage/ItemDetail/ItemDetail.module.css
index c9550562ad..bcbfcc0308 100644
--- a/webapp/src/components/AssetPage/ItemDetail/ItemDetail.module.css
+++ b/webapp/src/components/AssetPage/ItemDetail/ItemDetail.module.css
@@ -52,7 +52,7 @@
.ItemDetail .attributesRow {
display: flex;
flex-direction: row;
- gap: 10px;
+ gap: 30px;
word-wrap: break-word;
word-break: break-all;
}
@@ -61,13 +61,6 @@
flex-basis: 100%;
}
-.ItemDetail .basicRow {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- width: 100%;
-}
-
.ItemDetail :global(.ui.button + .ui.button) {
margin-left: 0px;
}
@@ -95,15 +88,20 @@
width: 100%;
}
- .ItemDetail :global(.dcl.stats + .dcl.stats) {
- width: 100%;
+ .ItemDetail :global(.dcl.stats) {
+ margin: 0px;
}
}
@media (max-width: 768px) {
+ .itemDetailBottomContainer {
+ margin-top: 20px;
+ }
+
.ItemDetail .attributesRow {
display: flex;
flex-direction: column;
+ gap: 20px;
}
.ItemDetail .assetImageContainer {
@@ -120,14 +118,10 @@
margin-bottom: 0;
}
- .ItemDetail .basicRow :global(.dcl.stats) {
+ .ItemDetail .attributesColumn :global(.dcl.stats) {
width: 100%;
}
- .ItemDetail .basicRow {
- flex-direction: column;
- }
-
.ItemDetail :global(.dcl.tabs) {
justify-content: space-evenly;
}
diff --git a/webapp/src/components/AssetPage/ItemDetail/ItemDetail.tsx b/webapp/src/components/AssetPage/ItemDetail/ItemDetail.tsx
index 449c6aa35e..b11c3e1e81 100644
--- a/webapp/src/components/AssetPage/ItemDetail/ItemDetail.tsx
+++ b/webapp/src/components/AssetPage/ItemDetail/ItemDetail.tsx
@@ -149,6 +149,12 @@ const ItemDetail = ({ item }: Props) => {
) : null}
+
+
{item.network === Network.MATIC ? : null}
+
+
+
+
0 && item.isOnSale
@@ -156,10 +162,6 @@ const ItemDetail = ({ item }: Props) => {
: styles.itemDetailBottomContainer
}
>
-
- {item.network === Network.MATIC ? : null}
-
-
{item.data.wearable?.isSmart &&
}
diff --git a/webapp/src/components/AssetPage/ListingsTable/ListingsTable.module.css b/webapp/src/components/AssetPage/ListingsTable/ListingsTable.module.css
index fe1f441625..b5f31d707e 100644
--- a/webapp/src/components/AssetPage/ListingsTable/ListingsTable.module.css
+++ b/webapp/src/components/AssetPage/ListingsTable/ListingsTable.module.css
@@ -82,8 +82,10 @@
.linkedProfileRow {
margin-left: unset;
}
- .viewListingContainer {
+ .viewListingContainer :global(.ui.small.inverted.button) {
margin-right: 0;
+ min-width: auto;
+ border: none;
}
.manaField {
flex-wrap: wrap;
diff --git a/webapp/src/components/AssetPage/RequiredPermissions/RequiredPermissions.module.css b/webapp/src/components/AssetPage/RequiredPermissions/RequiredPermissions.module.css
index 7130dcdcaa..0b1e421c29 100644
--- a/webapp/src/components/AssetPage/RequiredPermissions/RequiredPermissions.module.css
+++ b/webapp/src/components/AssetPage/RequiredPermissions/RequiredPermissions.module.css
@@ -1,7 +1,3 @@
-.RequiredPermissions {
- margin: 24px 0 24px;
-}
-
.RequiredPermissions .title {
display: flex;
flex-direction: row;
@@ -34,9 +30,3 @@
margin-left: 4px;
cursor: pointer;
}
-
-@media (max-width: 768px) {
- .RequiredPermissions {
- margin: 0 0 24px;
- }
-}
diff --git a/webapp/src/components/AssetPage/WearableDetail/WearableDetail.module.css b/webapp/src/components/AssetPage/WearableDetail/WearableDetail.module.css
index 6e9fcce4e9..c30d58ad61 100644
--- a/webapp/src/components/AssetPage/WearableDetail/WearableDetail.module.css
+++ b/webapp/src/components/AssetPage/WearableDetail/WearableDetail.module.css
@@ -28,6 +28,7 @@
display: flex;
flex-direction: column;
flex: 1;
+ gap: 15px;
justify-content: space-between;
}
@@ -43,10 +44,6 @@
color: var(--secondary-text);
}
-.WearableDetail .wearableBadgesContainer {
- margin-bottom: 18px;
-}
-
.WearableDetail .vrmBadge {
background: #ff743933;
color: #ff7439;
@@ -61,7 +58,7 @@
.WearableDetail .attributesRow {
display: flex;
flex-direction: row;
- gap: 10px;
+ gap: 30px;
word-wrap: break-word;
word-break: break-all;
}
@@ -71,8 +68,13 @@
}
@media (max-width: 768px) {
+ .WearableDetail :global(.dcl.stats) {
+ margin: 0px;
+ }
+
.WearableDetail .attributesRow {
flex-direction: column;
+ gap: 20px;
}
.WearableDetail .wearableInformationContainer {
@@ -98,19 +100,6 @@
.WearableDetail .wearableInformationContainer {
flex-direction: column;
}
- .WearableDetail .wearableBadgesContainer {
- margin-bottom: 18px;
- }
-
- .WearableDetail .wearableOwnerAndCollectionContainer {
- margin-top: 18px;
- display: flex;
- flex-direction: column;
- }
-
- .WearableDetail .wearableOwnerAndCollectionContainer :global(.dcl.stats) {
- margin-bottom: 16px;
- }
.WearableDetail :global(.dcl.tabs.fullscreen) {
padding-left: 21px;
diff --git a/webapp/src/components/AssetPage/WearableDetail/WearableDetail.tsx b/webapp/src/components/AssetPage/WearableDetail/WearableDetail.tsx
index f34f2548b3..e6c40fb410 100644
--- a/webapp/src/components/AssetPage/WearableDetail/WearableDetail.tsx
+++ b/webapp/src/components/AssetPage/WearableDetail/WearableDetail.tsx
@@ -93,6 +93,7 @@ const WearableDetail = ({ nft }: Props) => {
)}
+ {wearable.isSmart ? : null}
@@ -103,10 +104,13 @@ const WearableDetail = ({ nft }: Props) => {
) : null}
- {wearable.isSmart ? : null}
-
diff --git a/webapp/src/components/SellPage/SellPage.css b/webapp/src/components/SellPage/SellPage.css
index 231470e67d..bf553407bb 100644
--- a/webapp/src/components/SellPage/SellPage.css
+++ b/webapp/src/components/SellPage/SellPage.css
@@ -33,7 +33,7 @@
}
.SellPage .AssetAction > .Row .buttons {
- margin-bottom: 200px;
+ gap: 15px;
}
.SellPage .AssetAction > .Row .ui.button + .ui.button {