From a40e9d752e4406c42de1ac91da31f81af1ab44ed Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Bjo=CC=88rn=20Fromme?= Date: Wed, 21 Nov 2018 10:19:50 +0100 Subject: [PATCH] Avoid colliding of header badges in mobile view --- .../Private/Assets/scss/remix/_badges.scss | 6 +++++- .../Private/Assets/scss/remix/_product.scss | 14 ++++++++++---- 2 files changed, 15 insertions(+), 5 deletions(-) diff --git a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_badges.scss b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_badges.scss index f6f8d48e..5d1fdc8e 100644 --- a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_badges.scss +++ b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_badges.scss @@ -80,9 +80,13 @@ display: block; text-transform: uppercase; font-weight: 700; - font-size: 24px; + font-size: 12px; line-height: 1; padding-bottom: 4px; + + @include mq($from: tablet) { + font-size: 24px; + } } .custom-badge__subtitle { diff --git a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_product.scss b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_product.scss index e0742340..bd104260 100644 --- a/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_product.scss +++ b/web/typo3conf/ext/ep_theme/Resources/Private/Assets/scss/remix/_product.scss @@ -61,9 +61,9 @@ .product-header__badge { position: absolute; display: block; - @include size(160px); - top: 36px; - right: 8px; + @include size(100px); + top: 0; + right: 64px; &--skipass { width: 75px; @@ -73,7 +73,7 @@ } .custom-badge__title { - font-size: 20px; + font-size: 12px; } .custom-badge__subtitle { @@ -82,6 +82,12 @@ @include mq($from: tablet) { @include size(180px); + + &--custom { + top: 36px; + right: 20%; + } + .custom-badge__title { font-size: 22px; }