feat: Header logo, gold-to-rusty-red title gradient, and /static asset folder #17

jason · 2026-03-09T18:50:40-05:00

jason commented

2026-03-09 18:50:40 -05:00

Summary

Replaces the generic <Dog> Lucide icon in the navbar with a custom br-logo.png image, applies a medium-dark gold → rusty dark red-gold gradient to the BREEDR title, and wires up a /static/ directory served by Express.

Changes

`client/src/App.jsx`

Removed Dog import from lucide-react
Replaced <Dog size={32} /> with <img src="/static/br-logo.png" alt="BREEDR Logo" className="brand-logo" />

`client/src/App.css`

Added .brand-logo class: height: 2.5rem, width: auto, object-fit: contain (scales to 2rem on mobile)
Updated .brand-text gradient: #c9940a (med-dark gold) → #b5620a (burnt gold) → #8b2500 (rusty dark red)

`server/index.js`

Added STATIC_PATH constant (default: ../static, overridable via STATIC_PATH env var)
Auto-creates the static/ directory on startup if missing
Registers app.use('/static', express.static(STATIC_PATH)) middleware
Added Static: ${STATIC_PATH} to startup log

`client/vite.config.js`

Added /static proxy entry → http://localhost:3000 so the logo loads correctly in dev mode (Vite on :5173)

`static/.gitkeep`

Tracks the static/ directory in git
Drop br-logo.png here — it will be served at /static/br-logo.png

Deployment note

Copy br-logo.png into the static/ directory on the server. The Express middleware auto-creates the folder, but the file itself is not committed (add to .gitignore if desired to keep binary assets out of git).

## Summary Replaces the generic `<Dog>` Lucide icon in the navbar with a custom `br-logo.png` image, applies a medium-dark gold → rusty dark red-gold gradient to the `BREEDR` title, and wires up a `/static/` directory served by Express. ## Changes ### `client/src/App.jsx` - Removed `Dog` import from `lucide-react` - Replaced `<Dog size={32} />` with `<img src="/static/br-logo.png" alt="BREEDR Logo" className="brand-logo" />` ### `client/src/App.css` - Added `.brand-logo` class: `height: 2.5rem`, `width: auto`, `object-fit: contain` (scales to `2rem` on mobile) - Updated `.brand-text` gradient: `#c9940a` (med-dark gold) → `#b5620a` (burnt gold) → `#8b2500` (rusty dark red) ### `server/index.js` - Added `STATIC_PATH` constant (default: `../static`, overridable via `STATIC_PATH` env var) - Auto-creates the `static/` directory on startup if missing - Registers `app.use('/static', express.static(STATIC_PATH))` middleware - Added `Static: ${STATIC_PATH}` to startup log ### `client/vite.config.js` - Added `/static` proxy entry → `http://localhost:3000` so the logo loads correctly in **dev mode** (Vite on :5173) ### `static/.gitkeep` - Tracks the `static/` directory in git - Drop `br-logo.png` here — it will be served at `/static/br-logo.png` ## Deployment note Copy `br-logo.png` into the `static/` directory on the server. The Express middleware auto-creates the folder, but the file itself is not committed (add to `.gitignore` if desired to keep binary assets out of git).

jason added 5 commits 2026-03-09 18:50:40 -05:00

feat: Replace generic icon with br-logo.png in navbar brand bc6cf83f72

feat: Add brand-logo sizing and gold-to-rusty-red gradient on brand-text eb661782fe

feat: Serve /static directory for logo and branding assets 422ea5cf7f

feat: Proxy /static to Express server in Vite dev mode 24d96ca08a

feat: Add static/ directory for branding assets (drop br-logo.png here) 1d4534374b

jason merged commit 358f80c668 into master

2026-03-09 18:52:01 -05:00

jason referenced this issue from a commit

2026-03-09 18:52:01 -05:00

Merge pull request 'feat: Header logo, gold-to-rusty-red title gradient, and /static asset folder' (#17) from feat/header-logo-and-title-gradient into master

Sign in to join this conversation.