calvin.erfmann/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-01-28 22:00:51 +00:00
Code Issues Packages Projects Releases Wiki Activity

add color to product updates

Browse Source
This commit is contained in:
miloschwartz
2025-12-19 10:45:45 -05:00
parent 1d7e55bf98
commit d414617f9d
1 changed files with 47 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files

99
src/components/ProductUpdates.tsx
View File

@@ -184,22 +184,20 @@ function ProductUpdatesListPopup({
<PopoverTrigger asChild>
<div
className={cn(
"relative z-1 cursor-pointer block",
"rounded-md border bg-muted p-2 py-3 w-full flex flex-col gap-2 text-sm",
"relative z-1 cursor-pointer block group",
"rounded-md border border-primary/30 bg-gradient-to-br dark:from-primary/20 from-primary/20 via-background to-background p-2 py-3 w-full flex flex-col gap-2 text-sm",
"transition duration-300 ease-in-out",
"data-closed:opacity-0 data-closed:translate-y-full"
)}
>
<div className="flex items-center gap-2">
<div className="rounded-md bg-muted-foreground/20 p-2">
<BellIcon className="flex-none size-4" />
</div>
<BellIcon className="flex-none size-4 text-primary" />
<div className="flex justify-between items-center flex-1">
<p className="font-medium text-start">
{t("productUpdateWhatsNew")}
</p>
<div className="p-1 cursor-pointer">
<ChevronRightIcon className="size-4 flex-none opacity-50" />
<ChevronRightIcon className="size-3.5 flex-none opacity-50 transition-transform duration-300 ease-in-out group-hover:translate-x-1" />
</div>
</div>
</div>
@@ -334,53 +332,50 @@ function NewVersionAvailable({
return (
<Transition show={open}>
<div
className={cn(
"relative z-2",
"rounded-md border bg-muted p-2 py-3 w-full flex flex-col gap-2 text-sm",
"transition duration-300 ease-in-out",
"data-closed:opacity-0 data-closed:translate-y-full"
)}
>
{version && (
<>
<div className="flex items-center gap-2">
<div className="rounded-md bg-muted-foreground/20 p-2">
<RocketIcon className="flex-none size-4" />
</div>
<p className="font-medium flex-1">
{t("pangolinUpdateAvailable")}
</p>
<button
className="p-1 cursor-pointer"
onClick={() => {
setOpen(false);
onDimiss();
}}
>
<XIcon className="size-4 flex-none" />
</button>
{version && (
<a
href={version.pangolin.releaseNotes}
target="_blank"
rel="noopener noreferrer"
className={cn(
"relative z-2 group cursor-pointer block",
"rounded-md border border-primary/30 bg-gradient-to-br dark:from-primary/20 from-primary/20 via-background to-background p-2 py-3 w-full flex flex-col gap-2 text-sm",
"transition duration-300 ease-in-out",
"data-closed:opacity-0 data-closed:translate-y-full"
)}
>
<div className="flex items-center gap-2">
<RocketIcon className="flex-none size-4 text-primary" />
<p className="font-medium flex-1">
{t("pangolinUpdateAvailable")}
</p>
<button
className="p-1 cursor-pointer z-10"
onClick={(e) => {
e.preventDefault();
e.stopPropagation();
setOpen(false);
onDimiss();
}}
>
<XIcon className="size-3 flex-none opacity-50" />
</button>
</div>
<div className="flex flex-col gap-0.5">
<small className="text-muted-foreground">
{t("pangolinUpdateAvailableInfo", {
version: version.pangolin.latestVersion
})}
</small>
<div className="inline-flex items-center gap-1 text-xs">
<span>
{t("pangolinUpdateAvailableReleaseNotes")}
</span>
<ArrowRight className="flex-none size-3 transition-transform duration-300 ease-in-out group-hover:translate-x-1" />
</div>
<div className="flex flex-col gap-0.5">
<small className="text-muted-foreground">
{t("pangolinUpdateAvailableInfo", {
version: version.pangolin.latestVersion
})}
</small>
<a
href={version.pangolin.releaseNotes}
target="_blank"
className="inline-flex items-center gap-1 text-xs font-medium"
>
<span>
{t("pangolinUpdateAvailableReleaseNotes")}
</span>
<ArrowRight className="flex-none size-3" />
</a>
</div>
</>
)}
</div>
</div>
</a>
)}
</Transition>
);
}