From 47d7ad2de17e9817138717c9887fa3b2936d5156 Mon Sep 17 00:00:00 2001
From: Eva Marco <eva.marco@kaleidos.net>
Date: Tue, 20 Oct 2026 09:19:17 +0200
Subject: [PATCH] :recycle: Explain layout_container's deprecated import and
 format visual spec (#12449)

* :recycle: Explain why layout_container.scss keeps the deprecated import

The TODO at the top said to remove the refactor/ import once the buttons
were replaced, and sat above the DS imports instead of that one. The
buttons are now DS buttons (#12428, #12431), but the import is still
needed by the numeric inputs (%input-element, %disabled-input) and by the
two raw track header buttons, which keep the secondary and tertiary
placeholders. Replace the TODO with a comment on the import that says so.

AI-assisted-by: claude-opus-5-5

* :paperclip: Format the workspace visual spec with Prettier

Three expectations added in #12423, #12428 and #12431 broke a call chain
in a way Prettier rewrites. check-fmt:js did not catch it: its
playwright/**/*.js glob is expanded by the shell without globstar, so it
does not reach visual-specs/.

AI-assisted-by: claude-opus-5-5
---
 .../playwright/ui/visual-specs/workspace.spec.js  | 15 +++++++++------
 .../sidebar/options/menus/layout_container.scss   |  4 +++-
 2 files changed, 12 insertions(+), 7 deletions(-)

diff --git a/frontend/playwright/ui/visual-specs/workspace.spec.js b/frontend/playwright/ui/visual-specs/workspace.spec.js
index 1c382e7c25..f18514cc9d 100644
--- a/frontend/playwright/ui/visual-specs/workspace.spec.js
+++ b/frontend/playwright/ui/visual-specs/workspace.spec.js
@@ -71,8 +71,9 @@ test.describe("Grid layout", () => {
 
     await workspace.clickLeafLayer("Board");
     const section = page.getByTestId("inspect-layout");
-    await expect(section.getByRole("button", { name: "Edit grid" }))
-      .toBeVisible();
+    await expect(
+      section.getByRole("button", { name: "Edit grid" }),
+    ).toBeVisible();
     // The buttons are a small part of the section: compare every pixel.
     await expect(section).toHaveScreenshot("grid-layout-options.png", {
       maxDiffPixelRatio: 0,
@@ -187,8 +188,9 @@ test.describe("Design tab", () => {
     await padding.click();
     await padding.blur();
     await page.mouse.move(0, 0);
-    await expect(section.getByRole("textbox", { name: /top padding/i }))
-      .toBeVisible();
+    await expect(
+      section.getByRole("textbox", { name: /top padding/i }),
+    ).toBeVisible();
     await expect(section).toHaveScreenshot("flex-layout-pressed.png", {
       maxDiffPixelRatio: 0,
       threshold: 0,
@@ -255,8 +257,9 @@ test.describe("Design tab", () => {
     await marginMode.click();
     await marginMode.blur();
     await page.mouse.move(0, 0);
-    await expect(section.getByRole("textbox", { name: "Top margin" }))
-      .toBeVisible();
+    await expect(
+      section.getByRole("textbox", { name: "Top margin" }),
+    ).toBeVisible();
     await expect(section).toHaveScreenshot("margin-multiple.png", {
       maxDiffPixelRatio: 0,
       threshold: 0,
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.scss b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.scss
index 34f3d81b43..c92abb2dc9 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.scss
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/layout_container.scss
@@ -4,13 +4,15 @@
 //
 // Copyright (c) KALEIDOS SUBSIDIARY SL
 
-// TODO: When button replace remove this @use
 @use "ds/_utils.scss" as *;
 @use "ds/_sizes.scss" as *;
 @use "ds/_borders.scss" as *;
 @use "ds/typography.scss" as t;
 @use "ds/spacing.scss" as *;
 @use "ds/mixins.scss" as *;
+
+// Only for %input-element and %disabled-input (numeric inputs) and the
+// secondary and tertiary placeholders of the raw track header buttons.
 @use "refactor/common-refactor.scss" as deprecated;
 @use "../../../sidebar/common/sidebar.scss" as sidebar;