fix: homepage fixes

bosonprotocol · Nov 8, 2024 · 11ee00d · 11ee00d
1 parent 45ae535
commit 11ee00d
Show file tree

Hide file tree

Showing 4 changed files with 15 additions and 7 deletions.
diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx
@@ -199,7 +199,7 @@ const HeaderItems = styled.nav<{
   }}
 `;
 const logoXXSHeightPx = 24;
-const logoSHeightPx = 47;
+const logoSHeightPx = 24;
 const LogoImg = styled.img`
   height: ${logoXXSHeightPx}px;
   cursor: pointer;

diff --git a/src/components/header/HeaderLinks.tsx b/src/components/header/HeaderLinks.tsx
@@ -111,8 +111,8 @@ const NavigationLinks = styled.div<{
                 justify-content: center;
                 padding-top: 1rem;
                 padding-bottom: 1rem;
-                padding-left: 0.1rem;
-                padding-right: 0.1rem;
+                padding-left: 1.5rem;
+                padding-right: 1.5rem;
               }
             `;
           }}
@@ -148,7 +148,7 @@ const ItemsList = styled.div<{
   ${({ $isMobile }) =>
     !$isMobile &&
     css`
-      gap: 1rem;
+      gap: 0;
     `}
 `;
 

diff --git a/src/components/modal/components/Explore/Collections/CollectionsCard.tsx b/src/components/modal/components/Explore/Collections/CollectionsCard.tsx
@@ -22,8 +22,7 @@ const CardContainer = styled.div<{
   display: flex;
   cursor: pointer;
   flex-direction: column;
-  box-shadow: 0 0 0 2px ${colors.lightGrey};
-  filter: drop-shadow(0 0 2px ${colors.lightGrey});
+  border: 2px solid ${colors.lightGrey};
   border-radius: 4px;
   transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
   min-width: 16.5625rem;

diff --git a/src/pages/landing/Landing.tsx b/src/pages/landing/Landing.tsx
@@ -60,6 +60,9 @@ const Title = styled(Typography)`
 `;
 const SubTitle = styled(Typography)`
   margin-bottom: 0.5rem;
+  ${breakpoint.m} {
+    max-width: 21.25rem;
+  }
 `;
 const ExploreContainer = styled.div`
   margin-top: 2rem;
@@ -81,6 +84,7 @@ const ExploreProductsButton = styled(BosonButton)`
   background-color: var(--buttonBgColor);
   border-color: var(--buttonBgColor);
   color: var(--buttonTextColor);
+  margin-top: 0.625rem;
 `;
 
 const LandingContainer = styled.div`
@@ -311,7 +315,12 @@ export default function Landing() {
               flexDirection="column"
               padding="0.9375rem 2.5rem 2.5rem 2.5rem"
             >
-              <Title tag="h1" fontWeight="600" fontSize="2.0625rem">
+              <Title
+                tag="h1"
+                fontWeight="600"
+                fontSize="2.0625rem"
+                marginBottom={"0.625rem"}
+              >
                 Tokenize, transfer and trade any physical asset as an NFT
               </Title>
               <SubTitle tag="h4" fontWeight="400" fontSize="1.25rem">