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

On a phone the grid's pill search keeps its own 15.2px text, so the placeholder fits beside the round ☰

Browse source 
With the ☰ resting in its corner the row pads its footprint on both sides, leaving the field about
230px wide at 390, where the live list's 19.5px text doesn't fit the placeholder. Above 576px the field
keeps the live list's size.
This commit is contained in:
Doxa Maps 2026-09-30 10:10:00 +00:00
parent 711a8b3e64
commit 3548c73c09
1 changed files with 7 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
plugin-designs/people-groups-grid/people-groups-grid.vue
View file

@ -1420,6 +1420,13 @@ onMounted(() => {
font-family: Poppins, -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif; font-size: 19.5px;
}
.pgg-root .pgg-search .search-box input::placeholder { color: rgb(128, 128, 128); }
/* A phone keeps the grid's own 15.2px text and insets inside the same pill. There the row pads the round
☰'s footprint on both sides whenever the ☰ rests in its corner (see .pgg-search--repel), which leaves the
field about 230px wide at 390, and at the live list's 19.5px the placeholder does not fit in it. */
@media (max-width: 576px) {
.pgg-root .pgg-search .search-box input { font-size: 0.95rem; padding-inline: 38px 12px; }
.pgg-root .pgg-search .search-box .search-icon { inset-inline-start: 12px; width: 18px; height: 18px; }
}
.pgg-root .filters__toggle {
background: none; border-color: transparent; border-radius: 100px; padding: 10px 42px; line-height: 1;
font-family: 'Brandon Grotesque', Poppins, -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;