mirror of
https://github.com/lrnselfreliance/wrolpi.git
synced 2026-10-26 19:01:39 -04:00
eba9bbf7de
Seven review comments, all valid. The common thread is the one the guard was supposed to catch and did not: geometry converted to rem beside geometry that stayed px. The guard was narrower than its name. It missed: - `transform`, `flex` and `flex-basis`, so `translateX(26px)` and `flex: 1 1 200px` were invisible on properties nobody thought to list; - every NEGATIVE length, because the lookbehind treated the minus sign as part of the preceding token -- `left: -7px` and `margin-top: -2.5px` position the eyelet on a tag whose diamond HAD been converted, and `right: -3px` / `bottom: -3px` place the corner badge on a converted icon. Each is a piece of geometry that stopped tracking the piece it belongs to. With both fixed it found nine values, including one no comment mentioned (`flex: 1 1 200px`). All nine converted, except the three in a dead `.toggle` / `.slider` block: nothing has referenced those classes since Toggle became a Mantine Switch, and it was ALREADY broken -- track and knob in rem, travel still `translateX(26px)`, so the thumb stopped ~4px short of a 54px track. Dead CSS that is also wrong is a trap for whoever revives it, so it is deleted. The tag eyelet is centred with `translateY(-50%)` rather than a negative margin of half its own height, so the two pieces cannot drift again whatever the scale. Also from the review: - A runtime check, which is what the source guards were missing. Three cases in ui-layout.cy.js measure the real thing: the root font-size is the declared multiple of 16, our text AND a Mantine control both grow by the same factor when the scale changes, and a hairline does not. The second is the one that catches `theme.scale` being set and silently cancelling the root. - `max-height: max(..., 56.25cqw)` now follows a plain rem declaration. An engine without container query units throws out the whole declaration, which would have left the poster with NO cap -- a portrait cover standing as tall as the card is wide. Older engines clamp; newer ones take the second. - `pxToRem` in components/ui/scale.ts, replacing the `/ 16` written out in CardGroup and Placeholder. - The map overlays: 20 values across the layer panel, add-pin dialog, search panel and context menu, whose type had grown 10% while their padding had not. Left in px on purpose: the context menu's `left`/`top` (a real click coordinate), maplibre's own `ScaleControl` maxWidth, and the `calc(100% - 100px)` reserve for maplibre's px-sized controls. The `100vh - 120px` reserve DID become rem, since the chrome it reserves for is ours. - The keyboard-shortcuts spec no longer deletes `.mantine-Notifications-root` from the DOM. The reviewer was right that it is brittle; the endpoints are mocked instead, now that the probe named them: `/api/tag`, `/api/events/feed`, `/api/files/search` and `/api/files/worker_status`. Two of those were already "mocked" as `/api/tags` and `/api/events`, which nothing calls -- the wrong paths were the reason a toast appeared at all. Verified under CI's condition (`forceNetworkError` on everything unmocked): 12 passing with no DOM surgery. What is NOT done, deliberately: about 176 numeric geometry values remain in 23 feature files. The map overlays were the visible ones. Sweeping the rest is a change to 23 files nobody has reviewed, so instead the guard's name now says "in our stylesheets" rather than implying the whole app, and a new ratchet keeps numeric geometry out of the component library so the eleventh inline `gap: 10` cannot be added there. Both new guards planted against. Verified: 1142 jest / 65 suites, 251 ui-layout + 10 modal-stack component tests, all 50 e2e specs, clean build, map overlays measured to track the scale (panel minWidth 200 -> 220, search 320 -> 352) and screenshotted. |
||
|---|---|---|
| .. | ||
| admin | ||
| calculators | ||
| collections | ||
| inventory | ||
| ui | ||
| AddToPlaylist.js | ||
| Apps.js | ||
| Archive.js | ||
| ArchivePreview.js | ||
| BulkTagModal.js | ||
| BulkTagModal.test.js | ||
| Calculators.js | ||
| CbzViewer.js | ||
| Channels.cy.js | ||
| Channels.js | ||
| Common.js | ||
| Common.test.js | ||
| DatesSelector.js | ||
| DesktopToggle.test.js | ||
| Docs.js | ||
| DomainEditPage.test.js | ||
| DomainsPage.test.js | ||
| DomainTagging.test.js | ||
| DonatePage.js | ||
| Download.cy.js | ||
| Download.js | ||
| Download.test.js | ||
| ErrorBoundary.js | ||
| FileBrowser.js | ||
| FileBrowser.test.js | ||
| FilePreview.js | ||
| FilePreview.test.js | ||
| Files.js | ||
| Flasher.js | ||
| Flasher.test.js | ||
| Headline.js | ||
| HelpModal.js | ||
| KeyboardShortcutsProvider.js | ||
| Map.js | ||
| Map.test.js | ||
| MapSearchView.js | ||
| MapViewer.js | ||
| Nav.js | ||
| otp.js | ||
| otp.test.js | ||
| Placeholder.js | ||
| Playlists.js | ||
| Playlists.test.js | ||
| Search.js | ||
| SearchFilterModal.test.js | ||
| Share.js | ||
| ShortcutHint.js | ||
| SortableTable.js | ||
| Tables.js | ||
| TaggedDeleteConfirmModal.js | ||
| TaggedDeleteConfirmModal.test.js | ||
| Theme.tsx | ||
| ThemeProvider.test.js | ||
| ThemeSamplePage.js | ||
| Upload.js | ||
| Vars.js | ||
| VideoPlayer.js | ||
| VideoPlayer.test.js | ||
| Videos.js | ||
| VncToggle.test.js | ||
| Zim.js | ||
| Zim.test.js | ||