mirror of
https://github.com/jeffvli/feishin.git
synced 2026-05-07 04:20:12 +02:00
add favorite badge to card
This commit is contained in:
@@ -53,6 +53,19 @@
|
||||
}
|
||||
}
|
||||
|
||||
.favorite-badge {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 2;
|
||||
width: 0;
|
||||
height: 0;
|
||||
pointer-events: none;
|
||||
border-color: var(--theme-colors-primary) transparent transparent transparent;
|
||||
border-style: solid;
|
||||
border-width: 24px 24px 0 0;
|
||||
}
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
@@ -212,12 +212,16 @@ const CompactItemCard = ({
|
||||
[styles.isRound]: isRound,
|
||||
});
|
||||
|
||||
const isFavorite =
|
||||
'userFavorite' in data && (data as { userFavorite: boolean }).userFavorite;
|
||||
|
||||
const imageContainerContent = (
|
||||
<>
|
||||
<Image
|
||||
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
||||
src={imageUrl}
|
||||
/>
|
||||
{isFavorite && <div className={styles.favoriteBadge} />}
|
||||
<AnimatePresence>
|
||||
{withControls && showControls && (
|
||||
<ItemCardControls
|
||||
@@ -400,12 +404,16 @@ const DefaultItemCard = ({
|
||||
[styles.isRound]: isRound,
|
||||
});
|
||||
|
||||
const isFavorite =
|
||||
'userFavorite' in data && (data as { userFavorite: boolean }).userFavorite;
|
||||
|
||||
const imageContainerContent = (
|
||||
<>
|
||||
<Image
|
||||
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
||||
src={imageUrl}
|
||||
/>
|
||||
{isFavorite && <div className={styles.favoriteBadge} />}
|
||||
<AnimatePresence>
|
||||
{withControls && showControls && (
|
||||
<ItemCardControls
|
||||
@@ -633,12 +641,16 @@ const PosterItemCard = ({
|
||||
[styles.isRound]: isRound,
|
||||
});
|
||||
|
||||
const isFavorite =
|
||||
'userFavorite' in data && (data as { userFavorite: boolean }).userFavorite;
|
||||
|
||||
const imageContainerContent = (
|
||||
<>
|
||||
<Image
|
||||
className={clsx(styles.image, { [styles.isRound]: isRound })}
|
||||
src={imageUrl}
|
||||
/>
|
||||
{isFavorite && <div className={styles.favoriteBadge} />}
|
||||
<AnimatePresence>
|
||||
{withControls && showControls && data && (
|
||||
<ItemCardControls
|
||||
|
||||
Reference in New Issue
Block a user