Site Log: theme, home page & database work

A written record of how I rebuilt the look and main tools of LAFFI over two long days. I keep this so I remember what I tried, what I kept and what got thrown out, plus what is still broken.

8 Sep 2026 — the theme back-and-forth

I started from the older dark look the site already had. That one was close to Discord's design: dark charcoal panels, a flat feel, and a small set of accent colours. It worked, but I wanted something that felt more finished and less like a fan wiki.

First pass: a "premium" glow

My first idea was a high-end, glossy look with gradients and glass. I wanted the cards to feel layered and light, and I grabbed reference sites for the mood instead of coding blind:

• a big 3D/particle homepage that scrolls and moves a lot (the kind of site that feels like a tech demo),
• a clean product/log look with a tight timeline and changelog feel for the blog and dev-log parts.

So I built a set of gradient tokens, glassy buttons and a slowly-animating sheen over the whole page. It looked more "expensive" but it also fought against the dark wiki layout, and honestly I did not like using it day to day.

I dropped that version almost entirely.

Rollback, then Discord again

I moved back to the flat Discord-style look and kept the nice micro-interactions (hover lifts, smooth transitions, the fixed top bar, the slide-in mobile menu) even though the fancy background was gone. That felt closer to right, but I still was not settled on the colours.

Final move: GitHub dark

Then I committed to the biggest theme change of the day and rebuilt everything on a GitHub dark reference. I lifted the exact palette from GitHub's dark UI: blacks and greys for the surfaces, no decorative blue, white text and dividers. Action buttons became GitHub green. The LAFFI mark and the hairline separators under the top bar and above the footer go white. I also swapped every leftover blue accent used as chrome so nothing shouts blue unless it is an actual link.

Home page experiment

With the base theme right, I took another shot at the homepage. Since I keep liking that moving 3D/particle reference, I built a dynamic hero for the landing page: an interactive canvas that draws a drifting particle/cursor field across the top of the page, with bits of copy revealing as you scroll. It was flashy and technically it worked, but over a whole session it honestly felt like too much for a site about me. The floating particles did not sit well next to a reading blog. I removed the moving hero entirely and went the other way: a calm, clean "Welcome to LAFFI" band with nothing moving.

Then I softened it further by putting a photo as the home background instead of a plain surface. A wide frame image now sits behind the welcome area with a dark tint on top so the white title stays readable. That is what the homepage looks like now.

Rest of the day

• Reworded the site so it reads like a general dev + game personal blog, not "YAKO and WOWSB only". Those are now just the two current categories.
• Put my YouTube panel and then my real links (email, YouTube, GitHub, Discord) on the homepage and About page. Discord has no add-link, so its footer icon is now a copy button that tells you to paste the handle on Discord.

9 Sep 2026 — tools and fixes

• Cleaned up the Tier 10 ship compare and the single-ship stat order (maneuver, survivability, guns, torpedo, AA, concealment).
• Added an AA calculator first, then rebuilt it into a full 6-slot equipment system. Each slot opens its own dropdown, and choosing gear updates the stat live on the sheet.
• Equipment is class-aware. Destroyer-only gear only appears on destroyers; in a compare the destroyer and the cruiser each see their own lists and update their own numbers.
• Rule added: one equipment family per ship per loadout, so you can't slot a module and its "+" version together.
• Stats with no number in my data now read "not available" instead of a guessed value.
• Green hover edges -> boxes/cards now hover to a soft white edge, and buttons that only outlined in green now fill green on hover.

Bugs fixed

• Equipment boxes sometimes missing when a ship opened: I moved the paint call in so it always runs on open.
• Stats were colouring as "changed" with nothing equipped because of decimal rounding. A stat is only counted as changed when an upgrade really touches it.
• Old files stuck in the browser cache made it look like nothing saved. I added version tags so a fresh load always pulls the newest scripts.

Still open

• No real equipment icons yet - every slot and dropdown shows a "/" placeholder for a 1:1 image later.
• Slot 1 is reserved but empty for future gear.
• Some stats the game data does not export (deceleration, turning speed, survivability, some traverse speeds) read "not available".
• A few panels need a last polish pass once I see them on my own screen.

I'll edit this post as I close these off.