Repository navigation
motion: four durations and one easing, each movement once - #9
Merged
Merged
Conversation
The site's landing animates now, and each part picked its own timing: 22 ms a character, 650 ms a layer, 700 ms a stroke, three easings. The palette gives them one set, beside the radii and the targets - fast for a hover or a press, base for a card or a menu, slow for a section coming into view, draw for a line of a drawing - and the rule that goes with them: a movement says what something does, runs once, and is its end state under reduced motion. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…theme The landing's terminal and its last section are the navy in both themes, and wrote the dark values out by hand - some of them, and four that are no role at all. A .spin-dark part now takes the dark roles from tokens.css. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
aledbf
added a commit
to spin-stack/website
that referenced
this pull request
Oct 22, 2026
…oving under the reader Measured on the built site (Playwright, Lighthouse 12.8, axe 4.14): - The page moved under a phone reader: CLS 0.32. Plex was found late, through the stylesheet, and swapped in after the first paint (0.23); the terminal grew as it typed and the steps' list changed height as each claim showed (0.09). The faces the first screen sets are preloaded, the terminal has a fixed height, and every claim is always shown. CLS is 0.03 on a phone and 0 by Lighthouse. - The terminal looped forever with no way to stop it (WCAG 2.2.2). It plays once from the step picked and stops on the whole session; Skip ends it, Replay starts it again, focus moves between them. A screen reader reads the whole session from an sr-only copy rather than a half typed one. Reduced motion and no scripts show the session whole. - Every loop now runs once or a few times: the title's light, the dot, the running layer's dashes and glow, the card's ring. The hero's drift and the last section's turning mesh are gone: they only decorated. - Colours and corners are the brand's: the terminal and the last section are .spin-dark (spin-stack/brand#9) instead of eleven hex values, one a violet the palette does not have; radii are the palette's 4/8/12, not 6/14/16/18/24; durations and easing are --spin-duration-*/--spin-ease. The title's gradient on the navy is cyan and mint, not the blue the brand keeps off text there; the numbers on white are the accent and the deep blue (the cyan was 2:1). - Install on AWS is the primary action, in the hero and at the end. - The straight answers are cards with an icon each (Answers.astro); the list is still the page's Markdown and its twin is unchanged. - The glass header was never glass in Chrome: the minifier kept only -webkit-backdrop-filter. It is unprefixed now. - axe found the proof links under 24 px and the release and commit under AA in dark; Lighthouse found the logo's alt repeating the name beside it. All fixed: axe clean at WCAG 2.2 AA in both themes at 1440 and 390 px, Lighthouse mobile 99/100/100/100, desktop 100. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
palette.toml gets a [motion] section; tokens.css carries
--spin-duration-fast|-|slow|drawand--spin-ease, tokens.json the same. The website's landing (spin-stack/website) is the first to use them.🤖 Generated with Claude Code
Need help on this PR? Tag
@codesmith-botwith what you need.