fix(electron): adjust app-tabs-header styles (#7849)

toeverything · Aug 13, 2024 · d4065fe · d4065fe
1 parent d86f7f4
commit d4065fe
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 3 deletions.
diff --git a/packages/frontend/core/src/modules/app-tabs-header/views/app-tabs-header.tsx b/packages/frontend/core/src/modules/app-tabs-header/views/app-tabs-header.tsx
@@ -208,6 +208,7 @@ const WorkbenchTab = ({
         data-testid="workbench-tab"
         data-active={tabActive}
         data-pinned={workbench.pinned}
+        data-padding-right={tabsLength > 1 && !workbench.pinned}
         className={styles.tab}
       >
         {workbench.views.map((view, viewIdx) => {

diff --git a/packages/frontend/core/src/modules/app-tabs-header/views/styles.css.ts b/packages/frontend/core/src/modules/app-tabs-header/views/styles.css.ts
@@ -75,6 +75,7 @@ export const tabWrapper = style({
 export const tab = style({
   height: 32,
   minWidth: 32,
+  maxWidth: 200,
   overflow: 'clip',
   background: cssVar('backgroundSecondaryColor'),
   display: 'flex',
@@ -93,7 +94,7 @@ export const tab = style({
       background: cssVar('backgroundPrimaryColor'),
       boxShadow: cssVar('shadow1'),
     },
-    '&[data-pinned="false"]': {
+    '&[data-padding-right="true"]': {
       paddingRight: 20,
     },
     '&[data-pinned="true"]': {
@@ -113,7 +114,6 @@ export const splitViewLabel = style({
   gap: '4px',
   fontWeight: 500,
   alignItems: 'center',
-  maxWidth: 180,
   cursor: 'default',
   ':last-of-type': {
     paddingRight: 0,
@@ -172,7 +172,7 @@ export const tabCloseButtonWrapper = style({
   top: 0,
   bottom: 0,
   height: '100%',
-  width: 16,
+  width: 24,
   overflow: 'clip',
   display: 'flex',
   alignItems: 'center',