Imouto

Caddy Routing Fix and Design System Preparation

Wired imouto into the Motivka Caddy reverse proxy so https://localhost/imouto resolves correctly, and prepared placeholder layout hooks for the upcoming Alfons design system integration.

2 Phases
2 Tasks
1 Days

The Problem

The imouto container was running and healthy, but https://localhost/imouto returned nothing. The Motivka Caddy instance handles all HTTPS traffic for localhost, but it had no routing block for /imouto/*. The two services live on separate Docker networks -- imouto on imouto_default and Motivka Caddy on motivka_motivka -- so they cannot reach each other by service name.

Beyond routing, imouto also had its own bespoke design tokens with no connection to the broader design language used across the local admin suite. I needed to prepare integration points for the Alfons design system, even though Alfons did not exist yet.

What I Built

Caddy Routing

The fix was adding a handle /imouto/* block to Motivka's Caddyfile.dev, pointing to host.docker.internal:8080. This sidesteps the Docker network isolation problem entirely -- host.docker.internal resolves to the host machine on macOS with Colima, so Motivka's Caddy can reach imouto's port without the two containers sharing a network.

I verified all sub-routes work under the /imouto base path: the explorer home, occupation detail pages, and comparison pages all load correctly through the shared HTTPS endpoint.

Design System Preparation

With Alfons not yet built, the design system work was limited to documentation and placeholder hooks. I added a named slot structure to +layout.svelte that is ready to accept an Alfons nav shell and footer once the design system ships. The current bespoke tokens remain in place -- they will be replaced wholesale in a subsequent phase.

This was a deliberate choice: I did not want to half-migrate to a design system that does not exist yet. Better to document the integration points clearly and do the migration in one pass when the tokens are final.

What is Next

The routing is solved and the layout is ready. The next step is the solarpunk glassmorphic redesign -- adopting the Alfons/motivka token system with glass-panel treatments, a persistent nav bar, and a cohesive visual language across all three views.

Features Delivered

Caddy Routing Fix

  • Added /imouto/* routing block to Motivka Caddyfile.dev
  • Used host.docker.internal to bridge separate Docker networks
  • Verified all sub-routes work under /imouto base path

Design System Preparation

  • Documented Alfons integration points in CSS and layout
  • Created placeholder layout structure ready for Alfons nav shell

Bugs Fixed

  • https://localhost/imouto returned blank page due to missing Caddy routing block

Key Decisions

  • Used host.docker.internal instead of coupling Docker networks -- avoids tight coupling between imouto and motivka containers
  • Deferred actual token migration until Alfons design system exists -- placeholder hooks only