BitSquare/Codeman
2
0
Fork 0
mirror of https://github.com/Ark0N/Codeman.git synced 2026-10-05 23:19:43 +02:00
Code Issues Packages Projects Releases Wiki Activity

feat(readmymind): alternates row, phone accessory key, phone-sized modal (phase 3 part 1)

Browse Source 
The Read My Mind modal grows up and reaches phones:

- Alternate suggestions (the predictor's verify/redirect kinds) now render
  as tappable rows below the main field. Tapping one swaps it into the
  editable field; the edit you were making folds back into the row you
  leave, so toggling between alternates never loses typing. Rethink now
  records the WHOLE shown set (main + alternates) as rejected.
- Phones get a 🧠 key on the keyboard accessory bar (both simple and
  extended layouts), gated on the same synced readMyMindEnabled setting
  via an rmm-enabled marker class on the BAR element: setMode() rebuilds
  the buttons' innerHTML, so per-key state would be wiped. Synced at init
  and re-synced by applyHeaderVisibilitySettings() on every settings
  apply, so a live toggle needs no reload. The header button stays off
  phones.
- On phones the modal renders as a small dialog (mirrors modal-sm) instead
  of the full-screen default, with wrap-friendly finger-sized footer
  buttons. Not modal-sm itself: that caps desktop width at 340px and this
  modal wants 560px there.
- On touch devices the ready/swap paths no longer focus the field, so the
  OS keyboard does not pop over the alternates that just rendered.
- New static guard test/readmymind-phone-key.test.ts pins the dual-template
  key, the marker-class gating, the phone-hidden header button, the
  small-dialog phone modal, and the no-innerHTML discipline.

Part 2 of phase 3 (rethink steering, the free-text steer note) is next;
the API already accepts steer.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Codeman maintainer
2026-08-10 03:57:06 +02:00
parent c891a8045d
commit a070fc43ea
11 changed files with 272 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/web/public/mobile.css
+30 -2
View File
@@ -530,8 +530,9 @@ html.mobile-init .file-browser-panel {
display: none !important;
}
/* Read My Mind 🧠 button: desktop header only in phase 2; the phone surface
is a planned keyboard-accessory key (docs/readmymind-plan.md phase 3). */
/* Read My Mind 🧠 header button: never in the phone header; the phone
surface is the keyboard-accessory 🧠 key (same `readMyMindEnabled` gate,
see keyboard-accessory.js + the rmm-enabled rules in styles.css). */
.btn-icon-header.btn-readmymind {
display: none !important;
}
@@ -1299,6 +1300,33 @@ html.mobile-init .file-browser-panel {
width: calc(100% - 2rem);
}
/* Read My Mind: a small dialog (mirrors modal-sm), not a full-screen
takeover — it opens over the keyboard from the accessory 🧠 key and
should read as a quick suggestion sheet. Not modal-sm itself because
that caps desktop width at 340px; this modal wants 560px there. */
.modal-content.readmymind-modal {
height: auto;
max-height: 85vh;
border-radius: 12px;
margin: 1rem;
width: calc(100% - 2rem);
}
/* Four footer buttons on a narrow phone: let them wrap instead of clipping,
and give buttons + alternate rows finger-sized targets. */
.readmymind-modal .modal-footer {
display: flex;
flex-wrap: wrap;
justify-content: flex-end;
gap: 0.5rem;
}
.readmymind-modal .modal-footer .btn {
flex: 1 1 auto;
min-height: 38px;
}
.readmymind-alt {
min-height: 38px;
}
/* Modal safe area padding - all sides for full-screen modals */
.ios-device .modal-content {
padding-top: var(--safe-area-top);