From 87ff0c23a004efc0fe194662b5680032ef2d43f6 Mon Sep 17 00:00:00 2001 From: Narek Zakarian Date: Wed, 4 Dec 2024 18:36:35 +0400 Subject: [PATCH] Fix the welcome screen --- .../reusable-components/_badge-box.scss | 15 +++++++++++++++ .../reusable-components/_onboarding-header.scss | 4 ++++ .../reusable-components/_welcome-docs.scss | 3 +-- .../screens/onboarding/_step-welcome.scss | 1 + 4 files changed, 21 insertions(+), 2 deletions(-) diff --git a/modules/ppcp-settings/resources/css/components/reusable-components/_badge-box.scss b/modules/ppcp-settings/resources/css/components/reusable-components/_badge-box.scss index 427b4b1fb..74fb531ee 100644 --- a/modules/ppcp-settings/resources/css/components/reusable-components/_badge-box.scss +++ b/modules/ppcp-settings/resources/css/components/reusable-components/_badge-box.scss @@ -33,5 +33,20 @@ margin: 6px 0px 0px 0px; width: fit-content; } + + @media screen and (max-width: 480px) { + display: flex; + justify-content: center; + align-items: center; + gap: 8px; + flex-direction: column; + + .ppcp-r-badge-box__title-text:not(:empty) + .ppcp-r-badge-box__title-image-badge { + margin: 0px; + img:first-of-type { + margin: 0px; + } + } + } } } diff --git a/modules/ppcp-settings/resources/css/components/reusable-components/_onboarding-header.scss b/modules/ppcp-settings/resources/css/components/reusable-components/_onboarding-header.scss index d6d8cf4f3..70348532e 100644 --- a/modules/ppcp-settings/resources/css/components/reusable-components/_onboarding-header.scss +++ b/modules/ppcp-settings/resources/css/components/reusable-components/_onboarding-header.scss @@ -31,5 +31,9 @@ @include font(14, 22, 400); margin: 0 20%; text-align: center; + + @media screen and (max-width: 480px) { + margin: 0px; + } } } diff --git a/modules/ppcp-settings/resources/css/components/reusable-components/_welcome-docs.scss b/modules/ppcp-settings/resources/css/components/reusable-components/_welcome-docs.scss index 411d5a987..f6dce1407 100644 --- a/modules/ppcp-settings/resources/css/components/reusable-components/_welcome-docs.scss +++ b/modules/ppcp-settings/resources/css/components/reusable-components/_welcome-docs.scss @@ -20,8 +20,7 @@ justify-content: center; @media screen and (max-width: 480px) { - flex-wrap: wrap; - row-gap: 8px; + display: block; } } } diff --git a/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-welcome.scss b/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-welcome.scss index 3399a1bc9..47af9c99a 100644 --- a/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-welcome.scss +++ b/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-welcome.scss @@ -78,6 +78,7 @@ border-right: 0; padding-right: 0; padding-bottom: 8px; + margin: 0px; } } }