diff --git a/src/OnboardingSPA/components/LivePreview/SiteGenCard/index.js b/src/OnboardingSPA/components/LivePreview/SiteGenCard/index.js index 0e939e21c..036d81d70 100644 --- a/src/OnboardingSPA/components/LivePreview/SiteGenCard/index.js +++ b/src/OnboardingSPA/components/LivePreview/SiteGenCard/index.js @@ -1,4 +1,6 @@ import { Icon, search } from '@wordpress/icons'; +import { __ } from '@wordpress/i18n'; + import { LivePreview } from '..'; const LivePreviewSiteGenCard = ( { @@ -15,7 +17,7 @@ const LivePreviewSiteGenCard = ( { onRegenerate, onPreview, } ) => { - const handleFavorite = ( slug ) => { + const handleFavorite = () => { if ( typeof onFavorite === 'function' ) { return onFavorite( slug ); } @@ -23,7 +25,7 @@ const LivePreviewSiteGenCard = ( { return false; }; - const handleRegenerate = ( slug ) => { + const handleRegenerate = () => { if ( typeof onRegenerate === 'function' ) { return onRegenerate( slug ); } @@ -50,7 +52,10 @@ const LivePreviewSiteGenCard = ( { />
handlePreview( slug ) } + onKeyDown={ () => handlePreview( slug ) } >
- Preview + { __( 'Preview', 'wp-module-onboarding' ) }

@@ -74,7 +79,10 @@ const LivePreviewSiteGenCard = ( { isFavorite && `${ className }__buttons__favorite__icon__fill` }` } - onClick={ () => handleFavorite( slug ) } + role="button" + tabIndex={ 0 } + onClick={ () => handleFavorite() } + onKeyDown={ () => handleFavorite() } />
handleRegenerate( slug ) } + role="button" + tabIndex={ 0 } + onClick={ () => handleRegenerate() } + onKeyDown={ () => handleRegenerate() } >
- Regenerate + { __( 'Regenerate', 'wp-module-onboarding' ) }
diff --git a/src/OnboardingSPA/components/LivePreview/SiteGenCard/stylesheet.scss b/src/OnboardingSPA/components/LivePreview/SiteGenCard/stylesheet.scss index ea08d7566..35e158b08 100644 --- a/src/OnboardingSPA/components/LivePreview/SiteGenCard/stylesheet.scss +++ b/src/OnboardingSPA/components/LivePreview/SiteGenCard/stylesheet.scss @@ -1,117 +1,123 @@ .nfd-onboarding-live-preview { - &--sitegen-card { - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - width: 100%; - &__live-preview-container { - position: relative; - width: 90%; - overflow: hidden; - align-items: center; - border-radius: 8px; - - &:hover { - cursor: pointer; - } - - &__overlay { - position: absolute; - top: 0; - bottom: 0; - left: 0; - right: 0; - height: 100%; - z-index: 2; - width: 100%; - opacity: 0; - transition: 0.5s ease; - background-color: rgba(0,0,0, 1); - display: flex; - align-items: center; - justify-content: center; - - &__preview-button { - display: flex; - justify-content: center; - align-items: center; - width: 250px; - height: 30px; - z-index: 9999; - border-radius: 12px; - background-color: var(--nfd-onboarding-primary); - opacity: 1; - &__icon { - fill: var(--nfd-onboarding-secondary); - font-size: 20px; - height: 20px; - width: 20px; - text-align: center; - } - } - - &:hover { - cursor: pointer; - opacity: 0.74; - } - } - - .live-preview { - - &__container { - - &-custom { - width: 100%; - overflow: hidden; - height: 300px; - } - } - } - - } - - &__buttons { - width: 90%; - color: var(--nfd-onboarding-primary); - display: flex; - flex-direction: row; - justify-content: space-between; - align-items: center; - padding: 16px; - &__favorite { - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - &__icon { - width: 20px; - height: 21px; - margin-right: 12px; - cursor: pointer; - background-image: var(--sitegen-favorite); - - &__fill { - background-image: var(--sitegen-favorite-filled); - } - - } - - } - - &__regenerate { - display: flex; - flex-direction: row; - justify-content: center; - align-items: center; - cursor: pointer; - &__icon { - background-image: var(--sitegen-regenerate); - width: 16px; - height: 18px; - margin-right: 12px; - } - } - } - } -} \ No newline at end of file + + &--sitegen-card { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + width: 100%; + + &__live-preview-container { + position: relative; + width: 90%; + overflow: hidden; + align-items: center; + border-radius: 8px; + + &:hover { + cursor: pointer; + } + + &__overlay { + position: absolute; + top: 0; + bottom: 0; + left: 0; + right: 0; + height: 100%; + z-index: 2; + width: 100%; + opacity: 0; + transition: 0.5s ease; + background-color: rgba(0, 0, 0, 1); + display: flex; + align-items: center; + justify-content: center; + + &__preview-button { + display: flex; + justify-content: center; + align-items: center; + width: 250px; + height: 30px; + z-index: 9999; + border-radius: 12px; + background-color: var(--nfd-onboarding-primary); + opacity: 1; + + &__icon { + fill: var(--nfd-onboarding-secondary); + font-size: 20px; + height: 20px; + width: 20px; + text-align: center; + } + } + + &:hover { + cursor: pointer; + opacity: 0.74; + } + } + + .live-preview { + + &__container { + + &-custom { + width: 100%; + overflow: hidden; + height: 300px; + } + } + } + + } + + &__buttons { + width: 90%; + color: var(--nfd-onboarding-primary); + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + padding: 16px; + + &__favorite { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + + &__icon { + width: 20px; + height: 21px; + margin-right: 12px; + cursor: pointer; + background-image: var(--sitegen-favorite); + + &__fill { + background-image: var(--sitegen-favorite-filled); + } + + } + + } + + &__regenerate { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + cursor: pointer; + + &__icon { + background-image: var(--sitegen-regenerate); + width: 16px; + height: 18px; + margin-right: 12px; + } + } + } + } +} diff --git a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js index 557825e35..61787425d 100644 --- a/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js +++ b/src/OnboardingSPA/components/NewfoldInterfaceSkeleton/SiteGen/index.js @@ -16,7 +16,6 @@ import { getSiteGenIdentifiers, } from '../../../utils/api/siteGen'; import Footer from '../../Footer'; -import { stepSiteGenEditor } from '../../../steps/SiteGen/Editor/step'; // Wrapping the NewfoldInterfaceSkeleton with the HOC to make theme available const ThemedNewfoldInterfaceSkeleton = themeToggleHOC( @@ -26,10 +25,9 @@ const ThemedNewfoldInterfaceSkeleton = themeToggleHOC( ); const SiteGen = () => { - const { newfoldBrand, currentStep } = useSelect( ( select ) => { + const { newfoldBrand } = useSelect( ( select ) => { return { newfoldBrand: select( nfdOnboardingStore ).getNewfoldBrand(), - currentStep: select( nfdOnboardingStore ).getCurrentStep(), }; }, [] ); diff --git a/src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/Sidebar.js b/src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/Sidebar.js index 9535bcce0..68db7bcae 100644 --- a/src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/Sidebar.js +++ b/src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/Sidebar.js @@ -23,12 +23,14 @@ const SitegenEditorPatternsSidebar = () => { setIsSidebarOpened( false ); }; return ( - + - }> + }> diff --git a/src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/stylesheet.scss b/src/OnboardingSPA/components/Sidebar/components/SitegenEditorPatterns/stylesheet.scss deleted file mode 100644 index e69de29bb..000000000 diff --git a/src/OnboardingSPA/data/sitegen/homepages/homepages.js b/src/OnboardingSPA/data/sitegen/homepages/homepages.js index 34f9ab1e9..7a7454c11 100644 --- a/src/OnboardingSPA/data/sitegen/homepages/homepages.js +++ b/src/OnboardingSPA/data/sitegen/homepages/homepages.js @@ -1,25 +1,22 @@ -import {getRandomColorPalette} from '../sitemeta/siteMeta'; +import { getRandomColorPalette } from '../sitemeta/siteMeta'; import one from './1.json'; import two from './2.json'; import three from './3.json'; import four from './4.json'; const getHomepages = () => { - return [one, two, three]; -} + return [ one, two, three ]; +}; const getRandom = ( homepage ) => { - console.log('homepage', homepage); - if ( homepage?.favorite ) { - homepage.slug = homepage.slug + '-copy' - homepage.title = homepage.title + ' Copy' - homepage.favorite = false; - homepage.color = getRandomColorPalette( homepage?.color?.slug ); - return homepage; - } - four.color = getRandomColorPalette( homepage?.color?.slug ); - return four; + if ( homepage?.favorite ) { + homepage.slug = homepage.slug + '-copy'; + homepage.title = homepage.title + ' Copy'; + homepage.favorite = false; + homepage.color = getRandomColorPalette( homepage?.color?.slug ); + return homepage; + } + four.color = getRandomColorPalette( homepage?.color?.slug ); + return four; +}; - -} - -export { getHomepages, getRandom }; \ No newline at end of file +export { getHomepages, getRandom }; diff --git a/src/OnboardingSPA/data/sitegen/sitemeta/siteMeta.js b/src/OnboardingSPA/data/sitegen/sitemeta/siteMeta.js index 83156a301..a8198761b 100644 --- a/src/OnboardingSPA/data/sitegen/sitemeta/siteMeta.js +++ b/src/OnboardingSPA/data/sitegen/sitemeta/siteMeta.js @@ -1,39 +1,39 @@ import siteMeta from './siteMeta.json'; const getSiteMeta = () => { - return siteMeta; -} + return siteMeta; +}; const getColorPalettes = () => { - let colorPalettes = {}; - Object.keys( siteMeta.colorpalette ).forEach((colorPalette) => { - colorPalettes[colorPalette] = Object.keys(siteMeta.colorpalette[colorPalette]).map(( slug ) => { - return { - slug, - title: slug[0].toUpperCase() + slug.slice(1), - color: siteMeta.colorpalette[colorPalette][slug] - } - }) - }) + const colorPalettes = {}; + Object.keys( siteMeta.colorpalette ).forEach( ( colorPalette ) => { + colorPalettes[ colorPalette ] = Object.keys( + siteMeta.colorpalette[ colorPalette ] + ).map( ( slug ) => { + return { + slug, + title: slug[ 0 ].toUpperCase() + slug.slice( 1 ), + color: siteMeta.colorpalette[ colorPalette ][ slug ], + }; + } ); + } ); - return colorPalettes; -} + return colorPalettes; +}; const getRandomColorPalette = ( activeColorPaletteSlug ) => { - const colorPalettes = getColorPalettes(); - console.log(colorPalettes) - let keys = Object.keys( colorPalettes ); - if ( activeColorPaletteSlug ) { - keys = keys.filter(( key ) => { - return key != activeColorPaletteSlug - }) - } + const colorPalettes = getColorPalettes(); + let keys = Object.keys( colorPalettes ); + if ( activeColorPaletteSlug ) { + keys = keys.filter( ( key ) => { + return key !== activeColorPaletteSlug; + } ); + } - const rand = Math.floor( Math.random() * keys.length ); - console.log(rand) - return { - slug: keys[2], - palette: colorPalettes[ keys[ 2 ] ] - } -} + const rand = Math.floor( Math.random() * keys.length ); + return { + slug: keys[ rand ], + palette: colorPalettes[ keys[ rand ] ], + }; +}; -export {getSiteMeta, getColorPalettes, getRandomColorPalette}; \ No newline at end of file +export { getSiteMeta, getColorPalettes, getRandomColorPalette }; diff --git a/src/OnboardingSPA/steps/SiteGen/Editor/Header/index.js b/src/OnboardingSPA/steps/SiteGen/Editor/Header/index.js index 6f55d84fe..1bbef3883 100644 --- a/src/OnboardingSPA/steps/SiteGen/Editor/Header/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Editor/Header/index.js @@ -1,3 +1,4 @@ +import { __ } from '@wordpress/i18n'; import { Fill, Dropdown } from '@wordpress/components'; import { HEADER_CENTER, @@ -5,7 +6,7 @@ import { HEADER_SITEGEN, HEADER_START, } from '../../../../../constants'; -import { Icon, chevronDown, chevronRight, home } from '@wordpress/icons'; +import { Icon, chevronDown, chevronRight } from '@wordpress/icons'; import { store as nfdOnboardingStore } from '../../../../store'; import { useSelect, useDispatch } from '@wordpress/data'; @@ -51,7 +52,10 @@ const StepSiteGenEditorHeader = () => {
handleRegenerate() } + onKeyDown={ () => handleRegenerate() } >
{
- Regenerate + { __( 'Regenerate', 'wp-module-onboarding' ) }
@@ -70,18 +74,24 @@ const StepSiteGenEditorHeader = () => {
{ + renderToggle={ ( { onToggle } ) => { return ( <> -

+ >

@@ -98,10 +108,16 @@ const StepSiteGenEditorHeader = () => { renderContent={ () => (

- Rename + { __( + 'Rename', + 'wp-module-onboarding' + ) }

- View All + { __( + 'View All', + 'wp-module-onboarding' + ) }

) } @@ -114,15 +130,19 @@ const StepSiteGenEditorHeader = () => {
- Customize + Customize{ ' ' } + { __( 'Customize', 'wp-module-onboarding' ) }
- Save & Continue + { __( 'Save & Continue', 'wp-module-onboarding' ) }
{ - const { setSidebarActiveView } = useDispatch( nfdOnboardingStore ) + const { setSidebarActiveView } = useDispatch( nfdOnboardingStore ); - useEffect(() => { - setSidebarActiveView( SIDEBAR_SITEGEN_EDITOR_PATTERNS ); - }, []) - return
Hello World
-} + useEffect( () => { + setSidebarActiveView( SIDEBAR_SITEGEN_EDITOR_PATTERNS ); + }, [] ); + return
Hello World
; +}; -export default Patterns; \ No newline at end of file +export default Patterns; diff --git a/src/OnboardingSPA/steps/SiteGen/Editor/index.js b/src/OnboardingSPA/steps/SiteGen/Editor/index.js index 04d91cb2d..dfdf24371 100644 --- a/src/OnboardingSPA/steps/SiteGen/Editor/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Editor/index.js @@ -9,6 +9,7 @@ import { HEADER_SITEGEN } from '../../../../constants'; import { LivePreview } from '../../../components/LivePreview'; import { getGlobalStyles } from '../../../utils/api/themes'; +// eslint-disable-next-line import/no-extraneous-dependencies import { cloneDeep } from 'lodash'; const StepSiteGenEditor = () => { @@ -37,8 +38,8 @@ const StepSiteGenEditor = () => { setDrawerActiveView( false ); const homepage = currentData.sitegen.homepages.active; setActiveHomepage( homepage ); - const globalStyles = await getGlobalStyles(); - setGlobalStyles( globalStyles.body ); + const globalStylesResponse = await getGlobalStyles(); + setGlobalStyles( globalStylesResponse.body ); setColorPalette( homepage.color.palette ); }; diff --git a/src/OnboardingSPA/steps/SiteGen/Editor/stylesheet.scss b/src/OnboardingSPA/steps/SiteGen/Editor/stylesheet.scss index 62cb84662..421df366b 100644 --- a/src/OnboardingSPA/steps/SiteGen/Editor/stylesheet.scss +++ b/src/OnboardingSPA/steps/SiteGen/Editor/stylesheet.scss @@ -1,16 +1,20 @@ .nfd-onboarding-step { - &--site-gen { - &__editor { - &__live-preview { - height: 100%; - width: 100%; - } - .live-preview { - &-custom { - width: 100%; - } - } - } - } -} \ No newline at end of file + &--site-gen { + + &__editor { + + &__live-preview { + height: 100%; + width: 100%; + } + + .live-preview { + + &-custom { + width: 100%; + } + } + } + } +} diff --git a/src/OnboardingSPA/steps/SiteGen/Preview/contents.js b/src/OnboardingSPA/steps/SiteGen/Preview/contents.js index eb0550058..d35c4b3de 100644 --- a/src/OnboardingSPA/steps/SiteGen/Preview/contents.js +++ b/src/OnboardingSPA/steps/SiteGen/Preview/contents.js @@ -1,11 +1,17 @@ import { __ } from '@wordpress/i18n'; const getContents = () => { - return { - heading: __('Presto, here are 3 versions', 'wp-module-onboarding'), - subheading: __("We've created 3 unique website designs for you to start with, preview click around or start over.", 'wp-module-onboarding'), - favoriteInfo: __('Favorite a generated version to find and use again in the future.', 'wp-module-onboarding'), - } -} + return { + heading: __( 'Presto, here are 3 versions', 'wp-module-onboarding' ), + subheading: __( + "We've created 3 unique website designs for you to start with, preview click around or start over.", + 'wp-module-onboarding' + ), + favoriteInfo: __( + 'Favorite a generated version to find and use again in the future.', + 'wp-module-onboarding' + ), + }; +}; -export default getContents \ No newline at end of file +export default getContents; diff --git a/src/OnboardingSPA/steps/SiteGen/Preview/index.js b/src/OnboardingSPA/steps/SiteGen/Preview/index.js index 0fdea5b0b..dac077d03 100644 --- a/src/OnboardingSPA/steps/SiteGen/Preview/index.js +++ b/src/OnboardingSPA/steps/SiteGen/Preview/index.js @@ -18,6 +18,7 @@ import { import { getColorPalettes } from '../../../data/sitegen/sitemeta/siteMeta'; import { getGlobalStyles } from '../../../utils/api/themes'; +// eslint-disable-next-line import/no-extraneous-dependencies import { isEmpty, cloneDeep } from 'lodash'; import Grid from '../../../components/Grid'; @@ -69,8 +70,8 @@ const SiteGenPreview = () => { } else { homepagesObject = currentData.sitegen.homepages.data; } - const globalStyles = await getGlobalStyles(); - setGlobalStyles( globalStyles.body ); + const globalStylesResponse = await getGlobalStyles(); + setGlobalStyles( globalStylesResponse.body ); setHomepages( homepagesObject ); }; diff --git a/src/OnboardingSPA/steps/SiteGen/Preview/stylesheet.scss b/src/OnboardingSPA/steps/SiteGen/Preview/stylesheet.scss index c93d9cc08..825c9aa2f 100644 --- a/src/OnboardingSPA/steps/SiteGen/Preview/stylesheet.scss +++ b/src/OnboardingSPA/steps/SiteGen/Preview/stylesheet.scss @@ -1,62 +1,66 @@ .nfd-onboarding-step { - &--site-gen { - &__preview { - display: flex; - flex-direction: column; - justify-content: space-evenly; - align-items: center; - - &__context { - text-align: center; - color: var(--nfd-onboarding-primary); - display: flex; - flex-direction: column; - width: 450px; - justify-content: center; - align-items: center; - margin:16px 0px; - &__heading { - font-size: 28px; - } - - &__subheading { - font-size: 18px; - } - } - - &__live_previews { - display: flex; - flex-direction: row; - align-items: center; - justify-content: center; - width: 100%; - margin-top: 30px; - } - - &__favorite-info { - display: flex; - flex-direction: row; - align-items: center; - justify-content: center; - background-color: var(--nfd-onboarding-preview-favorite-background); - border-radius: 12px; - margin:16px 0px; - height: 54px; - width: 559px; - &__icon { - background-image: var(--sitegen-favorite); - height: 20px; - width: 20px; - margin-right: 18px; - } - - &__text { - color: var(--nfd-onboarding-primary); - font-size: 16px; - } - } - - - } - } -} \ No newline at end of file + + &--site-gen { + + &__preview { + display: flex; + flex-direction: column; + justify-content: space-evenly; + align-items: center; + + &__context { + text-align: center; + color: var(--nfd-onboarding-primary); + display: flex; + flex-direction: column; + width: 450px; + justify-content: center; + align-items: center; + margin: 16px 0; + + &__heading { + font-size: 28px; + } + + &__subheading { + font-size: 18px; + } + } + + &__live_previews { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + width: 100%; + margin-top: 30px; + } + + &__favorite-info { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + background-color: var(--nfd-onboarding-preview-favorite-background); + border-radius: 12px; + margin: 16px 0; + height: 54px; + width: 559px; + + &__icon { + background-image: var(--sitegen-favorite); + height: 20px; + width: 20px; + margin-right: 18px; + } + + &__text { + color: var(--nfd-onboarding-primary); + font-size: 16px; + } + } + + + } + } +} diff --git a/src/OnboardingSPA/steps/SiteGen/SiteLogo/index.js b/src/OnboardingSPA/steps/SiteGen/SiteLogo/index.js index e7a25d89f..50f9161b3 100644 --- a/src/OnboardingSPA/steps/SiteGen/SiteLogo/index.js +++ b/src/OnboardingSPA/steps/SiteGen/SiteLogo/index.js @@ -63,18 +63,18 @@ const SiteGenSiteLogo = () => { getEditedEntityRecord( 'root', 'site' ); }, [] ); - const handleSiteLogo = ( siteLogo ) => { + const handleSiteLogo = ( siteLogoNew ) => { const currentDataCopy = { ...currentData }; - currentDataCopy.data.siteLogo.id = siteLogo.id; - currentDataCopy.data.siteLogo.url = siteLogo.url; - currentDataCopy.data.siteLogo.fileName = siteLogo.fileName; - currentDataCopy.data.siteLogo.fileSize = siteLogo.fileSize; + currentDataCopy.data.siteLogo.id = siteLogoNew.id; + currentDataCopy.data.siteLogo.url = siteLogoNew.url; + currentDataCopy.data.siteLogo.fileName = siteLogoNew.fileName; + currentDataCopy.data.siteLogo.fileSize = siteLogoNew.fileSize; setCurrentOnboardingData( currentDataCopy ); - setFooterNavEnabled( siteLogo.id !== 0 ); + setFooterNavEnabled( siteLogoNew.id !== 0 ); editEntityRecord( 'root', 'site', undefined, { - site_logo: siteLogo.id, + site_logo: siteLogoNew.id, } ); - setSiteLogo( siteLogo ); + setSiteLogo( siteLogoNew ); }; const content = getContents(); diff --git a/src/OnboardingSPA/styles/_branding.scss b/src/OnboardingSPA/styles/_branding.scss index e5a94bca6..7efde1b77 100644 --- a/src/OnboardingSPA/styles/_branding.scss +++ b/src/OnboardingSPA/styles/_branding.scss @@ -319,9 +319,9 @@ body { --nfd-onboarding-navigation-back-background: rgba(54, 62, 68, 0.35); --nfd-onboarding-site-logo-border: var(--nfd-onboarding-primary); --nfd-onboarding-header-border: rgba(var(--nfd-onboarding-primary-rgb), 0.3); - --nfd-onboarding-preview-favorite-background: #1E2327; - --nfd-onboarding-favorite-fill : #EF4A71; - --nfd-onboarding-button-background: #363E4459; + --nfd-onboarding-preview-favorite-background: #1e2327; + --nfd-onboarding-favorite-fill: #ef4a71; + --nfd-onboarding-button-background: #363e4459; } @@ -341,10 +341,10 @@ body { --nfd-onboarding-navigation-back-background: rgba(54, 62, 68, 0.35); --nfd-onboarding-site-logo-border: rgba(156, 162, 167, 1); --nfd-onboarding-header-border: rgba(var(--nfd-onboarding-primary-rgb), 0.3); - --nfd-onboarding-preview-favorite-background: #1E2327; + --nfd-onboarding-preview-favorite-background: #1e2327; --nfd-onboarding-editor-header-background: var(--nfd-onboarding-preview-favorite-background); - --nfd-onboarding-favorite-fill : #EF4A71; - --nfd-onboarding-button-background: #363E4459; + --nfd-onboarding-favorite-fill: #ef4a71; + --nfd-onboarding-button-background: #363e4459; --sitegen-background: url(../static/images/ai_bg.png); } } diff --git a/src/OnboardingSPA/styles/app.scss b/src/OnboardingSPA/styles/app.scss index c99563ad3..cb759c0c7 100644 --- a/src/OnboardingSPA/styles/app.scss +++ b/src/OnboardingSPA/styles/app.scss @@ -59,7 +59,7 @@ @import "../components/CardWithOptions/stylesheet"; @import "../components/Loaders/SiteGenLoader/stylesheet"; @import "../components/Footer/stylesheet"; -@import "../components/LivePreview/SiteGenCard/stylesheet.scss"; +@import "../components/LivePreview/SiteGenCard/stylesheet"; // CSS for Pages @import "../steps/BasicInfo/stylesheet"; @@ -81,9 +81,9 @@ @import "../steps/SiteGen/SocialMedia/stylesheet"; @import "../steps/SiteGen/Welcome/stylesheet"; @import "../steps/SiteGen/Building/stylesheet"; -@import "../steps/SiteGen/Preview/stylesheet.scss"; -@import "../steps/SiteGen/Editor/stylesheet.scss"; -@import "../steps/SiteGen/Editor/Header/stylesheet.scss"; +@import "../steps/SiteGen/Preview/stylesheet"; +@import "../steps/SiteGen/Editor/stylesheet"; +@import "../steps/SiteGen/Editor/Header/stylesheet"; .nfd-onboarding-container { display: flex;