Files
twenty/packages/twenty-front/src/loading/components/UserOrMetadataLoader.tsx
2025-01-21 09:19:06 +01:00

33 lines
921 B
TypeScript

import styled from '@emotion/styled';
import { MOBILE_VIEWPORT } from 'twenty-ui';
import { NAV_DRAWER_WIDTHS } from '@/ui/navigation/navigation-drawer/constants/NavDrawerWidths';
import { LeftPanelSkeletonLoader } from '~/loading/components/LeftPanelSkeletonLoader';
import { RightPanelSkeletonLoader } from '~/loading/components/RightPanelSkeletonLoader';
const StyledContainer = styled.div`
background: ${({ theme }) => theme.background.noisy};
box-sizing: border-box;
display: flex;
flex-direction: row;
gap: 12px;
height: 100dvh;
min-width: ${NAV_DRAWER_WIDTHS.menu.desktop.expanded}px;
width: 100%;
padding: 12px 8px 12px 8px;
overflow: hidden;
@media (max-width: ${MOBILE_VIEWPORT}px) {
width: 100%;
}
`;
export const UserOrMetadataLoader = () => {
return (
<StyledContainer>
<LeftPanelSkeletonLoader />
<RightPanelSkeletonLoader />
</StyledContainer>
);
};