fix(docs): make the landing stylesheets direction-aware (#146) - #282
Merged
Conversation
Markleaf lays out right-to-left note content correctly since v2.28.0, but the site around it was written in physical directions: `left` on the skip link and the file-receipt card, `border-left` on the trust-ledger dividers, `padding-left` on the feature-point bullets and their dash, `text-align: right` on the channel-row status. Each of those is identical under LTR and visibly broken under RTL. Swap them for logical properties, and add `[dir="rtl"]` rules for the three things direction alone does not carry: an Arabic-script system font stack (no webfont is fetched, the pages still request nothing), normal letter-spacing in place of the negative Latin display tracking, and a mirrored hover nudge with its :active reset. No page changes here - the six landing pages, six privacy pages and six READMEs are untouched. Measuring every element on 14 pages at four widths, old CSS against new, the real pages come out box-identical; the only computed-style difference anywhere is `text-align` reporting `start` instead of `left`. A throwaway dir="rtl" copy of index.html and privacy.html mirrors correctly and clears the overflow gate at 320px. That gate only fired on `docs/**.html`, so a stylesheet change - the one most able to overflow a page - could reach main untested. `docs/**.css` joins both path filters. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
jeiel85
added a commit
that referenced
this pull request
Jul 27, 2026
Codex review flagged the missing documentation record. AGENTS.md keeps a work-unit entry in HISTORY.md for every change, and PR #282 — a docs-only landing and README change — set the precedent. The same review also asked for a CHANGELOG entry. That half does not apply: CHANGELOG.md is strictly version-sectioned and is the source the release job's awk parser cuts GitHub release notes from, it has no Unreleased section, and this change carries no version bump, so an entry would mean inventing a version or editing v2.32.1's already-published notes. Nothing about the app changed. The HISTORY entry records that reasoning. Co-Authored-By: Claude Opus 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
1 participant
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.
Markleaf has laid out right-to-left note content correctly since v2.28.0 (#146). The site around it never had to: both stylesheets are written in physical directions, so a
dir="rtl"page would break in ways that have nothing to do with translation.What changes
Physical offsets become logical ones — no-ops under LTR, correct under RTL:
.skip-link,.file-receiptleftinset-inline-start.file-receipt,.proof-item + .proof-itemborder-leftborder-inline-start.feature-points li,.hero-product > figcaption,.content ulpadding-leftpadding-inline-start.feature-points li::beforeleft: 0inset-inline-start: 0.file-browser-bar strongmargin-leftmargin-inline-start.channel-row emtext-align: right / lefttext-align: end / startThree things direction alone does not carry get
[dir="rtl"]rules: an Arabic-script system font stack (no webfont is fetched — the pages still request nothing external),letter-spacing: normalin place of the negative Latin display tracking, and a mirrored hover nudge for.channel-rowwith its:activereset, sincetranslateXhas no logical form.No page content changes. The six landing pages, six privacy pages and six READMEs are untouched.
Verification
text-alignreportingstartinstead oflefton three.channel-row em— the same rendering.dir="rtl"copies ofindex.htmlandprivacy.htmlmove 20 elements and pick up the new stack; screenshots confirm it — the file-receipt card and its green accent border swap to the inline-start edge, matching the LTR layout mirrored.scripts/check-landing-overflow.mjspasses 14 pages x 6 widths with both probes included, 320px floor included.Pixel diffing was tried first and dropped: the animated tablet GIFs and the
loading="lazy"webps make the same tree screenshot differently twice, producing four to nine phantom regressions per run.Gate
landing-checkonly fired ondocs/**.html, so a stylesheet change — the one most able to overflow a page — could reachmainuntested.docs/**.cssjoins both path filters, which is what puts this PR through the gate.🤖 Generated with Claude Code