Files
twenty_crm/packages/twenty-front/src/pages/not-found/NotFound.tsx
gitstart-app[bot] 0a28c15747 Migrate to twenty-ui - input/button (#7994)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7529](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7529).

 --- 

### Description

- Migrated all button components to `twenty-ui`    \
  \
  `Button`\
  `ButtonGroup`\
  `ColorPickerButton`\
  `FloatingButton`\
  `FloatingButtonGroup`\
  `FloatingIconButton`\
  `FloatingIconButtonGroup`\
  `IconButton`\
  `IconButtonGroup`\
  `LightButton`\
  `LightIconButton`\
  `LightIconButtonGroup`\
  `MainButton`\
  \
  Fixes twentyhq/private-issues#89

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: Charles Bochet <charles@twenty.com>
2024-10-24 13:20:02 +02:00

61 lines
1.8 KiB
TypeScript

import { SignInBackgroundMockPage } from '@/sign-in-background-mock/components/SignInBackgroundMockPage';
import { AppPath } from '@/types/AppPath';
import { PageTitle } from '@/ui/utilities/page-title/components/PageTitle';
import styled from '@emotion/styled';
import {
AnimatedPlaceholder,
AnimatedPlaceholderEmptyTextContainer,
AnimatedPlaceholderErrorContainer,
AnimatedPlaceholderErrorSubTitle,
AnimatedPlaceholderErrorTitle,
MainButton,
UndecoratedLink,
} from 'twenty-ui';
const StyledBackDrop = styled.div`
align-items: center;
backdrop-filter: ${({ theme }) => theme.blur.light};
background: ${({ theme }) => theme.background.transparent.secondary};
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
left: 0;
position: fixed;
top: 0;
width: 100%;
z-index: 10000;
`;
const StyledButtonContainer = styled.div`
width: 200px;
`;
export const NotFound = () => {
return (
<>
<PageTitle title="Page Not Found | Twenty" />
<StyledBackDrop>
<AnimatedPlaceholderErrorContainer>
<AnimatedPlaceholder type="error404" />
<AnimatedPlaceholderEmptyTextContainer>
<AnimatedPlaceholderErrorTitle>
Off the beaten path
</AnimatedPlaceholderErrorTitle>
<AnimatedPlaceholderErrorSubTitle>
The page you're seeking is either gone or never was. Let's get you
back on track
</AnimatedPlaceholderErrorSubTitle>
</AnimatedPlaceholderEmptyTextContainer>
<StyledButtonContainer>
<UndecoratedLink to={AppPath.Index}>
<MainButton title="Back to content" fullWidth />
</UndecoratedLink>
</StyledButtonContainer>
</AnimatedPlaceholderErrorContainer>
</StyledBackDrop>
<SignInBackgroundMockPage />
</>
);
};