From 25b9e97fee1c8fd92f27042a9e82bb709010bc9e Mon Sep 17 00:00:00 2001 From: Antoine M Date: Thu, 16 May 2024 17:08:23 +0200 Subject: [PATCH] refining responsiveness of the component --- .../css/components/layout/Page-container.scss | 15 +++++++++------ 1 file changed, 9 insertions(+), 6 deletions(-) diff --git a/src/assets/css/components/layout/Page-container.scss b/src/assets/css/components/layout/Page-container.scss index d207f01..61c9551 100644 --- a/src/assets/css/components/layout/Page-container.scss +++ b/src/assets/css/components/layout/Page-container.scss @@ -11,26 +11,29 @@ } .screen { - @apply xl:flex flex-col justify-center items-center relative bg-lhoist xl:h-screen; + @apply flex flex-col justify-center items-center relative bg-lhoist xl:h-screen; // height: 100vh; // @apply overflow-x-hidden overflow-y-auto; overflow: hidden; - @apply pb-44 xl:pb-0 xl:pt-0; - + @apply pb-44 2xl:pb-0 xl:pt-0; + min-height: calc(100dvh); + box-sizing: border-box; @screen md { - height: calc(99.8dvh - $margin * 2); + min-height: calc(99.8dvh - $margin * 2); + height: auto; width: calc(100% - $margin * 2); - margin: $margin auto 0 auto; + margin: $margin auto $margin auto; } &__content { - @apply text-center pb-8 mt-28 md:mt-0 md:pb-0 pt-12 md:pt-12 px-2 md:px-16 w-fit mx-auto h-auto overflow-visible relative; + @apply text-center pb-8 mt-28 lg:my-12 md:pb-0 pt-12 md:pt-12 px-2 md:px-16 w-fit mx-auto h-auto overflow-visible relative; background-image: url("../../../img/shapes-background/mask.svg"); background-size: auto 100%; background-position: 90% top; @screen md { background-position: center; + background-size: 100% 100%; } background-repeat: no-repeat; box-sizing: border-box;