Files
felhom.eu/REPORT-site-tweaks-2026-10-12.md
T
admin 25ab47eeaa
gates / gates (push) Failing after 6m59s
website: the two-tone headings are back, and the home page's sections are ruled apart
Two notes from the operator, 2026-10-12: the white/blue heading split was lost
in the M3 switch and should return everywhere, the apps page categories
included; and the home page's sections ran into one another.

- 41 headings get their <span> back (home 5+5, apps 6+6, FAQ 6+7, services 3+3).
  The style never went away - site.css has styled `h2 span` blue all along; the
  M3 rewrite dropped the markup. No text changed: the span wraps words that were
  already there. The three home headings that predate M3 are split where they
  were split then.
- Apps and FAQ categories are new to the treatment: a name with an & splits
  there, a phrase on its last words. Five one-word headings stay plain.
- The home page's sections get a 1px --line rule with 2.75rem of air on each
  side, so it sits centred in the gap; the first also parts the hero from the
  page. Home page only.
- Blue on the page background measures 7.9:1 - AA at any size.
- site.css ?v=28.
2026-10-12 13:18:59 +02:00

9.6 KiB
Raw Blame History

REPORT — the operator's seven notes (2026-10-12)

REPORT-<topic>.md, not REPORT.md: that file belongs to another session.

In plain words

Seven things you listed after looking at the live site. All seven are done. Five of them were defects, and one of those — the app category links — had been broken on every page since the switch.

Your list, item by item

# what you said what it was, and what changed
1 too much air round the sidebar logo, text too small The wordmark was 0.67× the mark's width; in your own logo.png it is 1.28× — so it had shipped at less than half size. Mark 112px, wordmark 25px tall, 28px less padding.
2 the scrollbar is the default/ugly Thin, in the palette, both the page's and the sidebar's. The first attempt missed the big one: the viewport scrollbar is painted from <html>, not from anything inside <body>.
3 the headline should look like on the webpage It had been moved into the inner pages' heading style, so it shrank from 3.5rem to 2.1rem and the badge ended up beside it. It is back in the hero column, two lines, second line blue.
4 the box preview is not good, try a laptop Image 3 (the straight-on one) — and its screen is replaced by the real dashboard-start-hu/en.webp. See below.
5 „Szolgáltatások" should be its own page /szolgaltatasok + /en/services. The ten items moved verbatim; the home keeps the promise, the three group names and a button, and is 345 words shorter.
6 the text above the boxes looks wrong .page-lede had no CSS at all on 16 pages. Now it shares the box's 760px measure, centred over it, with air beneath.
7 the app category anchors are not working 100 dead links. The sidebar pointed at #fajlkezeles-irodai; the section is #fajlkezeles. Fixed, and now gated.

About the laptop

I used image 3 — the straight-on one. The other two have a Hungarian misspelling on the screen („Alkalmaaások"), and image 2's blue glow fights the page.

But the screen in image 3 is also AI-drawn, and it misspells „Paperlerss-ngx". So I kept only the frame and composited the real Launcher screenshot into it — the same picture the site already ships lower down the page. What a visitor sees is now a real box's screen in a designed frame: no invented app names, no misspellings, and it stays true when the dashboard changes, because it is made from the screenshot the gate already watches. 57 KB.

If you would rather use image 3 exactly as generated, say so and it is a one-line change.

Found while working, not on your list

  • The home page's four hero tiles pointed at /alkalmazasok#immich and friends. Those ids had never existed. Every app card now carries its slug as an id, so all 59 deep links work.
  • The FAQ's „Kapcsolatfelvétel" button pointed at a home-page section that had moved out.
  • The font arrives after first paint (font-display: swap), which reflowed the page by up to 1339px. The two Latin subsets are now preloaded.

What now holds each one

Gate 23 resolves every in-site #fragment against the page it names — 360 today, all live. Its decoy puts the operator's own bug back (#media-szorakozas) and the gate convicts. Gate 19 holds the new laptop picture to its page's language, because it is named dashboard-laptop-<lang>.webp.

Checked at 390px and 1440px on all 21 pages: no sideways scrolling, footer inside the content column everywhere, drawer opens with all 13 items.

One honest correction

I first reported the anchors as landing 1339px short even after the ids were fixed, and built a script to re-land them. That reading was my own measuring error: a background Chrome tab freezes scroll-behavior: smooth, so the scroll never finished while I measured it. With smooth disabled for the measurement the browser lands exactly on the target. The script is gone; the font preload stayed, because that one is a real improvement either way.


Second round, same day — four more notes

# what you said what it was
1 third person about myself sounds wrong The home line said „Ha írsz, ő válaszol" while the page it links to says „Ha írsz, én válaszolok". Both home pages are first person now, and the link reads „Rólam bővebben →" instead of repeating the question the sentence just answered. The legal pages keep the formal name.
2 too much space round the globe, especially below 36px below it, and most of it was a leak. The old chrome's bare nav { padding: 20px 0; position: fixed; backdrop-filter: blur(12px); z-index: 200 } matched <nav class="sidebar"> as well — .sidebar declares none of those four, so all four were live on the sidebar. Scoped, and the footer row trimmed. 8px now.
3 the two tables under „Miért a sajátod?" are touching .vs ends on a border and .band opens with a blue rule, so they read as one block. 2rem between them.
4 „Minden alkalmazás" makes no sense It is „Az alkalmazásokról" / „About the apps" now — that item is the top of the page, where the intro and the „Fontos tudnivalók" box are, not a filter.

The one that matters beyond its own fix

Item 2 was a leak gate 22 was built to catch and could not see. That gate compares the two stylesheets' shared selectors; nav is not a selector shell.css ever writes, so a bare element rule was outside its field of view entirely. The gate now has a second half: an unscoped nav, header, main or aside rule in site.css is a failure, because those elements are the shell. It convicted a second live one immediately — R-903's no-JavaScript fallback had been overriding the sidebar's position: fixed on a phone with scripting off.

footer is deliberately not on that list, with the reason written beside it: the shell carries the website's own footer, so those rules are meant to apply.

Both halves have decoys that have been seen to fail.


Third round, same day — the laptop screen moves

You recorded six scenes and said to use them whole: „use the full length for all of them, they had been cut as I liked them”. That is what shipped — Jellyfin, Tandoor, OnlyOffice, Immich, RomM, Paperless, in file order, 0.6 s crossfades between them, 36.6 seconds in all, looping.

What a visitor pays for it. The page draws immediately: the laptop frame (59 KB) and the first frame of the clip as a still (53 KB) are all the hero needs to look finished. The clip itself (1.1 MB as mp4, 1.3 MB as webm — a browser takes one, not both) is fetched only when the hero is actually on screen, and it is dropped entirely for a visitor whose system asks for reduced motion, or whose JavaScript is off. No „loading” graphic was needed: the still is the loading state, and it is a real frame of the thing that is about to move.

Why it is honest. Jellyfin, Paperless and RomM were filmed on those projects' own public demo sites, so nothing in the clip is anybody's private library, and the films in the Jellyfin scene are public-domain prints. The caption under the laptop names the six apps and claims nothing about whose box they ran on.

One thing I could not check, and will not pretend I did. This workstation's Chrome will not play any media right now — not the clip, not a 1 KB silent sound file generated in the page itself, which stalls the same way with no error. That rules the clip out as the cause: the browser's media engine is down, not the file. What I did verify in the browser: the clip sits exactly in the cut-out screen with the bezel, the glare and the keyboard in front of it, at desktop size, and the first frame is what you see there. Restart Chrome and the moving picture is the one thing left to look at — on https://felhom.eu itself once this is pushed.

The builder changed with it: scripts/make_hero_clip.py reads each scene's length instead of cutting every one to the same window, and the crossfade offsets now count from the running total minus one fade per transition already made — with equal scenes the old arithmetic happened to give the same answer, with your unequal ones it would not have.


Fourth round — the two-tone headings, and air with a line in it

The white/blue split was never styled away; the markup went. site.css still says h1 span, h2 span, h3 span, h4 span { color: var(--blue-bright) } and always did — what the M3 rewrite dropped was the <span> inside the headings it rewrote. Four pages that M3 left alone (technology, testing, backups, contact) still had theirs, which is why the site looked inconsistent rather than uniformly flat. 41 headings have it back, and no word of text changed: the span is wrapped around words that were already there.

The apps and FAQ categories are new — they never had the split. A name with an & in it splits there (Fájlkezelés & | Irodai), a phrase on its last words. Five one-word headings are left plain, because an all-blue heading reads as a different element rather than the same one emphasised: Alapkérdések, Költségek, Costs, Letöltés, Download. Say the word and they go blue whole.

The separators are a hairline, not a band. --line — the same colour every card border on the site uses — with 2.75rem of air on each side of it, so the rule sits centred in the gap instead of appearing to belong to the heading beneath it. The first line also parts the hero from the page. Only the home page has them: every other page is one run of one kind of thing, where a rule between items would be noise. If you want them on the services or technology page too, it is one more line of CSS.