Learn page xl breakpoint
This commit is contained in:
+4
-2
@@ -44,7 +44,7 @@ export default function LearnPage() {
|
||||
</div>
|
||||
|
||||
{/* smd and up: 2x3 grid of vertical thumbnails, repeat posts as needed */}
|
||||
<div className="hidden smd:grid smd:grid-cols-2 xmd:grid-cols-3 lg:grid-cols-3 lg2:grid-cols-4 smd:gap-[var(--spacing-scale-008)] md:gap-[var(--spacing-scale-016)] xmd:gap-[var(--spacing-scale-012)] lg:gap-[var(--spacing-scale-016)] lg2:gap-x-[var(--spacing-scale-016)] lg2:gap-y-[var(--spacing-scale-024)] smd:pt-[var(--spacing-scale-024)] smd:pb-[var(--spacing-scale-024)] smd:px-[var(--spacing-scale-020)] md:px-[var(--spacing-scale-032)] lg:pt-[var(--spacing-scale-032)] lg:pb-[var(--spacing-scale-064)] lg:px-[var(--spacing-scale-064)]">
|
||||
<div className="hidden smd:grid smd:grid-cols-2 xmd:grid-cols-3 lg:grid-cols-3 lg2:grid-cols-4 xl:grid-cols-5 smd:gap-[var(--spacing-scale-008)] md:gap-[var(--spacing-scale-016)] xmd:gap-[var(--spacing-scale-012)] lg:gap-[var(--spacing-scale-016)] lg2:gap-x-[var(--spacing-scale-016)] lg2:gap-y-[var(--spacing-scale-024)] xl:gap-x-[var(--spacing-scale-016)] xl:gap-y-[var(--spacing-scale-016)] smd:pt-[var(--spacing-scale-024)] smd:pb-[var(--spacing-scale-024)] smd:px-[var(--spacing-scale-020)] md:px-[var(--spacing-scale-032)] lg:pt-[var(--spacing-scale-032)] lg:pb-[var(--spacing-scale-064)] lg:px-[var(--spacing-scale-064)]">
|
||||
{Array.from({ length: 16 }).map((_, i) => {
|
||||
const post = allPosts[i % allPosts.length];
|
||||
return (
|
||||
@@ -54,7 +54,9 @@ export default function LearnPage() {
|
||||
}`}
|
||||
post={post}
|
||||
variant="vertical"
|
||||
className={i >= 6 ? "hidden lg2:block" : ""}
|
||||
className={`${i >= 6 ? "hidden lg2:block" : ""} ${
|
||||
i >= 10 ? "xl:hidden" : ""
|
||||
}`}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
|
||||
Reference in New Issue
Block a user