Make the mission page readable - #278
Merged
Merged
Conversation
The page was one column of prose at about 120 characters a line, with two
links in the whole document and no way to navigate its four sections.
The five goals move into front matter and render as cards: they are the
most quotable thing on the page and were a plain bullet list. /about now
uses the table of contents sidebar the packages page already has, which
helps the governance page too, and prose gets a 46rem measure.
Fix the copy while here:
- the channel list named Discourse, Zulip and Twitter, none of them
linked. It points at /join instead, which already lists every channel
with a link, so a social account only ever changes in one place
- "provide users to cutting-edge and varied selection" was missing a
word; "silo'd" was not a word
- the brand is lowercase everywhere else on the site, but four
sentences here opened with "Scverse"
- link core tools, shared maintenance and ecosystem packages to the
pages that describe them, rather than leaving the page a dead end
✅ Deploy Preview for jade-cajeta-1bcca0 ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
The goal cards were a grid, which with five items and uneven text left an orphan on the second row and half-empty boxes on the first. They are rows now: an icon in a tinted circle, then the name and the text. Rows align by construction whatever the copy does, and the tints come from the package palette already used for package and person avatars. Restore the sentence-initial capital on Scverse. Lowercase mid-sentence uses stay as they were. Add LinkedIn to /join and the footer. The join layout picked its icon through a nine-branch if/else on the entry id; the class travels with the entry now, so the next channel is a content change only.
The engagement sections were the bullet lists the goals used to be, so they get the same icon rows. The shortcode takes a front-matter key now rather than being goals-specific, and the sub-bullets under "open communication channels" fold into their own row. Each list item gains a short label. The sentences already opened with the word that names them, so this is mostly promotion rather than new copy, and it makes the rows scannable rather than a paragraph in list clothing. Organization and vision is five paragraphs of prose and stays prose, but the definition of *core* tools is the sentence the rest of the section leans on, so it becomes a callout. Every section's opening paragraph is now set as a lead, which needs no markup — it is the paragraph after the heading.
The table of contents widens the page to 1400px, which suits the package card grid it was written for. On prose that width is unusable — the measure stays where it is readable and the extra 400px piles up on the right of every paragraph. /about keeps the normal column and the measure grows to 54rem, so the text fills the space beside the sidebar instead of hugging its left edge.
Inter ships as one variable face with no italic, so every *core* was a synthesised oblique and read as a second font. The term is italic where it is defined in the callout and plain on the five other mentions, which is the usual convention anyway. The closing paragraph said the same thing twice — core tools interface with the ecosystem, and scverse strives for interoperability with the ecosystem — so it is one sentence now. Two dashes were the wrong kind for a page that uses em dashes elsewhere.
The section stepped down through four sizes — 1.15rem lead, 1rem body from the browser default, 0.95rem callout, 0.95rem rows — so the lead read as a different document from the paragraphs under it and the callout was the smallest thing on the page despite being the part meant to stand out. #about-content sets its own body size now, the lead is one deliberate step above it rather than a cliff, and the callout matches the prose it interrupts with a rule dark enough to see.
It is the one section that is argument rather than a list, so it has no rows and nothing but paragraphs. Rather than forcing prose into cards, back its own claim — a consortium of tools with users and developers across the world — with the numbers behind it. Counts come from the package registry and the contributor list the people page already reads, so nothing is typed by hand and nothing goes stale. Each tile links to the page it counts. The hue rule was nested under .stat-value, where `&` carries the whole ancestor chain and produced `.stat[data-hue] #about-content .stat-value`, which matches nothing. Written as a descendant it works.
for more information, see https://pre-commit.ci
Keep the definition — /about/roles uses "core packages" three times without defining it, /packages only glosses it, the registry has three core-* categories and the stat tile counts them, so this is the only place on the site that says what the word means. It folds into a details disclosure instead, so it is there for whoever wants it and out of the argument for everyone else. Drop the lead-paragraph size bump. Varying paragraph sizes inside one section reads as inconsistency rather than emphasis, and hierarchy is the headings' job. Every paragraph, list row and disclosure on the page is one size now; the only others left are the stat number, its caption and the icon glyph, none of which are prose.
for more information, see https://pre-commit.ci
Contributor
love it! esp the icons :) def helps with readability |
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
2 participants
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.
Redesigns the mission page: the five goals become icon rows instead of a bullet list,
/aboutgains the table of contents sidebar, and prose gets a readable measure. Also adds LinkedIn to/joinand the footer, links the page out to/packages,/about/rolesand/joininstead of leaving it a dead end, and fixes two grammar slips.