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

Poster section element: a min-card-px attribute, the narrowest a card gets before a row holds one fewer (absent keeps today's layout)

Browse source
This commit is contained in:
Doxa Maps 2026-10-02 10:07:32 +00:00
parent 4bde3d7c90
commit a14da6f2fa
3 changed files with 8 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
library/components/poster/PosterSectionView.vue
View file

@ -1,7 +1,7 @@
<script setup>
/**
* PosterSectionView.vue — ONE poster section on its own: the profile behind <dxm-poster-section>.
* It reads its settings from profile-config (type, scope, collapsible, collapsed, locale, assetsBase, columns), finds the
* It reads its settings from profile-config (type, scope, collapsible, collapsed, locale, assetsBase, columns, minCardPx), finds the
* poster TYPE in posterTypes.js, and draws a PosterWall in section-only mode: the same section a wall draws (the
* same PosterSection, the same print actions and overlay), with no wall head around it.
*/
@ -61,6 +61,7 @@ const noneLine = computed(() => t('poster.sectionNone', { scope: String(cfg.valu
:instance-id="instanceId"
:is-dark="cfg.isDark === true"
:columns="cfg.columns || 0"
:min-card-px="cfg.minCardPx || 0"
:assets-base="assetsBase"
:event-name="actions.eventName"
:unit="actions.unit"

6
library/elements/posterSectionConfig.js
View file

@ -1,5 +1,5 @@
// <dxm-poster-section>'s attributes → its profile-config. Pure (no Vue), so it is testable on its own.
export const ATTRS = ['type', 'scope', 'collapsible', 'collapsed', 'locale', 'assets-base', 'api-base-url', 'is-dark', 'columns']
export const ATTRS = ['type', 'scope', 'collapsible', 'collapsed', 'locale', 'assets-base', 'api-base-url', 'is-dark', 'columns', 'min-card-px']
export const TAG = 'dxm-poster-section'
export function posterSectionConfig(el) {
@ -12,6 +12,10 @@ export function posterSectionConfig(el) {
// posters per row (1-5); absent = the wall's own default. A reader's saved choice still wins (PosterWall).
const cols = Number(a('columns'))
if (el.hasAttribute('columns') && Number.isInteger(cols) && cols >= 1 && cols <= 5) cfg.columns = cols
// the narrowest a card may get before a row holds one fewer (PosterWall's minCardPx); absent = the wall's own default.
// A host that wants two posters a row on a phone sets it low enough to fit (the Regions list: 150).
const minCard = Number(a('min-card-px'))
if (el.hasAttribute('min-card-px') && Number.isInteger(minCard) && minCard >= 80 && minCard <= 600) cfg.minCardPx = minCard
return cfg
}

2
library/elements/posterSectionElement.js
View file

@ -5,7 +5,7 @@
*
* Attributes: type (default "country"), scope (a region / continent / list key), collapsible (default on;
* collapsible="false" turns it off), collapsed (start shut), locale, assets-base, api-base-url, is-dark, columns
* (posters per row, 1-5).
* (posters per row, 1-5), min-card-px (the narrowest a card gets before a row holds one fewer).
* They are mapped into the standard element's profile-config, so the element keeps defineMapElement's per-instance
* i18n and store, and the profile (PosterSectionView.vue) reads them like every other profile reads its config.
* Any bundle can call registerPosterSectionElement(); a second call is a no-op.