Donate to Postulo/postulo

• https://buymeacoffee.com/tiagoagueda

---

See the documentation for more details on donation links.

Companies' map on phones: the Table link as its icon, with a tooltip #1016

Merged

tiagoagueda merged 3 commits from 916-map-table-icon into main 2026-10-21 14:19:47 +00:00

Conversation 0 Commits 3 Files changed 90 +428 -2

tiagoagueda commented 2026-10-19 17:32:37 +00:00

Owner

• Copy link
• Copy Markdown

Closes #916

Builds on the #915 PR (#1013) and must be merged after it. The branch is cut from 915-map-tooltips-beside, so until #1013 is merged this PR's diff also shows that commit; it needs the data-tooltip-place hook.

On a phone (below sm) the Table link on the companies' map is its icon alone, with a "Table view" tooltip below it.

• company_map.html: the word is <span class="sr-only sm:not-sr-only">Table</span> (visually hidden, not removed, so the name stays "Table"); the link is a square icon button below sm; the tooltip is aria-describedby, asks for below, and is marked data-tooltip-narrow.
• app.js: placeTip does not show a data-tooltip-narrow tooltip from sm (40rem) up, where the word is visible; the server writes it hidden, which the script lifts when it makes it a tooltip.
• New string "Table view": empty catalogue slots only (Weblate).
• Tests: tests/e2e/test_map.py (390px: icon-only, name "Table", tip below on hover and focus; 1280px: word shown, no tip), tests/test_company_map.py (markup). Full unit suite green.

Library check: none needed, a small UI change.

Model use: written with Claude Code, reviewed by the person who opens this PR.

🤖 Generated with Claude Code

Closes #916 **Builds on the #915 PR (#1013) and must be merged after it.** The branch is cut from `915-map-tooltips-beside`, so until #1013 is merged this PR's diff also shows that commit; it needs the `data-tooltip-place` hook. On a phone (below `sm`) the Table link on the companies' map is its icon alone, with a "Table view" tooltip below it. - `company_map.html`: the word is `<span class="sr-only sm:not-sr-only">Table</span>` (visually hidden, not removed, so the name stays "Table"); the link is a square icon button below `sm`; the tooltip is `aria-describedby`, asks for `below`, and is marked `data-tooltip-narrow`. - `app.js`: `placeTip` does not show a `data-tooltip-narrow` tooltip from `sm` (40rem) up, where the word is visible; the server writes it `hidden`, which the script lifts when it makes it a tooltip. - New string "Table view": empty catalogue slots only (Weblate). - Tests: `tests/e2e/test_map.py` (390px: icon-only, name "Table", tip below on hover and focus; 1280px: word shown, no tip), `tests/test_company_map.py` (markup). Full unit suite green. Library check: none needed, a small UI change. Model use: written with Claude Code, reviewed by the person who opens this PR. 🤖 Generated with [Claude Code](https://claude.com/claude-code)

tiagoagueda added 2 commits 2026-10-19 17:32:37 +00:00

Companies' map: tooltips beside their buttons, towards the map ... 5e2c112196

The Zoom in, Zoom out and Near me buttons are stacked, and the tooltip
script could only put a tooltip above or below its anchor, so each
tooltip landed over the neighbouring button.

placeTip learns two inline places, start and end: beside the anchor,
centred on it, mirrored in right-to-left pages, slid along the anchor's
side to stay inside the window. A sentence or its anchor asks for a side
with data-tooltip-place (start, end or below); that place is tried first
and the usual order follows when it has no room. The hover bridge gets an
inline variant (full height, 8px wide) so the tooltip stays hoverable
(SC 1.4.13). The three map sentences ask for start, the side facing into
the map as the buttons sit on the end side.

Tests: position, side and centring of each tip, right to left, the
bridge, and the markup.

Closes #915

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

Companies' map on phones: the Table link as its icon, with a tooltip ... a9629a652c

On a phone the Table link, the icon and the word, crowds the top of the
map. Below sm the word is now visually hidden (sr-only, not removed), so
the link keeps its name "Table" (SC 2.5.3) and becomes a square icon
button. "Table view" is its tooltip, described-by rather than the name,
placed below the link through the data-tooltip-place hook of #915.

From sm up the word is drawn and the tooltip would only repeat it, so a
tooltip marked data-tooltip-narrow is not shown at that width; the server
writes it hidden, so with scripts off it is not stray words in the page.

"Table view" is a new string, empty in the catalogues for Weblate.

This builds on #915 and must be merged after it.

Closes #916

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

tiagoagueda force-pushed 916-map-table-icon from a9629a652c to a5f3301ee8 2026-10-19 19:23:07 +00:00 Compare

tiagoagueda added 1 commit 2026-10-20 20:01:20 +00:00

Merge main into 916-map-table-icon ... 7ba5b0cd35

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

tiagoagueda added 1 commit 2026-10-21 09:38:29 +00:00

Merge remote-tracking branch 'origin/main' into HEAD 580efc7c17

tiagoagueda merged commit 87a57b64c9 into main 2026-10-21 14:19:47 +00:00

tiagoagueda referenced this pull request from a commit 2026-10-21 14:19:48 +00:00

Companies' map on phones: the Table link as its icon, with a tooltip (#1016)

tiagoagueda deleted branch 916-map-table-icon 2026-10-21 14:19:50 +00:00

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels   

accessibility

Usable by everyone, including people with disabilities: one of the project's stated missions

  

authentication

Signing in, and proving who you are

  

breaking change

Changes behaviour or data in a way operators must act on

  

bug

Something does not do what it says it does

  

documentation

The wiki, the docs, or the words in the interface

  

enhancement

An improvement or a new capability

  

interface

The shape of the pages: what is where, and how it reads

  

internationalisation

Languages, regions, and the formats and symbols that go with them

  

observability

What an operator can see about a running instance: metrics, logs, health

  

performance

Uses fewer resources, or is more reliable, with no loss of features or accessibility

  

security

Keeping the code and the data secure: one of the project's stated missions

  

tier

1

Easy: small, self-contained, no prerequisites

  

tier

2

High-severity security: account access, personal data, the boundaries

  

tier

3

Foundations: prerequisite work that unblocks other issues

  

tier/4

Later: large features and long-horizon work

No labels

accessibility

authentication

breaking change

bug

documentation

enhancement

interface

internationalisation

observability

performance

security

tier

1

tier

2

tier

3

tier/4

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

Postulo/postulo!1016

No description provided.