From f043a1d18d4bb7e03ae64a84134f487a01e0f788 Mon Sep 17 00:00:00 2001 From: Antoine M Date: Thu, 11 Jan 2024 08:55:13 +0100 Subject: [PATCH] refining css --- resources/css/layout/menu-renovateur.css | 36 ++++++++++++++---------- 1 file changed, 21 insertions(+), 15 deletions(-) diff --git a/resources/css/layout/menu-renovateur.css b/resources/css/layout/menu-renovateur.css index 266c867..9c4069a 100644 --- a/resources/css/layout/menu-renovateur.css +++ b/resources/css/layout/menu-renovateur.css @@ -38,7 +38,9 @@ } */ &__navlist { - @apply lg:flex + @apply w-fit + mx-auto + lg:flex justify-center /* relative */; @@ -57,26 +59,20 @@ } /* Generic Submenu Item */ .sub-menu { - @apply fixed - - z-50 - top-0 + @apply z-50 left-0 min-h-screen w-full py-8 + px-12 + xl:px-0 + fixed lg:absolute + top-[5.5rem] + lg:top-0 lg:min-h-0 - bottom-0 + bottom-0; - /* lg:w-screen - lg:max-w-3xl */ - /* -bottom-2 */; - /* background: white; */ - /* box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px; */ - /* left: 0; */ - /* width: 100%; */ - /* margin: 0 calc(50% - 50vw); */ isolation: isolate; &:after { @@ -104,6 +100,10 @@ } &--open { @apply block; + touch-action: none; + body { + overflow: hidden; + } } } @@ -187,7 +187,7 @@ transform: rotate(180deg); } &__submenu-close { - @apply absolute text-right top-8 right-0 w-fit h-auto rounded-full outline-offset-4; + @apply absolute text-right top-8 right-12 xl:right-0 w-fit h-auto rounded-full outline-offset-4; width: fit-content; padding: 0; } @@ -196,6 +196,7 @@ @apply /* bg-white */ order-3 lg:order-2 + mx-auto w-full lg:w-fit; } @@ -269,6 +270,11 @@ } } +/* Handling background page scroll */ +body:has(.menu-renovateur .sub-menu--open) { + @apply overflow-hidden; +} + .menu-renovateur--footer { @apply p-0 shadow-none w-full; .menu-renovateur__navlist-container {