diff --git a/src/components/header/Header.tsx b/src/components/header/Header.tsx index b6464dd84..5325022d8 100644 --- 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 index c05b70767..4c80ff64c 100644 --- 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 index 7b833753a..1438b3af8 100644 --- 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 index 872e29a35..9fe233db2 100644 --- 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" + marginBottom={"0.625rem"} + > Tokenize, transfer and trade any physical asset as an NFT