A good year after datly launched, it was time for an honest look in the mirror: the app worked, but it looked like what it was, Bootstrap with default settings. Since this week, datly.eu runs the complete redesign. Internally it is called “Fokus”, and the name is the brief.
An own design system instead of Bootstrap
The biggest decision first: Bootstrap and Font Awesome are gone. In their place sits a small, custom design system in a single CSS file:
- Space Grotesk for text and headings, JetBrains Mono for numbers and statistics, both self-hosted
- A calm palette of navy and a strong blue instead of framework grey
- Lucide icons as inline SVGs instead of an icon font, so only what is on the page gets loaded
The pleasant side effect: datly no longer loads a single external resource. No CDN fonts, no framework CSS, even the chart library in the admin area lives locally. That is good for privacy, good for speed, and it allows a strict Content Security Policy.
The unified results block
Functionally, the biggest piece was the results area of a poll. In the old version, the voting form, the results table and the “common dates” were three separate blocks you had to stitch together in your head. Now everything is one unified block: your own voting row sits directly inside the results table, and the best dates float above it as clickable chips.
On mobile, the old answer was horizontal scrolling through wide tables. The new grid pages column by column instead, with arrows and a page indicator, like a carousel. On a 375-pixel display that is the difference between usable and frustrating.
Under the hood: SEO and security
Two things got done along the way:
- SEO architecture: the language versions (
?lang=de/?lang=en) are now served directly with HTTP 200 instead of a redirect, each language version is self-canonical, and the hreflang links are correct. Before, Google simply did not see the English pages properly. - Security audit: three separate reviews (auth and access control, injection and output, configuration) found no critical issue. Hardening happened anyway: a strict CSP, HSTS, longer vote tokens, path-traversal protection via whitelists and proper cookie flags.
The go-live itself was remarkably unspectacular: the redesign is a pure frontend project, the database schema stayed untouched. All existing polls, participation links and accounts keep working unchanged. Rename the old version away, upload the new one, run the smoke test, done.
What I take away
A framework like Bootstrap is a great start and eventually a brake. Switching to an own system paid off because datly is small enough that one person can hold the entire CSS in their head. That is exactly why I build these side projects: making every decision yourself once, with all consequences included.
If you want to try the new datly: datly.eu, as always free, ad-free and with no forced registration. Feedback is welcome via the contact form.
