| Commit message (Collapse) | Author | Age |
|---|
| |
|
|
|
|
|
|
|
|
|
| |
The stage-resident logo copy goes: instead the top section itself --
logo and buttons -- is position: sticky below 54rem, full-bleed, with
the tour's stage tucked under it at --hero-h, which the page script
measures (wrapping buttons make it no fixed number; a ResizeObserver
keeps it honest). The tagline yields the room: with the header on
screen at all times, every line it keeps is a line the tour loses.
Desktop is exactly as before -- the floating logo, its observers and
its collision test untouched.
|
| |
|
|
|
|
|
|
|
| |
Below 54rem the fixed corner the float centres itself in is content, not
air, so the float stays hidden there -- but the logo can ride where the
terminal does: a small copy inside the sticky stage, above the player, on
screen at all times. No observer, no collision test; it sticks with the
stage. Same link back to the top, same wash and shine (the shared rules
now name both), same reduced-motion fallback.
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
Android reports arrived of the logo rendering shattered, and the cause
is the ascii itself: the default monospace there has no block glyphs,
so every ▀▄█ falls back to whatever font volunteers, each with its own
metrics, and the grid comes apart. No font stack fixes a missing
glyph, and shipping a font is against the house rules.
So the logo stops being text: web/gen-logo-mask turns logo.txt into an
SVG of merged rects, inlined into site.css as a data URI and used as a
CSS mask on an empty element. The animated background layers show
through the mask exactly as they showed through background-clip: text,
so every effect survives -- gradient slide, shine, hue, glow -- and
two old hacks retire with the fonts: the letter-spacing pinstripe fix,
and (after one round of seams at fractional mask scales) a vertical
overlap baked into the rects. Same 318x84 box, same placement math,
and a hero that reads as role=img with a label instead of seven rows
of block glyphs.
|
| |
|
|
|
|
|
|
| |
Proximity snapping, even with the doorway steps freed, still catches
some people's scrolling in ways worth no tour polish -- input devices
and browsers disagree too much about what proximity means. The
clickable steps and the smooth scrolling stay; a reader's wheel is
theirs again, everywhere.
|
| |
|
|
|
|
| |
The page gets its colophon back, at a fraction of the old footer's
size: one centred mono line in the floor's own greys, the link a shade
brighter and pink under the pointer.
|
| |
|
|
|
|
|
|
|
| |
The floating logo's dress on the big one, cut to the brand: no hue
rotation -- that is what walks the little one off into blues -- just a
4s slide through the palette's own pinks and orchid and --dead's
sunset orange, the most retrowave colour the theme already owns, with
the shine crossing once a loop and a soft pink glow underneath.
Reduced motion gets the gradient standing still.
|
| |
|
|
|
|
|
| |
The body gradient's ground passes --panel by, and a box darker than
its floor reads as a hole. The poster steps up to --code-bg -- the
same raised step the install boxes beside it use -- and its border
moves to --faint, since the old border colour is now the fill.
|
| |
|
|
|
|
|
|
| |
A gradient on the body, whose box is the whole document, so the fade
maps to scroll distance: near-black held through the hero and the tour,
then a slow climb to a grey that stops shy of the panels' own colour --
the floor lightens, the boxes on it stay boxes. html keeps the solid
top colour, so over-scroll rubber-banding stays dark.
|
| |
|
|
|
|
|
|
|
|
| |
A band of light sweeping the glyphs once a loop -- the logo running
slosh's own shine preset, which is a better advertisement than a
signal fault. The band is a second background layer on the same
text clip, parked off the ink for 86% of the loop and crossing in the
closing 0.7s; one set of keyframes drives both layers, the colour
slide holding its linear pace through every stop. The glitch keyframes
go, and reduced motion still keeps only the hue.
|
| |
|
|
|
|
|
|
|
|
|
| |
A signal that is fine, fine, fine, and then for a third of a second is
not: torn into bands by clip-path, shoved and sheared by transform --
the two properties the other animations left free, filter being the
hue's and background the slide's. Doubled keyframe percentages make
the cuts hard instead of smeared, and 7s against the 5s slide and 4s
hue lands the burst somewhere new in the colour every time. Reduced
motion never sees it: the glitch is nothing but motion, and the
reduced lane already keeps only the hue.
|
| |
|
|
|
|
|
|
|
|
| |
Clicking anywhere in a dimmed article glides it to the centre and so,
through the observer, switches the recording. Three guards keep the
click meaning navigation: the active step does not react (clicks there
are for reading and selecting, not going where you already are), a
selection is not a click, and a link is a link. The pointer cursor and
the title's breath of pink now belong to dimmed steps only -- the
active one is just prose.
|
| |
|
|
|
|
|
|
|
| |
Proximity snapping traps at the edges: between steps, adjacent fields
hand you from magnet to magnet, but at the first and last there is no
next field -- a wheel tick toward the hero or past the final demo ends
inside the boundary step's radius and is pulled straight back, forever.
The interior steps keep their snap-align; the doorways go without,
because a doorway that grabs is worse than a step that does not snap.
|
| |
|
|
|
|
|
|
|
|
|
|
| |
scroll-snap-type: y proximity on the root, snap-align: center on the
steps and nothing else: a scroll that ends near a step is settled onto
its centre -- the exact spot the tour activates it, so the rest
position and the lit step agree -- and momentum, half-reads and every
snapless section are left alone, by spec. Proximity, never mandatory:
the mandatory kind on a page that also has prose is a trap, and the
JS kind is worse. Off in the one-column layout, where the sticky
stage covers the upper viewport and a centred step would sit half
beneath it.
|
| |
|
|
|
|
|
|
| |
Clicking an article's h3 glides it to the middle of the viewport --
the exact spot where the tour's observer activates it, so the click
also switches the recording, through the same door scrolling uses
rather than a second mechanism. The pointer cursor and a breath of
pink on hover say clickable.
|
| |
|
|
|
|
| |
The tour-width breakout belongs to the machine, not to the offer of
one: unbooted, the panel now sits flush with the prose and the install
box; booted, it still takes the tour's width and most of a viewport.
|
| |
|
|
|
|
| |
A real ghost button centred under the running machine, in the hero
buttons' own dress -- ghost on purpose: booting stays the loud verb,
stopping the quiet one. The caption drops to a side note beside it.
|
| |
|
|
|
|
|
|
|
|
|
|
| |
A caption under the running machine offers the off switch, dressed as
a link inside a sentence. Dropping the iframe out of the DOM tears the
whole VM down -- emulator, kernel, disk cache, the lot -- the stage
shrinks back into the poster (the original nodes come back from a
stash, listeners and all, so the boot button is immediately live
again), and the scroll follows both ways.
Reload always did this; the button does it without taking the rest of
the page with it.
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| |
A try section between the tour and the install box: a modest poster
with one button, and the machine only when the button is pushed -- the
front page keeps costing two files, which is the decision the README
recorded when the demo got its own page, still being honoured.
The click grows the stage to most of a viewport *before* the iframe
goes in (the guest reads its geometry from the room exactly once, at
boot), then glides the scroll to land the machine centred. An iframe,
not the demo's scripts inlined: the emulator's emscripten glue owns
its globals by name, and isolation is what keeps this page and that
blob out of each other's namespaces. ?embed=1 makes the demo page
drop its own header and footer inside the frame; standalone it is
unchanged, and phones navigate to it rather than embedding -- wasm
under a soft keyboard in an iframe helps nobody.
The floating logo learns the tour's edges properly while at it: the
try section arriving closes the show (measured with a -45% rootMargin,
because the tour's exit margin lets the section ride high while the
last step is still centred), and a section scrolled past counts as
arrived, not gone.
|
| |
|
|
|
|
|
|
|
|
|
|
|
| |
Fewer colours at once, more per second: the gradient slims to three
stops -- pink, orchid, blue -- and the hue rotation takes over the
variety, a full wheel in 4s (5s in the reduced-motion lane, colour in
place, still nothing travelling). The slide drops to 5s with it.
And a drop shadow, inside the hue keyframes because the filter
property is the animation's to own -- a static filter would lose to
it -- and listed before the hue-rotate so the glow is rotated with
the letters and always matches their current colour. Soft and low:
on a near-black page a shadow can only read as a faint underglow.
|
| |
|
|
|
|
|
|
|
|
|
| |
Both of the owner's browsers showed the cycle frozen, and the culprit
was neither of the browsers: the OS asks for reduced motion, both pass
it on, and the media rule here answered by killing every animation.
The preference is about motion -- patterns that travel, the vestibular
kind -- not about colour, so the position slide goes and the in-place
hue rotation stays, at half speed. Nothing moves, everything still
breathes, and a visitor who asked the OS for stillness gets exactly
the stillness they asked for.
|
| |
|
|
|
|
|
|
|
|
|
|
|
|
| |
More of the wheel -- the gradient now walks pink, orchid, blue, cyan,
mint and back, all colours the demo's own terminal palette already
speaks -- and a faster walk, 8s to the position slide's loop.
And a second motion: WebKit caches a text-clipped paint and never
repaints it for a background-position animation, so on Safari the wash
sat frozen, pink on the left, cyan on the right, which rather defeats
a colour cycle. A hue rotation runs alongside (12s to the full wheel):
filters apply post-paint on the compositor, so every engine animates
it over the cached clip. Chrome and Firefox get both motions, WebKit
gets the rotation alone -- either way, nothing stays pink.
|
| |
|
|
|
|
|
|
|
| |
A gradient of the pink's neighbours -- orchid one side, a lighter pink
the other -- clipped to the ink and slid along it, one tile every
fourteen seconds: the logo's own little colour pass, in the spirit of
the shaders it advertises. Horizontal on purpose, because only a 90deg
gradient meets its own edge seamlessly when the loop wraps; animated
only while shown, and not at all under prefers-reduced-motion.
|
| |
|
|
|
|
|
|
|
|
|
|
|
| |
A fixed top worked at one viewport height and overlapped the pinned
terminal at others: the terminal's top edge is (viewport - the stage's
lift padding) / 2 - half the player, which no constant tracks. Measure
it instead, centre the logo in what remains, and hide it outright when
a short viewport leaves no air -- hiding beats overlapping.
Re-placed on resize and by a ResizeObserver on the player mounts, not
on the pin: the players are zero-height until their casts arrive, and
the pin is a 100vh box that never resizes, so watching it would freeze
the placement at the pre-load height.
|
| |
|
|
|
|
|
|
|
|
|
| |
Block glyphs' ink can round a hair narrower than the monospace advance,
so the ascii logos showed hairline gaps between characters that should
read as solid ink; -0.05em of letter-spacing tucks each glyph into the
last, on the floating logo and the hero's alike.
The floating logo also stops dressing as a link on hover: the global
a:hover underline through seven rows of block glyphs was a mess, and
the colour flash no better. It still is one -- the pointer says so.
|
| | |
|
| | |
|
|
|
Consolidate everything the website is made of:
- web_new/ -> web/: the front page, install.sh, and build-site
- contrib/webdemo/ -> web/demo/: the in-browser machine, committed for
the first time (it had never been checked in)
- make www at the top level assembles the whole site into build/www
(NO_DEMO=1 skips the guest cross-compile)
- web_plan.md deleted: the plan is fulfilled and web/README.md is now
the record
Path fallout: the overlay theme symlink gains one ../ (web/demo is a
level shallower relative to contrib/themes), PYSRC in the Makefile
follows the demo scripts, contrib/README.md drops its webdemo section.
ROOT := ../.. in the demo Makefile survives unchanged -- web/demo sits
at the same depth contrib/webdemo did.
Verified: make www builds front page + docs + demo end to end,
web/demo make check boots the image to slosh, tests/test_docs.py and
make fmt-check green.
|
