From 91f1d1569afa28dff9e7b59ff87bea9c54c64e3c Mon Sep 17 00:00:00 2001
From: adilallo <39313955+adilallo@users.noreply.github.com>
Date: Wed, 19 Aug 2026 09:58:48 -0600
Subject: [PATCH] =?UTF-8?q?Keep=20the=20templates=20button=20on=20the=20Ru?=
 =?UTF-8?q?le=20stack=E2=80=99s=20Figma=20gap.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 app/components/sections/RuleStack/RuleStack.view.tsx | 2 --
 tests/unit/RuleStack.test.jsx                        | 3 ++-
 2 files changed, 2 insertions(+), 3 deletions(-)

diff --git a/app/components/sections/RuleStack/RuleStack.view.tsx b/app/components/sections/RuleStack/RuleStack.view.tsx
index 468d12b..154335d 100644
--- a/app/components/sections/RuleStack/RuleStack.view.tsx
+++ b/app/components/sections/RuleStack/RuleStack.view.tsx
@@ -23,11 +23,9 @@ export function RuleStackView({
         w-full bg-transparent flex flex-col
         px-[20px] py-[32px]
         min-[640px]:px-[32px] min-[640px]:py-[48px]
-        min-[768px]:py-[56px]
         min-[1024px]:px-[64px] min-[1024px]:py-[64px]
         min-[1440px]:px-[96px]
         gap-[24px]
-        min-[768px]:gap-[32px]
         min-[1024px]:gap-[40px]
         ${className}
       `}
diff --git a/tests/unit/RuleStack.test.jsx b/tests/unit/RuleStack.test.jsx
index e0930ba..8a1c8ac 100644
--- a/tests/unit/RuleStack.test.jsx
+++ b/tests/unit/RuleStack.test.jsx
@@ -189,8 +189,8 @@ describe("RuleStack Component", () => {
     expect(section?.className).toMatch(/min-\[640px\]:px-\[32px\]/);
     expect(section?.className).toMatch(/min-\[640px\]:py-\[48px\]/);
     expect(section?.className).toMatch(/gap-\[24px\]/);
-    expect(section?.className).toMatch(/min-\[768px\]:gap-\[32px\]/);
     expect(section?.className).toMatch(/min-\[1024px\]:gap-\[40px\]/);
+    expect(section?.className).not.toMatch(/min-\[768px\]:gap-\[32px\]/);
     expect(section?.className).not.toMatch(/min-\[640px\]:gap-\[32px\]/);
   });
 
@@ -279,6 +279,7 @@ describe("RuleStack Component", () => {
 
     const section = document.querySelector("section");
     expect(section?.className).toMatch(/min-\[640px\]:py-\[48px\]/);
+    expect(section?.className).not.toMatch(/min-\[768px\]:py-\[56px\]/);
     expect(section?.className).toMatch(/min-\[1024px\]:py-\[64px\]/);
   });