diff --git a/resources/css/layout/nav/primary-menu.css b/resources/css/layout/nav/primary-menu.css index a0a6ce3..20f9539 100644 --- a/resources/css/layout/nav/primary-menu.css +++ b/resources/css/layout/nav/primary-menu.css @@ -7,7 +7,7 @@ h-fit py-0 lg:py-3 - px-8 + px-6 2xl:px-20 my-0 !pb-5; @@ -124,23 +124,18 @@ } } li.menu-item.menu-item-has-children:hover { - /* &:hover .page_icon { - transform: none; - } */ @screen lg { .menu-item-submenu-toggle:after { transform: rotate(180deg); } - /* .sub-menu { - display: block; - } */ } } /* submenus */ li .sub-menu { @apply bg-carhop-green-700 p-6 - px-6 + px-0 md:px-6 + mx-auto lg:mx-0 static @@ -199,7 +194,7 @@ } &.menu-item.has-page-icon a { - @apply flex gap-6 items-center justify-start flex-row p-6 py-8; + @apply flex gap-6 items-center justify-start flex-row px-2 md:px-6 p-6 py-4 md:py-8; .page_icon { @apply w-12 h-12; } @@ -265,12 +260,15 @@ /* min-height: 96vh; */ padding-top: 2vh; } + > ul > li.menu-item { + @apply py-4 md:py-8; + } li.menu-item { @apply mt-0 lg:text-center text-white font-medium - py-8 + text-lg pb-2 lg:pb-0; @@ -317,25 +315,27 @@ } body:has(.primary-menu-container .sub-menu-open) { - main { - @apply relative; + @screen md { + main { + @apply relative; - &:after { - @apply absolute inset-0 bg-black/50 z-10; - backdrop-filter: blur(4px); - content: ''; - display: block; - width: 100%; - height: 100%; - position: absolute; - top: 0; - left: 0; - z-index: 10; + &:after { + @apply absolute inset-0 bg-black/50 z-10; + backdrop-filter: blur(4px); + content: ''; + display: block; + width: 100%; + height: 100%; + position: absolute; + top: 0; + left: 0; + z-index: 10; - transition: all 0.3s ease-out; - @starting-style { - backdrop-filter: blur(0px); - background-color: transparent; + transition: all 0.3s ease-out; + @starting-style { + backdrop-filter: blur(0px); + background-color: transparent; + } } } } diff --git a/resources/css/layout/nav/secondary-menu.css b/resources/css/layout/nav/secondary-menu.css index 6b105c2..1cbda8f 100644 --- a/resources/css/layout/nav/secondary-menu.css +++ b/resources/css/layout/nav/secondary-menu.css @@ -70,7 +70,7 @@ li { @apply border-b border-white; a { - @apply py-6 px-4 block w-full; + @apply py-6 px-2 md:px-4 block w-full; .page_subtitle { @apply opacity-80 font-light mt-3 inline-block; /* line-height: 1; */