Files

Deploy with Docker Compose / deploy (push) Successful in 55s

Details

Fix Slideshow layout shift affecting Chat during image transitions

Use CSS grid stacking instead of absolute positioning so both
entering and leaving images occupy the same grid cell, keeping the
container height stable during crossfade transitions.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

2026-03-25 03:16:28 +00:00

public

Add transcript to site

2026-03-09 11:58:44 +00:00

src

Fix Slideshow layout shift affecting Chat during image transitions

2026-03-25 03:16:28 +00:00

index.html

adding tailwind css

2026-02-04 12:04:08 +00:00

jsconfig.json

changing frameworks

2025-11-25 16:37:04 +00:00

package-lock.json

Update CV

2026-03-04 16:21:30 +00:00

package.json

adding vueuse

2026-02-10 17:00:59 +00:00

README.md

Add CLAUDE.md and update frontend README

2026-03-17 00:37:19 +00:00

vite.config.js

Changes to docker configuration to decrease build time

2026-03-10 12:07:13 +00:00

README.md

My Web - Frontend

Vue 3 SPA for adam-french.co.uk. Built with Vite, Tailwind CSS v4, Pinia, and Vue Router.

Setup

npm install

Development

npm run dev

The Vite dev server proxies API requests:

/api -> http://localhost:8080 (Go backend)
/gitea -> http://localhost:3000 (Gitea)
/radio -> http://localhost:8000 (Icecast2)

Production Build

npm run build

In production, the built dist/ is served by Nginx inside a Docker container (see ../Dockerfile).

Recommended IDE Setup

VS Code + Vue (Official) (and disable Vetur).

Recommended Browser Setup

Chromium-based browsers (Chrome, Edge, Brave, etc.):
- Vue.js devtools
- Turn on Custom Object Formatter in Chrome DevTools
Firefox:
- Vue.js devtools
- Turn on Custom Object Formatter in Firefox DevTools