diff --git a/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/index.tsx b/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/index.tsx index cb21891ff6ccb..f7fdf8094cff8 100644 --- a/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/index.tsx +++ b/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/index.tsx @@ -6,7 +6,6 @@ import { recordTracksEvent } from 'calypso/lib/analytics/tracks'; import DIFMLanding from 'calypso/my-sites/marketing/do-it-for-me/difm-landing'; import type { Step } from '../../types'; -import './style.scss'; const STEP_NAME = 'difmStartingPoint'; const DIFMStartingPoint: Step = function ( { navigation } ) { const { goNext, goBack, submit } = navigation; diff --git a/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/style.scss b/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/style.scss deleted file mode 100644 index 03b549e95d7e2..0000000000000 --- a/client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/style.scss +++ /dev/null @@ -1,4 +0,0 @@ -.step-container.difmStartingPoint { - margin-top: 6vh; - max-width: 1224px; -} diff --git a/client/my-sites/marketing/do-it-for-me/difm-landing.scss b/client/my-sites/marketing/do-it-for-me/difm-landing.scss new file mode 100644 index 0000000000000..fdd154bc37f67 --- /dev/null +++ b/client/my-sites/marketing/do-it-for-me/difm-landing.scss @@ -0,0 +1,9 @@ +.difm-starting-point { + .step-container.difmStartingPoint { + margin-top: 4vh; + + .step-container__header { + padding-inline-end: 0; + } + } +} diff --git a/client/my-sites/marketing/do-it-for-me/difm-landing.tsx b/client/my-sites/marketing/do-it-for-me/difm-landing.tsx index a694abc1069f7..dfbdbf1815445 100644 --- a/client/my-sites/marketing/do-it-for-me/difm-landing.tsx +++ b/client/my-sites/marketing/do-it-for-me/difm-landing.tsx @@ -33,6 +33,8 @@ import { import { getSitePlan } from 'calypso/state/sites/selectors'; import type { TranslateResult } from 'i18n-calypso'; +import './difm-landing.scss'; + const Placeholder = styled.span` padding: 0 60px; animation: loading-fade 800ms ease-in-out infinite; @@ -55,12 +57,14 @@ const Placeholder = styled.span` const Wrapper = styled.div` display: flex; align-items: flex-start; - gap: 96px; padding: 12px; + max-width: 1040px; + margin: 0 auto; `; const ContentSection = styled.div` flex: 1; + padding-right: 10px; `; const ImageSection = styled.div` @@ -76,9 +80,14 @@ const ImageSection = styled.div` `; const Header = styled( FormattedHeader )` + margin: 0 0 24px 0 !important; .formatted-header__title { - font-size: 2.25rem; + font-size: 2.75rem; line-height: 3rem; + text-wrap: nowrap; + } + .formatted-header__subtitle { + font-size: 1rem; } `; @@ -189,6 +198,7 @@ const CTASectionWrapper = styled.div` const StepContainer = styled.div` display: flex; gap: 20px; + margin-top: 0; `; const ProgressLine = styled.div`