increased size and spacing in mobile menu

This commit is contained in:
Chris Cochrun 2022-11-01 13:40:49 -05:00
parent 36ea3bcb7e
commit 9dbd3ff379
2 changed files with 34 additions and 2 deletions

View file

@ -2104,6 +2104,16 @@ select {
padding-bottom: 0.75rem; padding-bottom: 0.75rem;
} }
.px-10 {
padding-left: 2.5rem;
padding-right: 2.5rem;
}
.px-28 {
padding-left: 7rem;
padding-right: 7rem;
}
.pt-8 { .pt-8 {
padding-top: 2rem; padding-top: 2rem;
} }
@ -2136,6 +2146,10 @@ select {
padding-top: 1rem; padding-top: 1rem;
} }
.pt-5 {
padding-top: 1.25rem;
}
.text-center { .text-center {
text-align: center; text-align: center;
} }
@ -2191,6 +2205,11 @@ select {
font-size: 0.6rem; font-size: 0.6rem;
} }
.text-3xl {
font-size: 1.875rem;
line-height: 2.25rem;
}
.font-extrabold { .font-extrabold {
font-weight: 800; font-weight: 800;
} }
@ -2231,6 +2250,10 @@ select {
line-height: .75rem; line-height: .75rem;
} }
.leading-loose {
line-height: 2;
}
.text-neutral-900 { .text-neutral-900 {
--tw-text-opacity: 1; --tw-text-opacity: 1;
color: rgba(var(--color-neutral-900), var(--tw-text-opacity)); color: rgba(var(--color-neutral-900), var(--tw-text-opacity));
@ -2308,6 +2331,10 @@ select {
text-decoration-color: rgba(var(--color-neutral-300), 1); text-decoration-color: rgba(var(--color-neutral-300), 1);
} }
.decoration-secondary-500 {
text-decoration-color: rgba(var(--color-secondary-500), 1);
}
.opacity-0 { .opacity-0 {
opacity: 0; opacity: 0;
} }
@ -3559,6 +3586,11 @@ body:has(#menu-controller:checked) {
padding-bottom: 6rem; padding-bottom: 6rem;
} }
.sm\:px-24 {
padding-left: 6rem;
padding-right: 6rem;
}
.sm\:pt-10 { .sm\:pt-10 {
padding-top: 2.5rem; padding-top: 2.5rem;
} }

View file

@ -107,7 +107,7 @@
{{ if .Site.Menus.main }} {{ if .Site.Menus.main }}
{{ range .Site.Menus.main }} {{ range .Site.Menus.main }}
<li class="mb-1"> <li class="mb-1">
<a {{ if or (strings.HasPrefix .URL "http:") (strings.HasPrefix .URL "https:") }} target="_blank"{{ end }} class="decoration-primary-500 hover:underline hover:decoration-2 hover:underline-offset-2" <a {{ if or (strings.HasPrefix .URL "http:") (strings.HasPrefix .URL "https:") }} target="_blank"{{ end }} class="text-3xl leading-loose decoration-secondary-500 hover:underline hover:decoration-2 hover:underline-offset-2"
href="{{ .URL }}" title="{{ .Title }}"> href="{{ .URL }}" title="{{ .Title }}">
{{ partial "icon.html" .Pre }} {{ partial "icon.html" .Pre }}
{{ if and .Pre .Name }} &nbsp; {{ end }} {{ if and .Pre .Name }} &nbsp; {{ end }}
@ -127,7 +127,7 @@
<div id="mobile-menu" <div id="mobile-menu"
class="fixed inset-0 z-30 invisible w-screen h-screen m-auto overflow-auto transition-opacity opacity-0 cursor-default bg-neutral-100/50 backdrop-blur-sm dark:bg-neutral-900/50"> class="fixed inset-0 z-30 invisible w-screen h-screen m-auto overflow-auto transition-opacity opacity-0 cursor-default bg-neutral-100/50 backdrop-blur-sm dark:bg-neutral-900/50">
<ul <ul
class="flex movedown flex-col w-full px-6 py-6 mx-auto overflow-visible list-none ltr:text-right rtl:text-left max-w-7xl sm:px-14 md:px-24 lg:px-32 sm:py-10 sm:pt-10"> class="flex movedown flex-col w-full px-10 py-6 mx-auto overflow-visible list-none ltr:text-right rtl:text-left max-w-7xl sm:px-14 md:px-24 lg:px-32 sm:py-10 sm:pt-10">
<li class="mb-1"> <li class="mb-1">
<span class="cursor-pointer hover:text-primary-600 dark:hover:text-primary-400">{{ partial "icon.html" <span class="cursor-pointer hover:text-primary-600 dark:hover:text-primary-400">{{ partial "icon.html"
"xmark" }}</span> "xmark" }}</span>