diff --git a/web/styles.css b/web/styles.css index 5406461..0afcbb0 100644 --- a/web/styles.css +++ b/web/styles.css @@ -5,8 +5,9 @@ --menu-height: 64px; --menu-item-height: 48px; --menu-item-spacing: 20px; - --menu-bg-color: rgb(32, 32, 32); + --menu-bg-color: rgb(28, 28, 28); --menu-mobile-bg-color: rgb(20, 20, 20); + --menu-mobile-active-color: rgb(40, 40, 40); --menu-shadow: 0px 0px 12px rgb(0, 0, 0); --menu-font-size: 16px; @@ -145,17 +146,28 @@ a:hover { .menu-bar>menu { flex-flow: column; width: 100%; - padding: calc(var(--content-margin) / 2) 0; background-color: var(--menu-mobile-bg-color); } .menu-bar>menu>li { - padding: calc(var(--menu-item-spacing) / 2) 0; - padding-left: var(--content-margin); + height: var(--menu-item-height); + padding: 0 var(--content-margin); + border-bottom: 1px solid var(--menu-mobile-active-color); + } + + .menu-bar>menu>li:last-child { + border-bottom-width: 0px; } .menu-bar>menu>li.active { - background-color: var(--menu-bg-color); + background-color: var(--menu-mobile-active-color); + } + + .menu-bar>menu>li>a { + display: flex; + align-items: center; + width: 100%; + height: 100%; } .menu-bar>menu.mobile-hidden {