| Commit message (Collapse) | Author | Age |
|---|
| |
|
|
|
|
|
|
|
|
| |
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.
|
