diff --git a/sections/FeatureCloudsync/index.module.scss b/sections/FeatureCloudsync/index.module.scss index f89eea39..1f76ab0b 100644 --- a/sections/FeatureCloudsync/index.module.scss +++ b/sections/FeatureCloudsync/index.module.scss @@ -2,3 +2,16 @@ margin: 0 auto; text-align: center; } + +.title { + color: #fff; + font-weight: 900 !important; + line-height: 112px; + letter-spacing: 0.01em !important; +} + +.sub_title { + color: #fff; + font-weight: 500 !important; + letter-spacing: 0em !important; +} diff --git a/sections/FeatureCloudsync/index.tsx b/sections/FeatureCloudsync/index.tsx index c2482135..84a7a858 100644 --- a/sections/FeatureCloudsync/index.tsx +++ b/sections/FeatureCloudsync/index.tsx @@ -3,18 +3,36 @@ import React from 'react'; import updateBtnWithPhone from '../../images/update_btn_with_phone.svg'; // @ts-ignore import styles from './index.module.scss'; +// @ts-ignore +import home from '../../styles/Home.module.css'; import { featureCloudSyncContents } from './toolkit'; import { Text } from '../../components'; const FeatureCloudSync = () => { return ( <> - <div className={styles.container}> - <Text value={featureCloudSyncContents.title} /> + <div className={home.inner_container}> + <Text + variant="h1" + className={styles.title} + value={featureCloudSyncContents.title()} + /> </div> - <div className={styles.container} style={{ color: '#fff' }}> - <Text algin="left" value={featureCloudSyncContents.subTitleFirst} /> - <Text algin="left" value={featureCloudSyncContents.subTitleSeconde} /> + <div className={home.inner_container} style={{ color: '#fff' }}> + <Text + algin="left" + variant="h5" + className={styles.sub_title} + style={{ marginTop: '121px' }} + value={featureCloudSyncContents.subTitleFirst()} + /> + <Text + algin="left" + variant="h5" + className={styles.sub_title} + style={{ margin: '24px 0 79px 0x' }} + value={featureCloudSyncContents.subTitleSecond()} + /> </div> <div> <img src={updateBtnWithPhone} /> diff --git a/sections/FeatureCloudsync/toolkit.tsx b/sections/FeatureCloudsync/toolkit.tsx index 186923ec..9ee22d31 100644 --- a/sections/FeatureCloudsync/toolkit.tsx +++ b/sections/FeatureCloudsync/toolkit.tsx @@ -12,7 +12,7 @@ export const featureCloudSyncContents = { subTitleFirst: () => { return <>Your design is</>; }, - subTitleSeconde: () => { + subTitleSecond: () => { return ( <> “Micro-manage your contents.” <br /> diff --git a/sections/FeatureCodegen/index.module.scss b/sections/FeatureCodegen/index.module.scss index 645dfcbb..01bb1340 100644 --- a/sections/FeatureCodegen/index.module.scss +++ b/sections/FeatureCodegen/index.module.scss @@ -2,11 +2,22 @@ font-weight: 900 !important; color: #fff; font-size: 112px !important; + letter-spacing: 0.01em !important; + line-height: 100% !important; } .sub_title_box { color: #fff; - margin-top: 140px; + margin-top: 143px; + + + .sub_title_second { + margin-top: 14px; + font-size: 36px !important; + font-weight: 500 !important; + line-height: 49px !important; + letter-spacing: 0.01em !important; + } } .link { diff --git a/sections/FeatureCodegen/index.tsx b/sections/FeatureCodegen/index.tsx index 4829d236..aab7905b 100644 --- a/sections/FeatureCodegen/index.tsx +++ b/sections/FeatureCodegen/index.tsx @@ -5,33 +5,38 @@ import { featureCodegenContents } from './toolkit'; // @ts-ignore import styles from './index.module.scss'; +// @ts-ignore +import home from '../../styles/Home.module.css'; const FeatureCodegen = () => { return ( <> - <div> - <Text - className={styles.title} - algin="left" - value={featureCodegenContents.title()} - /> - </div> - <div className={styles.sub_title_box}> - <Text - algin="left" - variant="h5" - value={featureCodegenContents.subTitleFirst()} - /> - <Text - algin="left" - variant="h5" - value={featureCodegenContents.subTitleSeconde()} - /> - </div> - <div className={styles.link}> - <Link href="/" style={{ color: '#463F95' }}> - <Text algin="left" variant="h5" value="Learn more how it works" /> - </Link> + <div className={home.inner_container}> + <div> + <Text + className={styles.title} + algin="left" + value={featureCodegenContents.title()} + /> + </div> + <div className={styles.sub_title_box}> + <Text + algin="left" + variant="h5" + value={featureCodegenContents.subTitleFirst()} + /> + <Text + algin="left" + variant="h5" + className={styles.sub_title_second} + value={featureCodegenContents.subTitleSecond()} + /> + </div> + <div className={styles.link}> + <Link href="/" style={{ color: '#463F95' }}> + <Text algin="left" variant="h5" value="Learn more how it works" /> + </Link> + </div> </div> </> ); diff --git a/sections/FeatureCodegen/toolkit.tsx b/sections/FeatureCodegen/toolkit.tsx index da795f06..219abf84 100644 --- a/sections/FeatureCodegen/toolkit.tsx +++ b/sections/FeatureCodegen/toolkit.tsx @@ -2,21 +2,16 @@ const endTag = '< /.'; export const featureCodegenContents = { title: () => { - return ( - <> - Code is - your <br /> - prototype {endTag} - </> - ); + return <>Code is - your prototype {endTag}</>; }, subTitleFirst: () => { return <>Finally, the usable code exporter</>; }, - subTitleSeconde: () => { + subTitleSecond: () => { return ( <> readable, production ready code. no custom <br /> - implementaion. all in standard form. + implementation. all in standard form. </> ); }, diff --git a/sections/FeatureEngine/index.tsx b/sections/FeatureEngine/index.tsx index d8d6950d..9f232ea8 100644 --- a/sections/FeatureEngine/index.tsx +++ b/sections/FeatureEngine/index.tsx @@ -15,7 +15,7 @@ const FeatureEngine = () => { </div> <div className={styles.sub_title}> <Text value={featureEngineContents.subTitleFirst()} /> - <Text value={featureEngineContents.subTitleSeconde()} /> + <Text value={featureEngineContents.subTitleSecond()} /> </div> <div> <Link href="/" style={{ color: '#463F95' }}> diff --git a/sections/FeatureEngine/toolkit.tsx b/sections/FeatureEngine/toolkit.tsx index 8899fe46..295f9708 100644 --- a/sections/FeatureEngine/toolkit.tsx +++ b/sections/FeatureEngine/toolkit.tsx @@ -18,7 +18,7 @@ export const featureEngineContents = { </> ); }, - subTitleSeconde: () => { + subTitleSecond: () => { return ( <> With most advanced UI Context detection <br /> diff --git a/sections/index.ts b/sections/index.ts index 6ddf2ca1..5df1b484 100644 --- a/sections/index.ts +++ b/sections/index.ts @@ -1,10 +1,10 @@ import Header from './Header'; import Hero from './Hero'; import FeatureOverview from './FeatureOverview'; -import FeatureCloudSync from './FeatureCloudSync'; +import FeatureCloudSync from './FeatureCloudsync'; import FeatureCodegen from './FeatureCodegen'; import FeatureEngine from './FeatureEngine'; -import FeatureLint from './FeatureLint' +import FeatureLint from './FeatureLint'; export { Header, @@ -13,5 +13,5 @@ export { FeatureCloudSync, FeatureCodegen, FeatureEngine, - FeatureLint + FeatureLint, };