feat: improve theme and usability

This commit is contained in:
Thomas Camlong
2025-10-02 12:30:22 +02:00
parent 680246d50e
commit d542377d97
4 changed files with 15 additions and 18 deletions

View File

@@ -104,7 +104,7 @@ export default function DashboardPage() {
// Success state
return (
<main className="container mx-auto pt-12 pb-14 px-4 sm:px-6 lg:px-8">
<Card className="bg-background/50 border shadow-lg">
<Card className="bg-background/50 border-none shadow-lg">
<CardHeader>
<CardTitle>Submissions Dashboard</CardTitle>
<CardDescription>

View File

@@ -165,8 +165,6 @@
--popover-foreground: oklch(0.1884 0.0128 248.5103);
--primary: oklch(0.6723 0.1606 244.9955);
--primary-foreground: oklch(1.0000 0 0);
--secondary: oklch(0.1884 0.0128 248.5103);
--secondary-foreground: oklch(0.45 0.03 256.8);
--muted: oklch(0.98 0 247.84);
--muted-foreground: oklch(0.55 0.02 264.36);
--accent: oklch(0.9392 0.0166 250.8453);
@@ -204,8 +202,6 @@
--ring: oklch(0.6818 0.1584 243.3540);
--font-sans: Open Sans, sans-serif;
--font-serif: Georgia, serif;
--font-mono: Menlo, monospace;

View File

@@ -218,7 +218,7 @@ export function HeroSection({ totalIcons, stars }: { totalIcons: number; stars:
<AuroraText colors={["#FA5352", "#FA5352", "orange"]}>dashboard icons</AuroraText>
</h1>
<p className="text-sm sm:text-base md:text-xl text-muted-foreground leading-relaxed mb-8 font-light tracking-wide max-w-2xl mx-auto px-4 motion-preset-slide-down motion-duration-500">
<p className="text-sm sm:text-base md:text-xl text-muted-foreground leading-relaxed mb-8 font-medium tracking-wide max-w-2xl mx-auto px-4 motion-preset-slide-down motion-duration-500">
A collection of{" "}
<NumberTicker value={totalIcons} startValue={1000} className="font-bold tracking-tighter text-muted-foreground" /> curated icons
for services, applications and tools, designed specifically for dashboards and app directories.
@@ -277,8 +277,8 @@ export default function GiveUsAStarButton({ stars }: { stars: string | number })
</div>
<div className="space-y-2">
<h5 className="text-sm font-medium text-secondary-foreground">How your star helps us:</h5>
<ul className="text-xs text-secondary-foreground/80 space-y-1.5">
<h5 className="text-sm font-medium text-muted-foreground">How your star helps us:</h5>
<ul className="text-xs text-muted-foreground/80 space-y-1.5">
<li className="flex items-start gap-2">
<TrendingUp className="h-3.5 w-3.5 text-primary flex-shrink-0 mt-0.5" />
<span>Increases our visibility in GitHub search results</span>
@@ -310,7 +310,7 @@ export default function GiveUsAStarButton({ stars }: { stars: string | number })
<Button
variant="link"
size="sm"
className="flex items-center gap-1 text-xs text-secondary-foreground"
className="flex items-center gap-1 text-xs text-muted-foreground"
onClick={() =>
window.open("https://docs.github.com/get-started/exploring-projects-on-github/saving-repositories-with-stars", "_blank")
}
@@ -360,8 +360,8 @@ export function GiveUsLoveButton() {
</div>
<div className="space-y-2">
<h5 className="text-sm font-medium text-secondary-foreground">Our Privacy Promise:</h5>
<ul className="text-xs text-secondary-foreground/80 space-y-1.5">
<h5 className="text-sm font-medium text-muted-foreground">Our Privacy Promise:</h5>
<ul className="text-xs text-muted-foreground/80 space-y-1.5">
<li className="flex items-start gap-2">
<span className="text-primary font-bold">✓</span>
<span>We don't track your browsing habits</span>
@@ -380,11 +380,11 @@ export function GiveUsLoveButton() {
<Separator className="bg-secondary/20" />
<div className="space-y-2">
<h5 className="text-sm font-medium text-secondary-foreground flex items-center gap-2">
<h5 className="text-sm font-medium text-muted-foreground flex items-center gap-2">
<Share2 className="h-4 w-4 text-primary" />
Spread the word
</h5>
<p className="text-xs text-secondary-foreground/80">
<p className="text-xs text-muted-foreground/80">
Don't want to disable your ad blocker? You can still help us by sharing our website with others who might find it useful.
</p>
</div>
@@ -428,8 +428,8 @@ export function GiveUsMoneyButton() {
</div>
<div className="space-y-2">
<h5 className="text-sm font-medium text-secondary-foreground">Where your money goes:</h5>
<ul className="text-xs text-secondary-foreground/80 space-y-1.5">
<h5 className="text-sm font-medium text-muted-foreground">Where your money goes:</h5>
<ul className="text-xs text-muted-foreground/80 space-y-1.5">
<li className="flex items-start gap-2">
<Server className="h-3.5 w-3.5 text-primary flex-shrink-0 mt-0.5" />
<span>Hosting and infrastructure costs</span>
@@ -456,7 +456,7 @@ export function GiveUsMoneyButton() {
</Button>
</Link>
<Link href={`${openCollectiveUrl}/transactions`} target="_blank" rel="noopener noreferrer">
<Button variant="link" size="sm" className="flex items-center gap-1 text-xs text-secondary-foreground">
<Button variant="link" size="sm" className="flex items-center gap-1 text-xs text-muted-foreground">
View transactions
<ExternalLink className="h-3 w-3" />
</Button>

View File

@@ -330,10 +330,11 @@ export function SubmissionsDataTable({
<div className="space-y-4">
{/* Search and Filters */}
<div className="flex flex-col sm:flex-row gap-4">
<div className="relative flex-1">
<div className="relative flex-1 border rounded-md bg-background">
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground h-4 w-4" />
<Input
placeholder="Search submissions..."
autoFocus
value={globalFilter ?? ""}
onChange={(event) => setGlobalFilter(String(event.target.value))}
className="pl-10"
@@ -377,7 +378,7 @@ export function SubmissionsDataTable({
</TableRow>
))}
</TableHeader>
<TableBody>
<TableBody className="bg-background">
{table.getRowModel().rows?.length ? (
(() => {
let lastStatus: string | null = null