terry-wallet-login #15
@@ -5,9 +5,10 @@ import { useI18n } from "../i18n";
|
||||
import { useLocalizedPath } from "../useLocalizedPath";
|
||||
import { resourceTypeLabel } from "../resourceTypeLabels";
|
||||
import { formatDateYmd } from "../utils/format";
|
||||
import { FavoriteButton } from "../favorites/FavoriteButton";
|
||||
|
||||
const LATEST_CARD_CLASS =
|
||||
"flex min-h-[106px] items-start gap-4 overflow-hidden rounded-xl border border-ark-line bg-ark-panel p-4 outline-none transition hover:border-ark-gold/45 focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg md:min-h-[138px] md:p-5";
|
||||
"relative flex min-h-[106px] items-start gap-4 overflow-hidden rounded-xl border border-ark-line bg-ark-panel p-4 outline-none transition hover:border-ark-gold/45 focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg md:min-h-[138px] md:p-5";
|
||||
|
||||
export function LatestUpdateRow({
|
||||
r,
|
||||
@@ -21,15 +22,20 @@ export function LatestUpdateRow({
|
||||
const dateStr = formatDateYmd(r.updatedAt);
|
||||
|
||||
return (
|
||||
<Link to={lp(`/resource/${r.id}`)} className={LATEST_CARD_CLASS}>
|
||||
<div className="flex shrink-0 items-center justify-center pt-0.5">
|
||||
<article className={LATEST_CARD_CLASS}>
|
||||
<Link
|
||||
to={lp(`/resource/${r.id}`)}
|
||||
aria-label={r.title}
|
||||
className="absolute inset-0 z-0 rounded-xl outline-none focus-visible:ring-2 focus-visible:ring-ark-gold/80"
|
||||
/>
|
||||
<div className="relative z-10 flex shrink-0 items-center justify-center pt-0.5">
|
||||
<CategoryIcon
|
||||
iconKey={iconKey}
|
||||
categorySlug={r.categorySlug}
|
||||
className="h-10 w-10 text-ark-gold"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex min-w-0 flex-1 self-stretch py-0.5 flex-col">
|
||||
<div className="pointer-events-none relative z-10 flex min-w-0 flex-1 self-stretch py-0.5 flex-col pr-11">
|
||||
<div className="text-base font-bold leading-snug text-white line-clamp-2 md:text-lg">
|
||||
{r.title}
|
||||
</div>
|
||||
@@ -43,7 +49,12 @@ export function LatestUpdateRow({
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Link>
|
||||
<FavoriteButton
|
||||
resourceId={r.id}
|
||||
size="sm"
|
||||
className="absolute right-3 top-3 z-20"
|
||||
/>
|
||||
</article>
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user