Phone: search is offered twice, in the masthead and under the bottom bar's More; remove it from the bar #339

New issue

Closed

opened 2026-10-01 06:48:35 +00:00 by tiagoagueda · 0 comments

tiagoagueda commented

2026-10-01 06:48:35 +00:00

Owner

Reported from a phone: the search icon shows twice, once in the top bar and once in the bottom navigation bar. The request is to remove the one at the bottom.

What exists

In the masthead: a link to the search page, drawn as the search icon alone, shown below lg (src/postulo/templates/base.html:133-134, data-search-link). From lg up it is the search box instead.
In the bottom bar: the More menu ends with a Search row carrying the same icon (src/postulo/templates/partials/nav_links.html:47-49, data-nav-search). The stylesheet shows it only below 768 pixels: "The search is in the masthead from md up … so More carries it only in the bar" (assets/css/app.css).

Both came with #299, and the two comments no longer agree with the page: the masthead's link is shown below md as well, so on a phone search is offered in both places. nav_links.html still says the bar has "the search, which only the bar needs".

By the code, the bottom one is inside More, not on the bar itself. If it shows on the bar directly, a screenshot here would say so.

What to do

Remove the Search row from More (data-nav-search), with its rule in assets/css/app.css and the sentences about it in the comments of nav_links.html and the stylesheet. The masthead's link stays, as does the "/" shortcut that follows it on a narrow window (data-search-link in src/postulo/static/js/app.js).
More then holds navigation items only. Check the bar for a person whose navigation has four items or fewer: More must not open on nothing. The wider layouts already hide it when the line holds everything (:not(:has(> a:nth-of-type(…)))).
npm run build:css afterwards: the compiled stylesheet is committed and CI checks it.

Done when

On a phone-width window there is one way to search, the masthead's icon, and More has no Search row.
More is not drawn when nothing is under it.
The browser tests that open More and expect the row (tests/e2e/test_navigation_bar.py:271, tests/e2e/test_reflow.py:329-334) search through the masthead's link instead; tests/test_navigation.py, which pins that link, still passes.

Related: #299, and #338, reported with it.

Reported on 2026-10-01, from a phone.

Reported from a phone: the search icon shows twice, once in the top bar and once in the bottom navigation bar. The request is to remove the one at the bottom. ## What exists - **In the masthead:** a link to the search page, drawn as the search icon alone, shown below `lg` (`src/postulo/templates/base.html:133-134`, `data-search-link`). From `lg` up it is the search box instead. - **In the bottom bar:** the *More* menu ends with a *Search* row carrying the same icon (`src/postulo/templates/partials/nav_links.html:47-49`, `data-nav-search`). The stylesheet shows it only below 768 pixels: "The search is in the masthead from `md` up … so *More* carries it only in the bar" (`assets/css/app.css`). Both came with #299, and the two comments no longer agree with the page: the masthead's link is shown below `md` as well, so on a phone search is offered in both places. `nav_links.html` still says the bar has "the search, which only the bar needs". By the code, the bottom one is inside *More*, not on the bar itself. If it shows on the bar directly, a screenshot here would say so. ## What to do - Remove the *Search* row from *More* (`data-nav-search`), with its rule in `assets/css/app.css` and the sentences about it in the comments of `nav_links.html` and the stylesheet. The masthead's link stays, as does the "/" shortcut that follows it on a narrow window (`data-search-link` in `src/postulo/static/js/app.js`). - *More* then holds navigation items only. Check the bar for a person whose navigation has four items or fewer: *More* must not open on nothing. The wider layouts already hide it when the line holds everything (`:not(:has(> a:nth-of-type(…)))`). - `npm run build:css` afterwards: the compiled stylesheet is committed and CI checks it. ## Done when - On a phone-width window there is one way to search, the masthead's icon, and *More* has no *Search* row. - *More* is not drawn when nothing is under it. - The browser tests that open *More* and expect the row (`tests/e2e/test_navigation_bar.py:271`, `tests/e2e/test_reflow.py:329-334`) search through the masthead's link instead; `tests/test_navigation.py`, which pins that link, still passes. Related: #299, and #338, reported with it. Reported on 2026-10-01, from a phone.

tiagoagueda added this to the 0.6.0 milestone

2026-10-01 06:48:35 +00:00

tiagoagueda added the

enhancement

interface

labels

2026-10-01 06:48:35 +00:00

tiagoagueda referenced this issue from a commit

2026-10-05 13:02:00 +00:00

Remove the Search row from the bottom bar's More menu

tiagoagueda closed this issue

2026-10-05 13:02:00 +00:00