twentyhq/twenty
1
1
Fork 0
mirror of https://github.com/twentyhq/twenty.git synced 2024-12-26 13:31:45 +03:00
Code Issues Packages Projects Releases Wiki Activity

Tab design improvements (#7307)

Browse Source 
## What does this PR do?
Improve minimize tab design. 

Fixes #7150 

<img width="329" alt="Screenshot 2024-09-28 at 11 46 35 AM"
src="https://github.com/user-attachments/assets/84eb058f-845f-4866-8428-ed0c1df619a8">

---------

Co-authored-by: Félix Malfait <felix@twenty.com>
This commit is contained in:
Arafat Hossain 2024-10-05 15:39:12 +06:00 committed by GitHub
parent 16f2033170
commit 4d67787fa2
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/twenty-front/src/modules/ui/layout/right-drawer/components/RightDrawer.tsx
View File

@ -28,10 +28,18 @@ import { RightDrawerHotkeyScope } from '../types/RightDrawerHotkeyScope';
import { emitRightDrawerCloseEvent } from '@/ui/layout/right-drawer/utils/emitRightDrawerCloseEvent';
import { RightDrawerRouter } from './RightDrawerRouter';
const StyledContainer = styled(motion.div)`
const StyledContainer = styled(motion.div)<{ isRightDrawerMinimized: boolean }>`
background: ${({ theme }) => theme.background.primary};
border-left: 1px solid ${({ theme }) => theme.border.color.medium};
box-shadow: ${({ theme }) => theme.boxShadow.strong};
border-left: ${({ theme, isRightDrawerMinimized }) =>
isRightDrawerMinimized
? `1px solid ${theme.border.color.strong}`
: `1px solid ${theme.border.color.medium}`};
border-top: ${({ theme, isRightDrawerMinimized }) =>
isRightDrawerMinimized ? `1px solid ${theme.border.color.strong}` : 'none'};
border-top-left-radius: ${({ theme, isRightDrawerMinimized }) =>
isRightDrawerMinimized ? theme.border.radius.md : '0'};
box-shadow: ${({ theme, isRightDrawerMinimized }) =>
isRightDrawerMinimized ? 'none' : theme.boxShadow.light};
height: 100dvh;
overflow-x: hidden;
position: fixed;
@ -157,6 +165,7 @@ export const RightDrawer = () => {
return (
<StyledContainer
isRightDrawerMinimized={isRightDrawerMinimized}
animate={targetVariantForAnimation}
variants={animationVariants}
transition={{

2
packages/twenty-ui/src/display/tooltip/OverflowingTextWithTooltip.tsx
View File

@ -1,6 +1,6 @@
import { styled } from '@linaria/react';
import { useRef, useState } from 'react';
import { createPortal } from 'react-dom';
import { styled } from '@linaria/react';
import { THEME_COMMON } from '@ui/theme';