From 1f22aa3207c59567b3d28cf12a3106ba0cdad03c Mon Sep 17 00:00:00 2001 From: Danila Poyarkov Date: Sat, 18 Jul 2026 05:56:36 +0300 Subject: [PATCH] fix(app): align layer rows and icon menus - Let virtualized Layer rows fill the panel width\n- Remove extra root indentation while preserving hierarchy depth\n- Keep icon menu labels beside their icons\n- Refresh reviewed panel snapshots --- CHANGELOG.md | 2 +- .../primitives/LayerTree/LayerTreeItem.vue | 4 +-- src/components/PagesPanel.vue | 5 +++- src/components/variables/VariablesDialog.vue | 2 +- tests/e2e/design/panel.spec.ts | 28 +----------------- .../instance-openpencil-darwin.png | Bin 26223 -> 26223 bytes .../mixed-selection-openpencil-darwin.png | Bin 17516 -> 17435 bytes ...ed-groups-layer-tree-openpencil-darwin.png | Bin 11974 -> 13820 bytes .../single-rectangle-openpencil-darwin.png | Bin 19971 -> 20248 bytes 9 files changed, 9 insertions(+), 32 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 6f0f96db1..caa1fa804 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -48,7 +48,7 @@ ### Fixes -- Align Fill and Effects sub-controls to their shared property-row content rails, and improve font-settings accessibility without clearing selection when dismissing overlays. +- Align Fill and Effects sub-controls to their shared property-row content rails, make Layer rows fill the panel with cleaner root indentation, left-align icon menu labels, and improve font-settings accessibility without clearing selection when dismissing overlays. - Restore the Variables dialog empty state, full-width table layout, unclipped type menu, and expected Escape handling in dialogs and popup menus. - Pin the patched `websocket-driver` release used through Trystero/Firebase collaboration to resolve a critical protocol-length advisory. - Preserve unrelated Figma prototype, library, export, and raw metadata when editing modeled `.fig` fields, while still overriding stale field-specific payloads. diff --git a/packages/vue/src/primitives/LayerTree/LayerTreeItem.vue b/packages/vue/src/primitives/LayerTree/LayerTreeItem.vue index 13ee4a11a..3088a3d52 100644 --- a/packages/vue/src/primitives/LayerTree/LayerTreeItem.vue +++ b/packages/vue/src/primitives/LayerTree/LayerTreeItem.vue @@ -23,7 +23,7 @@ const ctx = useLayerTree() const isSelected = computed(() => ctx.selectedIds.value.has(node.id)) const isDragging = computed(() => ctx.draggingId.value === node.id) -const padLeft = computed(() => `${8 + (level - 1) * ctx.indentPerLevel}px`) +const padLeft = computed(() => `${(level - 1) * ctx.indentPerLevel}px`) const rowEl = ref(null) @@ -67,7 +67,7 @@ defineExpose({ rowEl })