fix(electron): tab max width (#8507)

fix PD-1727
This commit is contained in:
pengx17
2024-10-16 08:32:27 +00:00
parent 6fe8100fb3
commit 72e1489c62
3 changed files with 10 additions and 7 deletions

View File

@@ -33,8 +33,6 @@ async function handleHttpRequest(request: Request) {
const pathname = url.pathname; const pathname = url.pathname;
const sameSite = url.host === new URL(CLOUD_BASE_URL).host; const sameSite = url.host === new URL(CLOUD_BASE_URL).host;
console.log('request', request.url);
const isStaticResource = sameSite && !isNetworkResource(pathname); const isStaticResource = sameSite && !isNetworkResource(pathname);
if (isStaticResource) { if (isStaticResource) {
return fetchLocalResource(request); return fetchLocalResource(request);

View File

@@ -19,6 +19,7 @@ import {
useService, useService,
useServiceOptional, useServiceOptional,
} from '@toeverything/infra'; } from '@toeverything/infra';
import { assignInlineVars } from '@vanilla-extract/dynamic';
import clsx from 'clsx'; import clsx from 'clsx';
import { partition } from 'lodash-es'; import { partition } from 'lodash-es';
import { import {
@@ -207,6 +208,12 @@ const WorkbenchTab = ({
data-active={tabActive} data-active={tabActive}
data-pinned={workbench.pinned} data-pinned={workbench.pinned}
className={styles.tab} className={styles.tab}
style={assignInlineVars({
[styles.tabMaxWidth]: `${Math.max(
workbench.views.length * 52,
workbench.pinned ? 64 : 200
)}px`,
})}
> >
{workbench.views.map((view, viewIdx) => { {workbench.views.map((view, viewIdx) => {
return ( return (

View File

@@ -4,6 +4,7 @@ import { createVar, style } from '@vanilla-extract/css';
export const tabOverlayWidth = createVar('0px'); export const tabOverlayWidth = createVar('0px');
export const tabButtonWidth = createVar('16px'); export const tabButtonWidth = createVar('16px');
export const tabMaxWidth = createVar('200px');
export const root = style({ export const root = style({
width: '100%', width: '100%',
@@ -79,7 +80,7 @@ export const tabWrapper = style({
export const tab = style({ export const tab = style({
height: 32, height: 32,
minWidth: 32, minWidth: 32,
maxWidth: 200, maxWidth: tabMaxWidth,
overflow: 'clip', overflow: 'clip',
background: cssVarV2('tab/tabBackground/default'), background: cssVarV2('tab/tabBackground/default'),
display: 'flex', display: 'flex',
@@ -97,9 +98,6 @@ export const tab = style({
'&[data-active="true"]': { '&[data-active="true"]': {
boxShadow: `0 0 0 1px ${cssVarV2('button/innerBlackBorder')}`, boxShadow: `0 0 0 1px ${cssVarV2('button/innerBlackBorder')}`,
}, },
'&[data-pinned="true"]': {
maxWidth: 64,
},
[`${tabWrapper}[data-dragging="true"] &`]: { [`${tabWrapper}[data-dragging="true"] &`]: {
boxShadow: `0 0 0 1px ${cssVar('primaryColor')}`, boxShadow: `0 0 0 1px ${cssVar('primaryColor')}`,
}, },
@@ -107,7 +105,7 @@ export const tab = style({
}); });
export const splitViewLabel = style({ export const splitViewLabel = style({
minWidth: 32, minWidth: 48,
padding: '0 8px', padding: '0 8px',
height: '100%', height: '100%',
display: 'flex', display: 'flex',