diff --git a/packages/app/src/components/contact-modal/index.tsx b/packages/app/src/components/contact-modal/index.tsx
index cae11c7e79..96110f2a2a 100644
--- a/packages/app/src/components/contact-modal/index.tsx
+++ b/packages/app/src/components/contact-modal/index.tsx
@@ -60,9 +60,9 @@ const rightLinkList = [
},
{
icon: ,
- title: 'Check Our Docs',
- subTitle: 'docs.AFFiNE.pro',
- link: 'https://docs.affine.pro',
+ title: 'AFFiNE Community',
+ subTitle: 'community.affine.pro',
+ link: 'https://community.affine.pro',
},
];
@@ -109,10 +109,7 @@ export const ContactModal = ({ open, onClose }: TransitionsModalProps) => {
})}
-
- Get in touch!
- Join our community.
-
+ Get in touch!
{linkList.map(({ icon, title, link }) => {
return (
diff --git a/packages/app/src/components/contact-modal/style.ts b/packages/app/src/components/contact-modal/style.ts
index e0954a194d..f1188359f2 100644
--- a/packages/app/src/components/contact-modal/style.ts
+++ b/packages/app/src/components/contact-modal/style.ts
@@ -2,10 +2,10 @@ import { absoluteCenter, displayFlex, styled } from '@/styles';
export const StyledBigLink = styled('a')(({ theme }) => {
return {
- width: '320px',
+ width: '334px',
height: '100px',
marginBottom: '48px',
- paddingLeft: '114px',
+ paddingLeft: '90px',
fontSize: '24px',
lineHeight: '36px',
fontWeight: '600',
@@ -29,7 +29,7 @@ export const StyledBigLink = styled('a')(({ theme }) => {
height: '50px',
marginRight: '40px',
color: theme.colors.primaryColor,
- ...absoluteCenter({ vertical: true, position: { left: '32px' } }),
+ ...absoluteCenter({ vertical: true, position: { left: '20px' } }),
},
p: {
width: '100%',
@@ -85,6 +85,7 @@ export const StyledSmallLink = styled('a')(({ theme }) => {
});
export const StyledSubTitle = styled('div')(({ theme }) => {
return {
+ width: '190px',
fontSize: '18px',
fontWeight: '600',
color: theme.colors.textColor,