oficina / docs Public

Lift Docs' own text controls to 16px on a touch screen

Three fields set their font with a selector heavier than tokens.css's
bare `input`, so its coarse-pointer rule never reached them and iOS still
zoomed on tap: the toolbar's three comboboxes (and their selects before
select.js runs) at --rst-fs-sm, 12.5px; the published-link field on the
share page, also 12.5px; and the jump-to palette's field, `font: inherit`
at 14px. Each restates max(1rem, 1em) under (pointer: coarse) at its own
weight. Mouse styles are unchanged.

TestNoZoomOnTap failed on exactly these fields before this commit and
passes after it.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

Paul Campbell pushed by paul@keymail.dev 2 weeks ago 61d9e7899013587b9e462459ee05e753e9fd4c60 parent 62b9595

3 files changed, +28 −0

internal/docs/views/partials/jumpto.html +8 −0
internal/docs/views/share.html +8 −0
internal/docs/views/show.html +12 −0

Intent

full ledger: chore/rastrillo-path

diff --git a/internal/docs/views/partials/jumpto.html b/internal/docs/views/partials/jumpto.html

index a425ddd..70c7878 100644

--- a/internal/docs/views/partials/jumpto.html

+++ b/internal/docs/views/partials/jumpto.html

@@ -61,6 +61,14 @@

color: var(--rst-text);

font: inherit;

}

+ /* `font: inherit` here outweighs tokens.css's bare `input`, whose

+ coarse-pointer rule lifts fields to 16px so iOS does not zoom on tap

+ (TestNoZoomOnTap). Same rule, at this weight. */

+ @media (pointer: coarse) {

+ [docs-jumpto-input] {

+ font-size: max(1rem, 1em);

+ }

[docs-jumpto-list] {

margin: 0;

padding: var(--rst-sp-1);

diff --git a/internal/docs/views/share.html b/internal/docs/views/share.html

index 0144a6b..5dee3c4 100644

--- a/internal/docs/views/share.html

+++ b/internal/docs/views/share.html

@@ -65,6 +65,14 @@

font-family: "SFMono-Regular", Consolas, monospace;

font-size: var(--rst-fs-sm);

}

+ /* Read-only, but a tap still focuses it (to select the link), and iOS

+ zooms into anything under 16px: tokens.css's touch rule, restated at

+ this selector's weight (TestNoZoomOnTap). */

+ @media (pointer: coarse) {

+ [docs-share-url-input] {

+ font-size: max(1rem, 1em);

+ }

/* The Copy button ships hidden until share-link.mjs mounts it, and

[rst-btn]'s display: inline-flex beats the user agent's [hidden], so

without this rule it showed with no script and did nothing. */

diff --git a/internal/docs/views/show.html b/internal/docs/views/show.html

index f152217..4ad95a3 100644

--- a/internal/docs/views/show.html

+++ b/internal/docs/views/show.html

@@ -1071,6 +1071,18 @@

color: var(--rst-text-faint);

cursor: default;

}

+ /* iOS zooms the page into any text control under 16px, and tokens.css

+ brings controls up to 16px where the pointer is coarse. The three

+ comboboxes (and their selects, before select.js runs) set

+ --rst-fs-sm with selectors that outweigh its bare `input`, so they

+ stayed at 12.5px. Same rule, same max(), restated at their weight.

+ TestNoZoomOnTap (browser tag) measures them. */

+ @media (pointer: coarse) {

+ [docs-toolbar] [rst-combo] [rst-input],

+ [docs-tool-select] {

+ font-size: max(1rem, 1em);

+ }

</style>

{{/* This page has no [rst-page-header]. It used to, and what it held

is not gone — every piece of it moved to where its equivalent