Tablist bottom margin fix (#10801)
### Bug The active tab bottom border appeared slightly above the TabList's light bottom border. ### Investigation - Initial fix: Adjusted margin-bottom to -1px in Tab component to align borders - This fix caused active bottom borders to disappear in tabs wrapped with ShowPageSubContainerTabListContainer - Found that ShowPageSubContainerTabListContainer was adding a redundant bottom border that overlapped with TabList's border ### Solution - Removed ShowPageSubContainerTabListContainer to eliminate the redundant border - Kept the -1px margin-bottom fix in Tab component - This ensures consistent border behavior across all TabList implementations
This commit is contained in:
@ -1,4 +1,3 @@
|
||||
import { ShowPageSubContainerTabListContainer } from '@/ui/layout/show-page/components/ShowPageSubContainerTabListContainer';
|
||||
import { SingleTabProps, TabList } from '@/ui/layout/tab/components/TabList';
|
||||
import { useTabList } from '@/ui/layout/tab/hooks/useTabList';
|
||||
import { useFlowOrThrow } from '@/workflow/hooks/useFlowOrThrow';
|
||||
@ -16,8 +15,9 @@ import styled from '@emotion/styled';
|
||||
import { isDefined } from 'twenty-shared';
|
||||
import { IconLogin2, IconLogout, IconStepInto } from 'twenty-ui';
|
||||
|
||||
const StyledTabListContainer = styled(ShowPageSubContainerTabListContainer)`
|
||||
const StyledTabList = styled(TabList)`
|
||||
background-color: ${({ theme }) => theme.background.secondary};
|
||||
padding-left: ${({ theme }) => theme.spacing(2)};
|
||||
`;
|
||||
|
||||
type TabId = 'node' | 'input' | 'output';
|
||||
@ -69,13 +69,11 @@ export const CommandMenuWorkflowRunViewStep = () => {
|
||||
<WorkflowStepContextProvider
|
||||
value={{ workflowVersionId: workflowRun.workflowVersionId }}
|
||||
>
|
||||
<StyledTabListContainer>
|
||||
<TabList
|
||||
tabListInstanceId={WORKFLOW_RUN_STEP_SIDE_PANEL_TAB_LIST_COMPONENT_ID}
|
||||
tabs={tabs}
|
||||
behaveAsLinks={false}
|
||||
/>
|
||||
</StyledTabListContainer>
|
||||
<StyledTabList
|
||||
tabListInstanceId={WORKFLOW_RUN_STEP_SIDE_PANEL_TAB_LIST_COMPONENT_ID}
|
||||
tabs={tabs}
|
||||
behaveAsLinks={false}
|
||||
/>
|
||||
|
||||
{activeTabId === 'node' ? (
|
||||
<WorkflowStepDetail
|
||||
|
||||
Reference in New Issue
Block a user