vanja/feishin
1
0
Fork 0
mirror of https://github.com/jeffvli/feishin.git synced 2026-05-08 13:00:13 +02:00
Code Issues Packages Projects Releases Wiki Activity

re-add similar artists carousel to artist page

Browse Source
This commit is contained in:
jeffvli
2025-12-27 01:13:28 -08:00
parent f0d22267c3
commit 3db229ef68
5 changed files with 194 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/components/grid-carousel/grid-carousel-v2.tsx
+52 -32
View File
@@ -157,45 +157,65 @@ function BaseGridCarousel(props: GridCarouselProps) {
{cq.isCalculated && (
<>
<div className={styles.navigation}>
<Group gap="xs" justify="space-between" w="100%">
<Group gap="xs">
{typeof title === 'string' ? (
{typeof title === 'string' ? (
<Group gap="xs" justify="space-between" w="100%">
<Group gap="xs">
<TextTitle fw={700} isNoSelect order={3}>
{title}
</TextTitle>
) : (
title
)}
{enableRefresh && onRefresh && (
{enableRefresh && onRefresh && (
<ActionIcon
icon="refresh"
iconProps={{ size: 'xs' }}
onClick={onRefresh}
size="xs"
tooltip={{ label: 'Refresh' }}
variant="transparent"
/>
)}
</Group>
<Group gap="xs" justify="end">
<ActionIcon
icon="refresh"
iconProps={{ size: 'xs' }}
onClick={onRefresh}
disabled={isPrevDisabled}
icon="arrowLeftS"
iconProps={{ size: 'lg' }}
onClick={handlePrevPage}
size="xs"
tooltip={{ label: 'Refresh' }}
variant="transparent"
variant="subtle"
/>
)}
<ActionIcon
disabled={isNextDisabled}
icon="arrowRightS"
iconProps={{ size: 'lg' }}
onClick={handleNextPage}
size="xs"
variant="subtle"
/>
</Group>
</Group>
<Group gap="xs" justify="end">
<ActionIcon
disabled={isPrevDisabled}
icon="arrowLeftS"
iconProps={{ size: 'lg' }}
onClick={handlePrevPage}
size="xs"
variant="subtle"
/>
<ActionIcon
disabled={isNextDisabled}
icon="arrowRightS"
iconProps={{ size: 'lg' }}
onClick={handleNextPage}
size="xs"
variant="subtle"
/>
</Group>
</Group>
) : (
<div className={styles.customTitleContainer}>
<div className={styles.customTitleContent}>{title}</div>
<Group gap="xs" justify="end">
<ActionIcon
disabled={isPrevDisabled}
icon="arrowLeftS"
iconProps={{ size: 'lg' }}
onClick={handlePrevPage}
size="xs"
variant="subtle"
/>
<ActionIcon
disabled={isNextDisabled}
icon="arrowRightS"
iconProps={{ size: 'lg' }}
onClick={handleNextPage}
size="xs"
variant="subtle"
/>
</Group>
</div>
)}
</div>
<AnimatePresence custom={currentPage} initial={false} mode="wait">
<motion.div
src/renderer/components/grid-carousel/grid-carousel.module.css
+13
View File
@@ -14,6 +14,19 @@
justify-content: space-between;
}
.custom-title-container {
display: flex;
align-items: center;
justify-content: space-between;
width: 100%;
gap: var(--theme-spacing-sm);
}
.custom-title-content {
flex: 1;
min-width: 0;
}
.grid {
display: grid;
grid-template-columns: repeat(var(--cards-to-show, 2), minmax(0, 1fr));