doxa-life/doxa-maps
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

The phone notice holds its place above any profile, and pads the right side in Arabic

Browse source 
A larger-screens profile whose root is position:absolute; inset:0 would
lay out against ProfileLoader's wrapper and paint over the in-flow bar,
hiding the notice and its dismiss button. While the bar shows, the
profile's root is held in flow as the column's second item. No flagged
profile has that shape today; the next one will not need a special case.

The bar's padding is logical, so in Arabic the wider side stays on the
text rather than moving to the dismiss button.
This commit is contained in:
Doxa Maps 2026-09-29 08:01:15 +00:00
parent f9c621c647
commit d9fb0a137b
2 changed files with 9 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
library/ProfileLoader.vue
View file

@ -452,6 +452,12 @@ provide('dataStore', dataStore)
.profile-loader.has-screen-notice > :not(.lsn-bar) {
flex: 1 1 auto;
min-height: 0;
/* A profile whose ROOT is position:absolute; inset:0 would be laid out against this wrapper and paint
over the bar, hiding the notice and its ×. While the bar shows, the root is held in flow as the
column's second item; its own absolute children still anchor on it. No flagged profile has that
shape today; this keeps the next one from needing a special case. */
position: relative !important;
inset: auto !important;
}
.profile-error {

4
library/components/LargerScreenNotice.vue
View file

@ -55,7 +55,9 @@ const blockParts = computed(() => T('messages.desktopOnlyNotice',
gap: 8px;
flex: none;
margin: 0;
padding: 8px 8px 8px 12px;
/* Logical, so in Arabic the wider side stays on the text and the narrow one on the ×. */
padding-block: 8px;
padding-inline: 12px 8px;
background: #fff8e1;
border-block-end: 1px solid #f0d68a;
color: #4a3b00;