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

Update Mobile Navigation bar css for better usage (#6209)

Browse Source 
Closes #5744 
## Description
- Made Navigation Bar fixed in Mobile screens.
- Added `margin-bottom` so, last entries doesn't get hidden.

<img width="340" alt="Screenshot 2024-07-10 at 11 58 50 PM"
src="https://github.com/twentyhq/twenty/assets/91935072/a888fe06-77bf-4368-ac6d-a5d41d591bd0">
<img width="290" alt="Screenshot 2024-07-10 at 11 59 06 PM"
src="https://github.com/twentyhq/twenty/assets/91935072/c1d0c6ed-9178-4132-8b49-7ed39caf3d10">

---------

Co-authored-by: Félix Malfait <felix.malfait@gmail.com>
This commit is contained in:
Dhruv
2024-07-11 11:45:49 +05:30
committed by GitHub
parent 9917fb0f9e
commit 45fe537055
6 changed files with 11 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/twenty-front/src/loading/components/LeftPanelSkeletonLoader.tsx
View File

@ -1,6 +1,6 @@
import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
import styled from '@emotion/styled';
import { motion } from 'framer-motion';
import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
import { ANIMATION, BACKGROUND_LIGHT, GRAY_SCALE } from 'twenty-ui';
import { DESKTOP_NAV_DRAWER_WIDTHS } from '@/ui/navigation/navigation-drawer/constants/DesktopNavDrawerWidths';
@ -18,7 +18,7 @@ const StyledItemsContainer = styled.div`
gap: 32px;
margin-bottom: auto;
overflow-y: auto;
height: calc(100vh - 32px);
height: calc(100dvh - 32px);
min-width: 216px;
max-width: 216px;
`;

2
packages/twenty-front/src/loading/components/UserOrMetadataLoader.tsx
View File

@ -11,7 +11,7 @@ const StyledContainer = styled.div`
display: flex;
flex-direction: row;
gap: 12px;
height: 100vh;
height: 100dvh;
min-width: ${DESKTOP_NAV_DRAWER_WIDTHS.menu}px;
width: 100%;
padding: 12px 8px 12px;