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

Marketing website POC (#3139)

Browse Source 
First website POC
This commit is contained in:
Félix Malfait
2023-12-23 10:08:55 +01:00
committed by GitHub
parent 68a6250757
commit 5ef5bbdc4d
28 changed files with 6279 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

106
packages/twenty-website/src/app/components/FooterNav.tsx Normal file
View File

@ -0,0 +1,106 @@
'use client'
import styled from '@emotion/styled'
import { Logo } from './Logo';
import { DiscordIcon, GithubIcon, LinkedInIcon, XIcon } from "./Icons";
const FooterContainer = styled.div`
padding: 64px 96px 64px 96px;
display: flex;
flex-direction: column;
color: rgb(129, 129, 129);
gap: 32px;
`;
const LeftSideFooter = styled.div`
width: 36Opx;
display: flex;
flex-direction: column;
gap: 16px;`;
const RightSideFooter = styled.div`
display: flex;
justify-content: space-between;`;
const RightSideFooterColumn = styled.div`
width: 160px;
display: flex;
flex-direction: column;
gap: 8px;
`;
const RightSideFooterLink = styled.a`
color: rgb(129, 129, 129);
text-decoration: none;
&:hover {
text-decoration: underline;
color: #000;
}`;
const RightSideFooterColumnTitle = styled.div`
font-size: 20px;
font-weight: 500;
color: #000;
`;
export const FooterNav = () => {
return <FooterContainer>
<div style={{ width: '100%', display: 'flex', flexDirection: 'row', justifyContent:'space-between'}}>
<LeftSideFooter>
<Logo />
<div>
The #1 Open Source CRM
</div>
</LeftSideFooter>
<RightSideFooter>
<RightSideFooterColumn>
<RightSideFooterColumnTitle>Company</RightSideFooterColumnTitle>
<RightSideFooterLink href='/'>Pricing</RightSideFooterLink>
<RightSideFooterLink href='/'>Story</RightSideFooterLink>
</RightSideFooterColumn>
<RightSideFooterColumn>
<RightSideFooterColumnTitle>Resources</RightSideFooterColumnTitle>
<RightSideFooterLink href='https://docs.twenty.com'>Documentation</RightSideFooterLink>
<RightSideFooterLink href='/releases'>Changelog</RightSideFooterLink>
</RightSideFooterColumn>
<RightSideFooterColumn>
<RightSideFooterColumnTitle>Other</RightSideFooterColumnTitle>
<RightSideFooterLink href='/oss-friends'>OSS Friends</RightSideFooterLink>
<RightSideFooterLink href='/legal/terms'>Terms of Service</RightSideFooterLink>
<RightSideFooterLink href='/legal/privacy'>Privacy Policy</RightSideFooterLink>
</RightSideFooterColumn>
</RightSideFooter>
</div>
<div style={{
width: '100%',
display: 'flex',
flexDirection: 'row',
justifyContent:'space-between',
borderTop: '1px solid rgb(179, 179, 179)',
paddingTop: '32px'
}}>
<div>
<span style={{fontFamily: "Inter, sans-serif"}}>©</span>
2023 Twenty PBC
</div>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent:'space-between', gap:'10px'}}>
<a href="https://x.com/twentycrm" target="_blank">
<XIcon size='M'/>
</a>
<a href="https://github.com/twentyhq/twenty" target="_blank">
<GithubIcon size='M'/>
</a>
<a href="https://www.linkedin.com/company/twenty" target="_blank">
<LinkedInIcon size='M'/>
</a>
<a href="https://discord.gg/UfGNZJfAG6" target="_blank">
<DiscordIcon size='M' />
</a>
</div>
</div>
</FooterContainer>
;
}