Add new styles for home and landing pages

- Created home.css with comprehensive styles for the home page layout, including typography, buttons, and responsive design adjustments.
- Created landing.css to style the landing page, focusing on typography, layout, and responsive behavior for various screen sizes.
This commit is contained in:
syntaxbullet
2026-09-04 11:50:24 +02:00
parent 1acf016169
commit 084603bb6e
43 changed files with 7191 additions and 65 deletions

View File

@@ -1,7 +1,7 @@
# Minabot
Bun + Hono habit-tracking REST API with Drizzle ORM and local SQLite. The existing
React Router client remains a minimal authentication shell; habit frontend UI is deferred.
React Router client has a public landing page and a connected signed-in habit dashboard.
See [the REST API reference](docs/API.md) for habits, task recurrence, dated progress,
combined calendars, historical corrections, daily resets, and optional count carryover.
@@ -17,7 +17,50 @@ Open http://127.0.0.1:3000. Set `PORT` to use a different port.
- Hono endpoint: `GET /api/health`.
- Unknown API routes return JSON with a 404 status.
Pages contain a heading, native navigation buttons, and account controls. Tailwind utilities
### Design system preview
Open `/design-system#editing` for interactive habit settings, task recurrence,
and dated progress corrections. Habit colors include Earth, Coast, Dusk, Forest,
Citrus, Blossom, Jewel, and Slate palettes plus a native picker and hex input. Editors support save/cancel,
archive/restore, and an in-session correction history. The backfill calendar
uses frozen historical requirements, independent of edits to today's settings.
These are unsaved, local UI examples with a fixed September 4, 2026 demo clock;
they do not call the habit API or change account data. Reload or Reset editor
clears the preview. Habit colors preview immediately across the editor and the
daily/detail charts; Save keeps the color in the demo and Cancel restores it.
Other settings and progress remain independent of the daily tracking playground.
Signed-out visitors at `/` see the landing page, with interactive habit calendars
reused from the design system, a how-it-works introduction, and Discord sign-in.
The demo is local, unsaved state and never writes to the habit API. Account loading
and retryable errors are resolved before choosing the public or signed-in home.
Signing out updates the shared account state and reveals the landing page immediately.
Discord integration currently covers identity only, not bot commands or reminders.
Signed-in users at `/` get a personalized home with their Discord avatar, tracking
date/timezone, daily completion summary, manual/count/task check-ins, a remaining
filter, and per-habit calendar history in the design system's two-column chart grid.
Each habit has its own heading, schedule, color key, and compact calendar. Daily
check-ins use compact rows with expandable tasks. New accounts get editable starter ideas and
a create-habit dialog supporting all three methods, all schedule types, and the shared
palette/custom color picker. The habit and its color are saved atomically. Progress
is saved through the habit API; history uses server-provided progress colors and dated units,
never the landing page's demo data. Visible dashboards refresh every minute and on
returning to the tab. Loading, retry, expired-session, no-schedule, and all-complete
states are handled separately. Each habit has Edit and Delete controls: edit its name,
count target/unit, schedule, and color, or confirm removal from the dashboard using
the existing archive API, which retains recorded history. Editing keeps the tracking
method and existing tasks intact. Unscheduled dates use neutral dots; upcoming dates
share the zero-progress fill while retaining their distinct inspection labels.
Archive management, task-definition editing, historical corrections, and saved
combined-chart management remain outside this home view.
For isolated browser QA, run `bun scripts/dashboard-preview.ts` and open the printed
preview login URL. It serves the real UI and API against an in-memory test database,
uses a separate test cookie, and discards its data on exit.
It is a local test harness, not a production sign-in flow.
Secondary pages retain a heading, native navigation buttons, and account controls. Tailwind utilities
and shadcn configuration are available; Tailwind Preflight is omitted to preserve
native browser styling.