diff --git a/src/containers/HomePage/HomePage.tsx b/src/containers/HomePage/HomePage.tsx index a7f4b9a..34209ea 100644 --- a/src/containers/HomePage/HomePage.tsx +++ b/src/containers/HomePage/HomePage.tsx @@ -92,7 +92,12 @@ export const HomePage: React.FC = ({ item?.type === 'article') + .slice(0, 1), + ...highlighted.slice(0, 1), + ]} pattern={[{ cols: 2, size: 'large' }]} breakpoints={[ { @@ -324,18 +329,40 @@ const FeaturedFirst = styled.div` .show-details { margin-top: var(--lsd-spacing-32) !important; } + + .post-card__subtitle { + margin-top: var(--lsd-spacing-16) !important; + } } ` const FeaturedSecond = styled.div` margin-bottom: var(--lsd-spacing-64); + .post-card { + gap: 0 var(--lsd-spacing-16) !important; + } + .post-card__title-text { font-size: var(--lsd-h5-fontSize) !important; font-weight: var(--lsd-h5-fontWeight) !important; line-height: var(--lsd-h5-lineHeight) !important; } + .post-card__label { + margin-top: var(--lsd-spacing-16) !important; + } + + .post-card__label * { + font-size: var(--lsd-subtitle4-fontSize) !important; + font-weight: var(--lsd-subtitle4-fontWeight) !important; + line-height: var(--lsd-subtitle4-lineHeight) !important; + } + + .post-card__subtitle { + margin-top: var(--lsd-spacing-16) !important; + } + .post-card-wrapper { border-top: 1px solid rgb(var(--lsd-border-primary)); } @@ -344,6 +371,11 @@ const FeaturedSecond = styled.div` margin-top: var(--lsd-spacing-40); margin-bottom: var(--lsd-spacing-80); + .row { + margin-right: -16px; + padding-right: 16px; + } + .post-card-wrapper { width: 327px;