diff --git a/demo/smoke_icon_scale.mjs b/demo/smoke_icon_scale.mjs new file mode 100644 index 0000000..e2a5f17 --- /dev/null +++ b/demo/smoke_icon_scale.mjs @@ -0,0 +1,38 @@ +// Множитель «размер значка» обязан масштабировать ГЛИФ вместе с подложкой: +// --mdc-icon-size считался от базового --icon-size, и «увеличенный» значок +// был пустой рамкой вокруг дефолтной иконки (репорт пользователя, 2026-07-29). +import { launch, checkAll, finish } from './serve.mjs'; +const { page, browser } = await launch(); +const out = await page.evaluate(async () => { + const o = {}; + const c = window.__card; + const sr = () => c.shadowRoot || c.renderRoot; + const d = c._devices.find((x) => x.space === 'f1' && x.bindingKind === 'device'); + const glyphW = () => { + const el = [...sr().querySelectorAll('.dev')].find((e) => !e.classList.contains('ghost')); + const ic = el?.querySelector('ha-icon'); + return ic ? ic.getBoundingClientRect().width : 0; + }; + const badgeW = () => { + const el = [...sr().querySelectorAll('.dev')].find((e) => !e.classList.contains('ghost')); + return el ? el.getBoundingClientRect().width : 0; + }; + // базовый размер + const g1 = glyphW(), b1 = badgeW(); + // множитель ×3 на всех авто-устройствах через маркер первого + c._serverCfg.markers = (c._serverCfg.markers || []).filter((m) => m.id !== d.id); + c._serverCfg.markers.push({ id: d.id, binding: 'device:' + d.bindingRef, size: 3 }); + c._cfgEpoch++; c._regSignature = ''; + c._maybeRebuildDevices(); c.requestUpdate(); await c.updateComplete; + await new Promise((r) => setTimeout(r, 100)); + const scaled = [...sr().querySelectorAll('.dev')].find((e) => (e.getAttribute('style') || '').includes('--dev-scale:3')); + const g3 = scaled?.querySelector('ha-icon')?.getBoundingClientRect().width || 0; + const b3 = scaled?.getBoundingClientRect().width || 0; + o.badgeScales = b3 > b1 * 2.5; + o.glyphScalesWithBadge = g3 > g1 * 2.5; // раньше глиф оставался базовым + o.glyphFillsBadge = g3 / b3 > 0.45 && g3 / b3 < 0.8; // пропорция сохранена + c._serverCfg.markers = c._serverCfg.markers.filter((m) => m.id !== d.id); + c._cfgEpoch++; c._regSignature = ''; c._maybeRebuildDevices(); + return o; +}); +await finish(browser, checkAll(out)); diff --git a/demo/srv/assets/houseplan-card.js b/demo/srv/assets/houseplan-card.js index 0109c0b..cfaa3f2 100755 --- a/demo/srv/assets/houseplan-card.js +++ b/demo/srv/assets/houseplan-card.js @@ -942,7 +942,11 @@ const t=globalThis,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow z-index: 2; } .dev ha-icon { - --mdc-icon-size: calc(var(--icon-size, 2.5cqw) * 0.62); + /* from --dev-size, NOT --icon-size: the per-device size multiplier must + scale the GLYPH with its badge. Pinned to the base size, "make this + icon bigger" grew an empty box around a default-size glyph (user + report via the owner, 2026-07-29). */ + --mdc-icon-size: calc(var(--dev-size, var(--icon-size, 2.5cqw)) * 0.62); display: flex; align-items: center; justify-content: center; diff --git a/dist/houseplan-card.js b/dist/houseplan-card.js index 0109c0b..cfaa3f2 100755 --- a/dist/houseplan-card.js +++ b/dist/houseplan-card.js @@ -942,7 +942,11 @@ const t=globalThis,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow z-index: 2; } .dev ha-icon { - --mdc-icon-size: calc(var(--icon-size, 2.5cqw) * 0.62); + /* from --dev-size, NOT --icon-size: the per-device size multiplier must + scale the GLYPH with its badge. Pinned to the base size, "make this + icon bigger" grew an empty box around a default-size glyph (user + report via the owner, 2026-07-29). */ + --mdc-icon-size: calc(var(--dev-size, var(--icon-size, 2.5cqw)) * 0.62); display: flex; align-items: center; justify-content: center; diff --git a/docs/TESTING.md b/docs/TESTING.md index 74e75a7..aefd6e5 100644 --- a/docs/TESTING.md +++ b/docs/TESTING.md @@ -244,6 +244,9 @@ Run the *core flows* (marked ★ below) in each environment at least once per mi at 70% of a device icon and zooming WITH the plan; the small metric rows under the room name now show in the plan editor too [auto: smoke_room_cards gearDetached/plainInPlan] +- [ ] Icon size multiplier scales the glyph (dev): set a marker's size to 3 — + the icon inside grows with the badge instead of staying default + [auto: smoke_icon_scale] - [ ] Auto-grid parity (v1.51.2, HP-1511-01): with an empty layout, a visible device among hidden ones sits at the same spot on both cards [auto: smoke_hidden_flag autoGridParity] diff --git a/src/styles.ts b/src/styles.ts index 0e1747e..b2e8ff0 100644 --- a/src/styles.ts +++ b/src/styles.ts @@ -939,7 +939,11 @@ export const cardStyles = css` z-index: 2; } .dev ha-icon { - --mdc-icon-size: calc(var(--icon-size, 2.5cqw) * 0.62); + /* from --dev-size, NOT --icon-size: the per-device size multiplier must + scale the GLYPH with its badge. Pinned to the base size, "make this + icon bigger" grew an empty box around a default-size glyph (user + report via the owner, 2026-07-29). */ + --mdc-icon-size: calc(var(--dev-size, var(--icon-size, 2.5cqw)) * 0.62); display: flex; align-items: center; justify-content: center;