Companies map: the whole window, with the heading and a Table switch over it #849

New issue

Closed

opened 2026-10-10 16:01:22 +00:00 by tiagoagueda · 0 comments

tiagoagueda commented

2026-10-10 16:01:22 +00:00

Owner

The companies map as a full-window view: only the masthead (and the bottom bar on phones) around it; the footer replaced by a line of text over the map; the h1 Companies drawn over the map where a heading belongs, with a Table button (table icon) at its end; and on the table view a matching Map button (map icon). The map follows the theme: darker in the dark theme.

What exists today

The map is a server-written SVG, Natural Earth 1:110m, one dot per place (templates/jobs/company_map.html:28-41, CompanyMapView jobs/views.py:153-226); a list of places beside it is the page for assistive technology (#108). No Leaflet, no tiles. The SVG already follows the dark theme (text-ink-200 dark:text-ink-700).
Leaflet and tiles are decided in #700 (closed): Leaflet 1.9.4 vendored, no tiles by default, a zoomable map only when the operator sets a tile source, same-origin first — delivered by #702. Grouping by place is #703.
The page's heading is Companies on a map with a Companies button back (:9, :15); the table's Map button has no icon (jobs/company_list.html:89). table and map are not synced icons (assets/icons.txt).
The footer is in no template block (base.html:309-351), so no page can hide it; --header-height and --bottom-bar-height are measured.

What would change

A {% block footer %} (or a body hook); the map page empties main_width, fills calc(100dvh - var(--header-height) - var(--bottom-bar-height)), and draws the heading, the Table button and the footer's line over the map.
Table and Map switches with icons on both views.
Dark theme: with the SVG, nothing to do; with #702's tiles, a dark tile URL beside the light one, or a CSS filter on the tile pane.
The list of places stays reachable: a drawer or an sr-only list, since it is the accessible form of the page.

Decisions

Before or after #702. Recommended: the layout now with the SVG, the tile theming in #702.
The heading becomes Companies as asked, with the place count in the overlay.

Checked against main at 8c3d03570. From the maintainer's improvements list of 2026-10-07.

The companies map as a full-window view: only the masthead (and the bottom bar on phones) around it; the footer replaced by a line of text over the map; the `h1` *Companies* drawn over the map where a heading belongs, with a *Table* button (`table` icon) at its end; and on the table view a matching *Map* button (`map` icon). The map follows the theme: darker in the dark theme. ## What exists today - The map is a server-written SVG, Natural Earth 1:110m, one dot per place (`templates/jobs/company_map.html:28-41`, `CompanyMapView` `jobs/views.py:153-226`); a list of places beside it is *the page* for assistive technology (#108). No Leaflet, no tiles. The SVG already follows the dark theme (`text-ink-200 dark:text-ink-700`). - **Leaflet and tiles are decided in #700** (closed): Leaflet 1.9.4 vendored, no tiles by default, a zoomable map only when the operator sets a tile source, same-origin first — **delivered by #702**. Grouping by place is #703. - The page's heading is *Companies on a map* with a *Companies* button back (`:9`, `:15`); the table's *Map* button has no icon (`jobs/company_list.html:89`). `table` and `map` are not synced icons (`assets/icons.txt`). - The footer is in no template block (`base.html:309-351`), so no page can hide it; `--header-height` and `--bottom-bar-height` are measured. ## What would change - A `{% block footer %}` (or a body hook); the map page empties `main_width`, fills `calc(100dvh - var(--header-height) - var(--bottom-bar-height))`, and draws the heading, the *Table* button and the footer's line over the map. - *Table* and *Map* switches with icons on both views. - Dark theme: with the SVG, nothing to do; with #702's tiles, a dark tile URL beside the light one, or a CSS filter on the tile pane. - The list of places stays reachable: a drawer or an `sr-only` list, since it is the accessible form of the page. ## Decisions - **Before or after #702.** Recommended: the layout now with the SVG, the tile theming in #702. - **The heading** becomes *Companies* as asked, with the place count in the overlay. Checked against `main` at `8c3d03570`. From the maintainer's improvements list of 2026-10-07.

tiagoagueda added this to the 0.6.0 milestone

2026-10-10 16:01:22 +00:00

tiagoagueda added the

accessibility

enhancement

interface

labels

2026-10-10 16:01:22 +00:00

tiagoagueda referenced this issue

2026-10-12 14:16:48 +00:00

Draw the map with Leaflet, over OpenStreetMap tiles by default, with the tile source in Server settings #898

tiagoagueda referenced this issue from a commit