null/BillTracker
null
/
BillTracker
1
0
Fork 0
Code Issues 4 Pull Requests Packages Projects Releases 1 Wiki Activity

brighten dark mode

This commit is contained in:
null 2026-05-28 19:30:46 -05:00
parent 0fd82568cc
commit 1f3a254c7c
6 changed files with 58 additions and 58 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
client/components/MobileTrackerRow.jsx
View File

@ -13,12 +13,12 @@ const MONTHS = [
];
const ROW_STATUS_CLS = {
paid: 'bg-emerald-500/[0.04]',
autodraft: 'bg-sky-500/[0.04]',
paid: 'bg-emerald-500/[0.04] dark:bg-emerald-400/[0.05]',
autodraft: 'bg-sky-500/[0.04] dark:bg-sky-400/[0.04]',
upcoming: '',
due_soon: 'bg-amber-400/[0.07] dark:bg-amber-400/[0.05]',
late: 'bg-orange-400/[0.08] dark:bg-orange-400/[0.05]',
missed: 'bg-red-400/[0.08] dark:bg-rose-400/[0.05]',
due_soon: 'bg-amber-400/[0.07] dark:bg-amber-300/[0.035]',
late: 'bg-orange-400/[0.08] dark:bg-orange-300/[0.035]',
missed: 'bg-red-400/[0.08] dark:bg-rose-300/[0.03]',
};
function paymentDateForTrackerMonth(year, month, dueDay) {

10
client/components/StatusBadge.jsx
View File

@ -2,12 +2,12 @@ import React, { useMemo } from 'react';
import { cn } from '@/lib/utils';
const STATUS_META = {
paid: { label: 'Paid', cls: 'bg-emerald-500/15 text-emerald-500 border border-emerald-500/30' },
paid: { label: 'Paid', cls: 'bg-emerald-500/15 text-emerald-500 border border-emerald-500/30 dark:text-emerald-300 dark:border-emerald-300/25' },
upcoming: { label: 'Upcoming', cls: 'bg-secondary text-muted-foreground border border-border' },
due_soon: { label: 'Due Soon', cls: 'bg-amber-400/15 text-amber-500 border border-amber-400/30' },
late: { label: 'Late', cls: 'bg-orange-400/15 text-orange-500 border border-orange-400/30 dark:bg-orange-400/10 dark:text-orange-300 dark:border-orange-400/20' },
missed: { label: 'Missed', cls: 'bg-red-400/15 text-red-500 border border-red-400/30 dark:bg-rose-400/10 dark:text-rose-300 dark:border-rose-400/20' },
autodraft: { label: 'Autodraft', cls: 'bg-sky-400/15 text-sky-500 border border-sky-400/30' },
due_soon: { label: 'Due Soon', cls: 'bg-amber-400/15 text-amber-500 border border-amber-400/30 dark:text-amber-300 dark:border-amber-300/25' },
late: { label: 'Late', cls: 'bg-orange-400/15 text-orange-500 border border-orange-400/30 dark:bg-orange-300/10 dark:text-orange-300 dark:border-orange-300/22' },
missed: { label: 'Missed', cls: 'bg-red-400/15 text-red-500 border border-red-400/30 dark:bg-rose-300/10 dark:text-rose-300 dark:border-rose-300/22' },
autodraft: { label: 'Autodraft', cls: 'bg-sky-400/15 text-sky-500 border border-sky-400/30 dark:text-sky-300 dark:border-sky-300/25' },
skipped: { label: 'Skipped', cls: 'bg-muted text-muted-foreground border border-border' },
};

10
client/components/SummaryCard.jsx
View File

@ -19,7 +19,7 @@ const CARD_DEFS = {
bar: 'from-emerald-500 to-emerald-300',
glow: 'shadow-[0_4px_20px_rgba(16,185,129,0.15)]',
borderActive: 'border-emerald-400/40',
valueClass: 'text-emerald-500',
valueClass: 'text-emerald-600 dark:text-emerald-300',
activateWhen: (v) => v > 0,
},
remaining: {
@ -33,10 +33,10 @@ const CARD_DEFS = {
overdue: {
label: 'Overdue',
icon: AlertCircle,
bar: 'from-rose-500 to-orange-400',
glow: 'shadow-[0_4px_20px_rgba(239,68,68,0.12)]',
borderActive: 'border-red-400/40',
valueClass: 'text-red-500',
bar: 'from-rose-400 to-orange-300',
glow: 'shadow-[0_4px_20px_rgba(251,113,133,0.10)]',
borderActive: 'border-rose-400/35',
valueClass: 'text-red-500 dark:text-rose-300',
activateWhen: (v) => v > 0,
},
};

2
client/components/layout/Layout.jsx
View File

@ -3,7 +3,7 @@ import AppNavigation from './Sidebar';
export default function Layout({ mainContentId }) {
return (
<div className="min-h-screen bg-[radial-gradient(circle_at_top_left,oklch(var(--primary)/0.06),transparent_34rem),linear-gradient(180deg,oklch(var(--background)),oklch(var(--muted)/0.18))] text-foreground"
<div className="min-h-screen bg-[radial-gradient(circle_at_top_left,oklch(var(--primary)/0.10),transparent_34rem),linear-gradient(180deg,oklch(var(--background)),oklch(var(--muted)/0.22))] text-foreground"
role="main"
aria-labelledby={mainContentId}
>

54
client/index.css
View File

@ -69,38 +69,38 @@
}
.dark {
--background: 0.20 0.008 250;
--foreground: 0.91 0.006 250;
--card: 0.24 0.009 250;
--card-foreground: 0.91 0.006 250;
--popover: 0.27 0.009 250;
--popover-foreground: 0.91 0.006 250;
--primary: 0.62 0.20 276;
--primary-foreground: 0.98 0.004 250;
--secondary: 0.28 0.012 255;
--secondary-foreground: 0.88 0.006 250;
--muted: 0.27 0.008 250;
--muted-foreground: 0.62 0.010 250;
--accent: 0.30 0.015 265;
--accent-foreground: 0.91 0.006 250;
--destructive: 0.65 0.18 22;
--destructive-foreground: 0.98 0.004 250;
--border: 0.32 0.009 250;
--input: 0.32 0.009 250;
--ring: 0.55 0.16 276;
--background: 0.22 0.012 245;
--foreground: 0.94 0.006 245;
--card: 0.27 0.012 245;
--card-foreground: 0.94 0.006 245;
--popover: 0.30 0.012 245;
--popover-foreground: 0.94 0.006 245;
--primary: 0.68 0.15 150;
--primary-foreground: 0.16 0.010 245;
--secondary: 0.33 0.014 250;
--secondary-foreground: 0.91 0.006 245;
--muted: 0.32 0.012 250;
--muted-foreground: 0.72 0.012 245;
--accent: 0.35 0.018 160;
--accent-foreground: 0.94 0.006 245;
--destructive: 0.68 0.16 26;
--destructive-foreground: 0.98 0.004 245;
--border: 0.38 0.012 245;
--input: 0.38 0.012 245;
--ring: 0.66 0.14 150;
--chart-1: 0.55 0.22 270;
--chart-2: 0.62 0.14 150;
--chart-3: 0.65 0.18 310;
--chart-4: 0.62 0.16 130;
--chart-5: 0.58 0.18 255;
--sidebar: 0.17 0.007 250;
--sidebar-foreground: 0.88 0.006 250;
--sidebar-primary: 0.62 0.20 276;
--sidebar-primary-foreground: 0.98 0.004 250;
--sidebar-accent: 0.25 0.009 250;
--sidebar-accent-foreground: 0.88 0.006 250;
--sidebar-border: 0.26 0.008 250;
--sidebar-ring: 0.62 0.20 276;
--sidebar: 0.20 0.010 245;
--sidebar-foreground: 0.92 0.006 245;
--sidebar-primary: 0.68 0.15 150;
--sidebar-primary-foreground: 0.16 0.010 245;
--sidebar-accent: 0.30 0.014 160;
--sidebar-accent-foreground: 0.92 0.006 245;
--sidebar-border: 0.34 0.012 245;
--sidebar-ring: 0.66 0.14 150;
}
* {

30
client/pages/TrackerPage.jsx
View File

@ -49,21 +49,21 @@ function paymentDateForTrackerMonth(year, month, dueDay) {
}
const ROW_STATUS_CLS = {
paid: 'bg-emerald-500/[0.04]',
autodraft: 'bg-sky-500/[0.04]',
paid: 'bg-emerald-500/[0.04] dark:bg-emerald-400/[0.05]',
autodraft: 'bg-sky-500/[0.04] dark:bg-sky-400/[0.04]',
upcoming: '',
due_soon: 'bg-amber-400/[0.07] dark:bg-amber-400/[0.05]',
late: 'bg-orange-400/[0.08] dark:bg-orange-400/[0.05]',
missed: 'bg-red-400/[0.08] dark:bg-rose-400/[0.05]',
due_soon: 'bg-amber-400/[0.07] dark:bg-amber-300/[0.035]',
late: 'bg-orange-400/[0.08] dark:bg-orange-300/[0.035]',
missed: 'bg-red-400/[0.08] dark:bg-rose-300/[0.03]',
};
const STATUS_META = {
paid: { label: 'Paid', cls: 'bg-emerald-500/15 text-emerald-500 border border-emerald-500/30' },
paid: { label: 'Paid', cls: 'bg-emerald-500/15 text-emerald-500 border border-emerald-500/30 dark:text-emerald-300 dark:border-emerald-300/25' },
upcoming: { label: 'Upcoming', cls: 'bg-secondary text-muted-foreground border border-border' },
due_soon: { label: 'Due Soon', cls: 'bg-amber-400/15 text-amber-500 border border-amber-400/30' },
late: { label: 'Late', cls: 'bg-orange-400/15 text-orange-500 border border-orange-400/30' },
missed: { label: 'Missed', cls: 'bg-red-400/15 text-red-500 border border-red-400/30' },
autodraft: { label: 'Autodraft', cls: 'bg-sky-400/15 text-sky-500 border border-sky-400/30' },
due_soon: { label: 'Due Soon', cls: 'bg-amber-400/15 text-amber-500 border border-amber-400/30 dark:text-amber-300 dark:border-amber-300/25' },
late: { label: 'Late', cls: 'bg-orange-400/15 text-orange-500 border border-orange-400/30 dark:bg-orange-300/10 dark:text-orange-300 dark:border-orange-300/22' },
missed: { label: 'Missed', cls: 'bg-red-400/15 text-red-500 border border-red-400/30 dark:bg-rose-300/10 dark:text-rose-300 dark:border-rose-300/22' },
autodraft: { label: 'Autodraft', cls: 'bg-sky-400/15 text-sky-500 border border-sky-400/30 dark:text-sky-300 dark:border-sky-300/25' },
skipped: { label: 'Skipped', cls: 'bg-muted text-muted-foreground border border-border' },
};
@ -134,7 +134,7 @@ const CARD_DEFS = {
bar: 'from-emerald-500 to-emerald-300',
glow: 'shadow-[0_4px_20px_rgba(16,185,129,0.15)]',
borderActive: 'border-emerald-400/40',
valueClass: 'text-emerald-500',
valueClass: 'text-emerald-600 dark:text-emerald-300',
activateWhen: (v) => v > 0,
},
remaining: {
@ -148,10 +148,10 @@ const CARD_DEFS = {
overdue: {
label: 'Overdue',
icon: AlertCircle,
bar: 'from-rose-500 to-orange-400',
glow: 'shadow-[0_4px_20px_rgba(239,68,68,0.12)]',
borderActive: 'border-red-400/40',
valueClass: 'text-red-500',
bar: 'from-rose-400 to-orange-300',
glow: 'shadow-[0_4px_20px_rgba(251,113,133,0.10)]',
borderActive: 'border-rose-400/35',
valueClass: 'text-red-500 dark:text-rose-300',
activateWhen: (v) => v > 0,
},
};