From f0838f6df0d5c3698ab928efae00bfdb7be29682 Mon Sep 17 00:00:00 2001 From: Aleksej Date: Wed, 5 Feb 2025 17:11:10 +0100 Subject: [PATCH 1/9] Update copy in constants. --- .../js/components/user-input/util/constants.js | 18 ++++++++---------- 1 file changed, 8 insertions(+), 10 deletions(-) diff --git a/assets/js/components/user-input/util/constants.js b/assets/js/components/user-input/util/constants.js index 3ffec3f3be2..73885c3ae13 100644 --- a/assets/js/components/user-input/util/constants.js +++ b/assets/js/components/user-input/util/constants.js @@ -98,7 +98,7 @@ export function getUserInputQuestions() { 'google-site-kit' ), description: __( - 'Based on your answer, Site Kit will tailor the metrics you see on your dashboard to help you track progress towards your specific goals', + 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', 'google-site-kit' ), }, @@ -108,17 +108,17 @@ export function getUserInputQuestions() { 'google-site-kit' ), description: __( - 'Based on your answer, Site Kit will suggest new features for your dashboard related to content creation', + 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', 'google-site-kit' ), }, { title: __( - 'What are your top goals for this site?', + 'What are your top 3 goals for this site?', 'google-site-kit' ), description: __( - 'Based on your answers, Site Kit will tailor the metrics and recommendations you see on your dashboard to help you make progress in these areas', + 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', 'google-site-kit' ), }, @@ -142,14 +142,11 @@ export function getUserInputAnswers() { ), sell_products: __( 'Sell products', 'google-site-kit' ), provide_services: __( 'Provide services', 'google-site-kit' ), - monetize_content: __( - 'Monetize content (with ads or affiliate links)', - 'google-site-kit' - ), + monetize_content: __( 'Monetize content', 'google-site-kit' ), publish_blog: __( 'Publish a blog', 'google-site-kit' ), publish_news: __( 'Publish news content', 'google-site-kit' ), share_portfolio: __( - 'Share a business card or portfolio to represent me or my company online', + 'Portfolio or business card', 'google-site-kit' ), other: __( 'Other', 'google-site-kit' ), @@ -183,6 +180,7 @@ export function getUserInputAnswers() { 'Generate more revenue', 'google-site-kit' ), + generating_leads: __( 'Generate leads', 'google-site-kit' ), help_better_rank: __( 'Help my content rank in a better position in Google search results', 'google-site-kit' @@ -192,7 +190,7 @@ export function getUserInputAnswers() { 'google-site-kit' ), encourage_to_post: __( - 'Tips for generating and posting engaging content updates', + 'Encouragement to post more frequently', 'google-site-kit' ), other: __( 'Other', 'google-site-kit' ), From f950067371c58fd12fff439d79d46b5015cfd7a7 Mon Sep 17 00:00:00 2001 From: Aleksej Date: Wed, 5 Feb 2025 17:13:34 +0100 Subject: [PATCH 2/9] Update copy in UserInputPreview. --- assets/js/components/user-input/UserInputPreview.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/components/user-input/UserInputPreview.js b/assets/js/components/user-input/UserInputPreview.js index e6df2de00b2..f91fbc2c8e5 100644 --- a/assets/js/components/user-input/UserInputPreview.js +++ b/assets/js/components/user-input/UserInputPreview.js @@ -277,7 +277,7 @@ export default function UserInputPreview( props ) { Date: Wed, 5 Feb 2025 17:38:54 +0100 Subject: [PATCH 3/9] Remove extra padding. --- .../user-input/googlesitekit-user-input-controls.scss | 4 ---- 1 file changed, 4 deletions(-) diff --git a/assets/sass/components/user-input/googlesitekit-user-input-controls.scss b/assets/sass/components/user-input/googlesitekit-user-input-controls.scss index c774cbbcb59..a9100dbb40a 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-controls.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-controls.scss @@ -39,10 +39,6 @@ font-size: $fs-body-md; letter-spacing: $ls-s; line-height: $lh-body-md; - - @media (min-width: $bp-tablet) { - padding: 10px 0; - } } } From df8321711d087e68754b255b6286b4241d923ef2 Mon Sep 17 00:00:00 2001 From: Aleksej Date: Wed, 5 Feb 2025 17:39:30 +0100 Subject: [PATCH 4/9] Update layout spacing for desktop and wider desktop screens. --- .../user-input/googlesitekit-user-input-module.scss | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/assets/sass/components/user-input/googlesitekit-user-input-module.scss b/assets/sass/components/user-input/googlesitekit-user-input-module.scss index 0a513315ca7..73286084866 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-module.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-module.scss @@ -142,10 +142,16 @@ .googlesitekit-user-input__select-options-wrapper { grid-row: span 2; + + @media (min-width: $bp-desktop) { + grid-column-start: 9; + } + @media (min-width: $bp-wpdb3) { + grid-column-start: 7; + } } p.googlesitekit-user-input__select-instruction { - border-bottom: 1px solid $c-mercury; color: $c-surfaces-on-surface; font-size: $fs-body-sm; line-height: $lh-body-sm; From 8cfc69b8ecda9aa1f5e808d92cd3805662d14d56 Mon Sep 17 00:00:00 2001 From: Aleksej Date: Thu, 6 Feb 2025 14:24:12 +0100 Subject: [PATCH 5/9] Increase the column size. --- assets/js/components/user-input/UserInputQuestionInfo.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/js/components/user-input/UserInputQuestionInfo.js b/assets/js/components/user-input/UserInputQuestionInfo.js index cb363affb34..66e1f805dfa 100644 --- a/assets/js/components/user-input/UserInputQuestionInfo.js +++ b/assets/js/components/user-input/UserInputQuestionInfo.js @@ -56,7 +56,7 @@ export default function UserInputQuestionInfo( { slug, questionNumber } ) { From f33468affebcb8af99948eecedca69b5a2fc6d0e Mon Sep 17 00:00:00 2001 From: Aleksej Date: Thu, 6 Feb 2025 14:24:45 +0100 Subject: [PATCH 6/9] Make a horizontal spacing between equal columns. --- .../user-input/googlesitekit-user-input-module.scss | 1 + .../user-input/googlesitekit-user-input-questions.scss | 4 ++++ 2 files changed, 5 insertions(+) diff --git a/assets/sass/components/user-input/googlesitekit-user-input-module.scss b/assets/sass/components/user-input/googlesitekit-user-input-module.scss index 73286084866..27349c7f3b6 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-module.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-module.scss @@ -148,6 +148,7 @@ } @media (min-width: $bp-wpdb3) { grid-column-start: 7; + padding-left: 60px; } } diff --git a/assets/sass/components/user-input/googlesitekit-user-input-questions.scss b/assets/sass/components/user-input/googlesitekit-user-input-questions.scss index 1ad299d52f2..d9be478aaee 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-questions.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-questions.scss @@ -54,6 +54,10 @@ display: flex; flex-direction: column; + @media (min-width: $bp-wpdb3) { + padding-right: 60px; + } + h1 { color: $c-surfaces-on-surface; font-size: $fs-title-sm; From 4a26f0b7ba6d5d4149cf1bc6d113c2e3a7bfd947 Mon Sep 17 00:00:00 2001 From: Aleksej Date: Thu, 6 Feb 2025 14:25:00 +0100 Subject: [PATCH 7/9] Unset padding for user preview in settings. --- .../settings/_googlesitekit-settings-user-input.scss | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/assets/sass/components/settings/_googlesitekit-settings-user-input.scss b/assets/sass/components/settings/_googlesitekit-settings-user-input.scss index 25f4d928b91..1675e7bd29a 100644 --- a/assets/sass/components/settings/_googlesitekit-settings-user-input.scss +++ b/assets/sass/components/settings/_googlesitekit-settings-user-input.scss @@ -36,6 +36,13 @@ overflow: hidden; padding: 0; } + + .googlesitekit-user-input__select-options-wrapper { + + @media (min-width: $bp-wpdb3) { + padding-left: unset; + } + } } .googlesitekit-user-input__notification-text-loading { From 977c600cbcc33e835fd400335938bdaee809e00f Mon Sep 17 00:00:00 2001 From: Aleksej Date: Wed, 12 Feb 2025 10:25:36 +0100 Subject: [PATCH 8/9] Update per CR feedback. --- .../components/user-input/util/constants.js | 20 ++++++++----------- .../googlesitekit-user-input-questions.scss | 2 +- 2 files changed, 9 insertions(+), 13 deletions(-) diff --git a/assets/js/components/user-input/util/constants.js b/assets/js/components/user-input/util/constants.js index 73885c3ae13..022da600966 100644 --- a/assets/js/components/user-input/util/constants.js +++ b/assets/js/components/user-input/util/constants.js @@ -91,36 +91,32 @@ export const USER_INPUT_PURPOSE_TO_CONVERSION_EVENTS_MAPPING = { * @return {Object} Questions object. */ export function getUserInputQuestions() { + const description = __( + 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', + 'google-site-kit' + ); + return [ { title: __( 'What is the main purpose of this site?', 'google-site-kit' ), - description: __( - 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', - 'google-site-kit' - ), + description, }, { title: __( 'How often do you create new content for this site?', 'google-site-kit' ), - description: __( - 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', - 'google-site-kit' - ), + description, }, { title: __( 'What are your top 3 goals for this site?', 'google-site-kit' ), - description: __( - 'Based on your answer, Site Kit will suggest the metrics you see on your dashboard to help you track how close you’re getting to your specific goals', - 'google-site-kit' - ), + description, }, ]; } diff --git a/assets/sass/components/user-input/googlesitekit-user-input-questions.scss b/assets/sass/components/user-input/googlesitekit-user-input-questions.scss index d9be478aaee..c6e0b812e0a 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-questions.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-questions.scss @@ -54,7 +54,7 @@ display: flex; flex-direction: column; - @media (min-width: $bp-wpdb3) { + @media (min-width: 1500px) { padding-right: 60px; } From 0bb61a1b58efb3186a56168c23d7cdd81cdefa07 Mon Sep 17 00:00:00 2001 From: Aleksej Date: Fri, 14 Feb 2025 11:49:56 +0100 Subject: [PATCH 9/9] Add bp-xxxlarge and replace the usage of wpdb3. --- .../key-metrics/_googlesitekit-key-metrics-setup-cta.scss | 2 +- .../settings/_googlesitekit-settings-user-input.scss | 2 +- .../_googlesitekit-sign-in-with-google-setup-module.scss | 4 ++-- .../user-input/googlesitekit-user-input-module.scss | 2 +- .../user-input/googlesitekit-user-input-questions.scss | 2 +- assets/sass/config/_variables.scss | 2 ++ 6 files changed, 8 insertions(+), 6 deletions(-) diff --git a/assets/sass/components/key-metrics/_googlesitekit-key-metrics-setup-cta.scss b/assets/sass/components/key-metrics/_googlesitekit-key-metrics-setup-cta.scss index 08c9cdbc99e..e3001439606 100644 --- a/assets/sass/components/key-metrics/_googlesitekit-key-metrics-setup-cta.scss +++ b/assets/sass/components/key-metrics/_googlesitekit-key-metrics-setup-cta.scss @@ -58,7 +58,7 @@ top: 0; } - @media (min-width: $bp-wpdb3) { + @media (min-width: $bp-xxxlarge) { max-width: 30%; } } diff --git a/assets/sass/components/settings/_googlesitekit-settings-user-input.scss b/assets/sass/components/settings/_googlesitekit-settings-user-input.scss index 1675e7bd29a..bc93624dbbf 100644 --- a/assets/sass/components/settings/_googlesitekit-settings-user-input.scss +++ b/assets/sass/components/settings/_googlesitekit-settings-user-input.scss @@ -39,7 +39,7 @@ .googlesitekit-user-input__select-options-wrapper { - @media (min-width: $bp-wpdb3) { + @media (min-width: $bp-xxxlarge) { padding-left: unset; } } diff --git a/assets/sass/components/sign-in-with-google/_googlesitekit-sign-in-with-google-setup-module.scss b/assets/sass/components/sign-in-with-google/_googlesitekit-sign-in-with-google-setup-module.scss index 8d5421ec9df..a38d8e30241 100644 --- a/assets/sass/components/sign-in-with-google/_googlesitekit-sign-in-with-google-setup-module.scss +++ b/assets/sass/components/sign-in-with-google/_googlesitekit-sign-in-with-google-setup-module.scss @@ -20,7 +20,7 @@ .googlesitekit-setup-cta-banner__svg-wrapper--sign-in-with-google-setup-cta { - @media (min-width: $bp-wpdb3) { + @media (min-width: $bp-xxxlarge) { height: 100%; position: relative; } @@ -39,7 +39,7 @@ max-height: 274px; } - @media (min-width: $bp-wpdb3) { + @media (min-width: $bp-xxxlarge) { max-height: 300px; position: absolute; right: 0; diff --git a/assets/sass/components/user-input/googlesitekit-user-input-module.scss b/assets/sass/components/user-input/googlesitekit-user-input-module.scss index 27349c7f3b6..34faed2010b 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-module.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-module.scss @@ -146,7 +146,7 @@ @media (min-width: $bp-desktop) { grid-column-start: 9; } - @media (min-width: $bp-wpdb3) { + @media (min-width: $bp-xxxlarge) { grid-column-start: 7; padding-left: 60px; } diff --git a/assets/sass/components/user-input/googlesitekit-user-input-questions.scss b/assets/sass/components/user-input/googlesitekit-user-input-questions.scss index c6e0b812e0a..884440771e9 100644 --- a/assets/sass/components/user-input/googlesitekit-user-input-questions.scss +++ b/assets/sass/components/user-input/googlesitekit-user-input-questions.scss @@ -54,7 +54,7 @@ display: flex; flex-direction: column; - @media (min-width: 1500px) { + @media (min-width: $bp-xxxlarge) { padding-right: 60px; } diff --git a/assets/sass/config/_variables.scss b/assets/sass/config/_variables.scss index 64deafeb7fe..7f367fdd8b4 100644 --- a/assets/sass/config/_variables.scss +++ b/assets/sass/config/_variables.scss @@ -267,6 +267,7 @@ $width-wpAdminBarTablet: 783; $width-desktop: 960; $width-xlarge: 1280; $width-xxlarge: 1440; +$width-xxxlarge: 1500; // Custom Media Breakpoints $bp-xsmallOnly: $width-xsmall - 1 + px; @@ -278,6 +279,7 @@ $bp-wpAdminBarTablet: $width-wpAdminBarTablet + px; $bp-desktop: $width-desktop + px; $bp-xlarge: $width-xlarge + px; $bp-xxlarge: $width-xxlarge + px; +$bp-xxxlarge: $width-xxxlarge + px; // Specific for WP Dashboard $bp-wpdb1: 800px;