adjust grid carousel breakpoints

This commit is contained in:
jeffvli
2025-12-03 17:48:58 -08:00
parent d604074d82
commit 85c0d8503b
@@ -45,12 +45,13 @@ const pageVariants: Variants = {
function BaseGridCarousel(props: GridCarouselProps) { function BaseGridCarousel(props: GridCarouselProps) {
const { cards, hasNextPage, loadNextPage, onNextPage, onPrevPage, rowCount = 1, title } = props; const { cards, hasNextPage, loadNextPage, onNextPage, onPrevPage, rowCount = 1, title } = props;
const { ref, ...cq } = useContainerQuery({ const { ref, ...cq } = useContainerQuery({
'2xl': 1024, '2xl': 1280,
'3xl': 1280, '3xl': 1440,
lg: 768, lg: 960,
md: 600, md: 720,
sm: 360, sm: 520,
xl: 900, xl: 1152,
xs: 360,
}); });
const [currentPage, setCurrentPage] = useState({ const [currentPage, setCurrentPage] = useState({
@@ -209,19 +210,19 @@ function getCardsToShow(breakpoints: {
} }
if (breakpoints.isLargerThan2xl) { if (breakpoints.isLargerThan2xl) {
return 6; return 7;
} }
if (breakpoints.isLargerThanXl) { if (breakpoints.isLargerThanXl) {
return 5; return 6;
} }
if (breakpoints.isLargerThanLg) { if (breakpoints.isLargerThanLg) {
return 4; return 5;
} }
if (breakpoints.isLargerThanMd) { if (breakpoints.isLargerThanMd) {
return 3; return 4;
} }
if (breakpoints.isLargerThanSm) { if (breakpoints.isLargerThanSm) {