admin/twenty
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Fix 0.32 bis (#8346)

Browse Source 
Various UI fixes according to discussions with Design team
This commit is contained in:
Charles Bochet
2024-11-05 18:14:44 +01:00
committed by GitHub
parent 3793f6c451
commit 88ba057b2c
12 changed files with 50 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/twenty-front/src/modules/ui/layout/page/components/PageHeader.tsx
View File

@ -8,6 +8,7 @@ import {
IconChevronUp,
IconComponent,
IconX,
LightIconButton,
MOBILE_VIEWPORT,
OverflowingTextWithTooltip,
} from 'twenty-ui';
@ -119,10 +120,10 @@ export const PageHeader = ({
</StyledTopBarButtonContainer>
)}
{hasClosePageButton && (
<IconButton
<LightIconButton
Icon={IconX}
size="small"
variant="tertiary"
accent="tertiary"
onClick={() => onClosePage?.()}
/>
)}

2
packages/twenty-front/src/modules/ui/layout/top-bar/components/TopBar.tsx
View File

@ -12,6 +12,7 @@ type TopBarProps = {
const StyledContainer = styled.div`
border-bottom: ${({ theme }) => `1px solid ${theme.border.color.light}`};
display: flex;
margin-left: ${({ theme }) => theme.spacing(2)};
flex-direction: column;
`;
@ -27,7 +28,6 @@ const StyledTopBar = styled.div`
height: 39px;
justify-content: space-between;
padding-right: ${({ theme }) => theme.spacing(2)};
padding-left: ${({ theme }) => theme.spacing(2)};
z-index: 7;
`;

8
packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerCollapseButton.tsx
View File

@ -2,9 +2,9 @@ import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNaviga
import styled from '@emotion/styled';
import { useSetRecoilState } from 'recoil';
import {
IconButton,
IconLayoutSidebarLeftCollapse,
IconLayoutSidebarRightCollapse,
LightIconButton,
} from 'twenty-ui';
const StyledCollapseButton = styled.div`
@ -13,10 +13,8 @@ const StyledCollapseButton = styled.div`
color: ${({ theme }) => theme.font.color.light};
cursor: pointer;
display: flex;
height: ${({ theme }) => theme.spacing(4)};
justify-content: center;
user-select: none;
width: ${({ theme }) => theme.spacing(4)};
`;
type NavigationDrawerCollapseButtonProps = {
@ -41,13 +39,13 @@ export const NavigationDrawerCollapseButton = ({
)
}
>
<IconButton
<LightIconButton
Icon={
direction === 'left'
? IconLayoutSidebarLeftCollapse
: IconLayoutSidebarRightCollapse
}
variant="tertiary"
accent="tertiary"
size="small"
/>
</StyledCollapseButton>

2
packages/twenty-front/src/modules/ui/navigation/navigation-drawer/components/NavigationDrawerHeader.tsx
View File

@ -7,10 +7,10 @@ import { DEFAULT_WORKSPACE_LOGO } from '@/ui/navigation/navigation-drawer/consta
import { DEFAULT_WORKSPACE_NAME } from '@/ui/navigation/navigation-drawer/constants/DefaultWorkspaceName';
import { useIsMobile } from '@/ui/utilities/responsive/hooks/useIsMobile';
import { NavigationDrawerAnimatedCollapseWrapper } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerAnimatedCollapseWrapper';
import { isNavigationDrawerExpandedState } from '@/ui/navigation/states/isNavigationDrawerExpanded';
import { isNonEmptyString } from '@sniptt/guards';
import { NavigationDrawerCollapseButton } from './NavigationDrawerCollapseButton';
import { NavigationDrawerAnimatedCollapseWrapper } from '@/ui/navigation/navigation-drawer/components/NavigationDrawerAnimatedCollapseWrapper';
const StyledContainer = styled.div`
align-items: center;