From fdf9f543ae8c306ea814dfc068f9ece39f439eff Mon Sep 17 00:00:00 2001
From: Thomas des Francs <tdesfrancs@gmail.com>
Date: Fri, 26 Jun 2026 12:45:51 +0200
Subject: [PATCH] Fix rounded page layout tab edit outline (#22214)

## Summary
- Round the edited page layout tab outline to match the tab hover
radius.

## Test plan
- `npx oxfmt --check
packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx`
- `npx oxlint --type-aware -c packages/twenty-front/.oxlintrc.json
packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx`
- `npx nx run twenty-front:lint`
- Browser: verified the edited `Notes` tab outline before/after locally.

## Visual
<img width="1108" height="392" alt="clipboard"
src="https://github.com/user-attachments/assets/1cb63180-83a9-4ef8-9c55-2b475eaaa02b"
/>

<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/22214?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->
---
 .../page-layout/components/PageLayoutTabListReorderableTab.tsx   | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx
index 548c5bd951..095574c37e 100644
--- a/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx
+++ b/packages/twenty-front/src/modules/page-layout/components/PageLayoutTabListReorderableTab.tsx
@@ -16,6 +16,7 @@ type PageLayoutTabListReorderableTabProps = {
 };
 
 const StyledTabContentWrapper = styled.div<{ isBeingEdited: boolean }>`
+  border-radius: ${themeCssVariables.border.radius.sm};
   outline: ${({ isBeingEdited }) =>
     isBeingEdited ? `1px solid ${themeCssVariables.color.blue}` : 'none'};
   outline-offset: -1px;