Web build on a phone: the fold arrow of an h1/h2 block lies on its bullet, so tapping the bullet folds instead of zooming in

Aperta Adatta ai principianti
  • Qualcosa non va?
#1,509 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
2/5
Tempo stimato
1-3 ore
Idoneità per principianti
87/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Attiva
Stack tecnologico
css
Ambito
frontend

Direzione di ricerca

Leggi le regole del pulsante di chiusura in src/main/frontend/components/theme.css e le regole dei contenitori h1/h2 in src/main/frontend/components/block.css, poi confrontale con src/main/mobile/components/app.css. Riproduci il problema in una build web per iPhone con un blocco h1 o h2 che abbia un elemento figlio. Il lavoro è completato quando la freccia si trova a destra e toccando il punto elenco la vista si ingrandisce.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Search first
  • I searched and no similar issues were found
What Happened?

In the web build on a phone (Safari or the home-screen web app), fold arrows sit on the right of each block, except in h1 and h2 heading blocks that have children. There the arrow sits on top of the bullet, and tapping the bullet folds the block instead of zooming in.

With fold arrows on the right (state/enable-fold-button-right?, true on mobile below the sm breakpoint), src/main/frontend/components/theme.css makes the arrow absolutely positioned (line 140) and keeps its wrapper static (line 123), so the arrow is placed against the block row:

main.ls-fold-button-on-right .block-control-wrap { position: static; }
main.ls-fold-button-on-right .ls-block .block-control { @apply absolute top-0 -right-1 z-[1]; }

For headings, src/main/frontend/components/block.css lowers the bullet by making that same wrapper relative (lines 1023-1027 for h1, 1039-1043 for h2):

.block-main-container[data-has-heading="2"] > .block-control-wrap { @apply relative top-2.5; }

That rule is more specific than the static one, so the wrapper becomes the arrow's containing block, and right: -4px puts the arrow on the bullet. The native mobile app already handles this in src/main/mobile/components/app.css (lines 203-225): heading wrappers stay static and are lowered with margin-top instead. That stylesheet is part of the mobile app only, so the web build on a phone doesn't get it. All these rules are unchanged on master 25b5ecf9cc (03-11-2026).

Reproduce the Bug
  1. Open the web build on a phone in portrait.
  2. Make a block a heading (h1 or h2) and give it a child.
  3. The fold arrow appears on the left, on top of the bullet. Tap the bullet: the block folds instead of zooming in.
Expected Behavior

The arrow sits on the right like on every other block, and tapping the bullet zooms in.

Moving the mobile app's rules to the shared CSS, scoped to main.ls-fold-button-on-right, should fix it. I override it locally like this, and it works on an iPhone:

main.ls-fold-button-on-right .block-main-container:is([data-has-heading='1'], :has(textarea.h1)) > .block-control-wrap { position: static; margin-top: 1rem; }
main.ls-fold-button-on-right .block-main-container:is([data-has-heading='2'], :has(textarea.h2)) > .block-control-wrap { position: static; margin-top: .625rem; }
Screenshots
Image Image
Desktop or Mobile Platform Information

iPhone, iOS 27.2 (Safari), as a PWA; web build from master 408198a4fe (24-10-2026).

Additional Context

Same pattern as logseq/db-test#1507 (being fixed in logseq/logseq#13934): a fix that exists in the mobile app's app.css but not in the web build.

Found and diagnosed with the help of an AI coding assistant reading the source. I confirmed it on an iPhone: the arrow lies on the bullet with the stock CSS, and moves to the right with the override.

If moving these rules is acceptable, I can open a PR for it.

Are you willing to submit a PR? If you know how to fix the bug.
  • I'm willing to submit a PR (Thank you!)
Lingua principale
Nessun dato sulla lingua
Stelle
29
Fork
2
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di logseq/db-test

Tutte le issue di logseq/db-test

Issue simili

Altre issue su Web Dev

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.