letsbe/pn-new-crm
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

fix(mobile): drop positive display rule that overrode desktop shell's flex layout

Browse Source
This commit is contained in:
Matt Ciaccio
2026-04-29 14:20:11 +02:00
parent 19bc2f2a54
commit e6ce265be0
1 changed files with 8 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
src/app/globals.css
View File

@@ -129,14 +129,15 @@
} }
/* ─── Form-factor shell visibility ────────────────────────────────────────── /* ─── Form-factor shell visibility ──────────────────────────────────────────
* Two shells (desktop + mobile) render to the DOM on every page; CSS reveals * Two shells (desktop + mobile) render to the DOM on every page; CSS hides
* one and hides the other. The data-form-factor body attribute is set * the inactive one. The data-form-factor body attribute is set server-side
* server-side from User-Agent (see src/lib/form-factor.ts). The media-query * from User-Agent (see src/lib/form-factor.ts). The media-query fallback
* fallback handles desktop browsers resized below lg (1024px), or stripped UAs. * handles desktop browsers resized below lg (1024px), or stripped UAs.
*
* IMPORTANT: only `display: none` rules are emitted — we never set a positive
* display, because the desktop shell uses Tailwind's `flex` class which would
* be overridden by `display: block` (same specificity, later cascade).
*/ */
[data-shell='desktop'] {
display: block;
}
[data-shell='mobile'] { [data-shell='mobile'] {
display: none; display: none;
} }