diff --git a/app/javascript/src/styles/common/navigation.scss b/app/javascript/src/styles/common/navigation.scss index ae79e478f..ed3969aaa 100644 --- a/app/javascript/src/styles/common/navigation.scss +++ b/app/javascript/src/styles/common/navigation.scss @@ -5,7 +5,7 @@ nav.navigation { grid-template-rows: min-content auto min-content min-content; width: 100%; // otherwise narrow when fixed - z-index: 10; // otherwise post labels layered above + z-index: 20; // otherwise post labels layered above pointer-events: none; // allow clicking through offset & > menu { pointer-events: auto; } @@ -113,7 +113,10 @@ nav.navigation { height: 0.25em; } - form input[type="text"] { width: 100%; } + form input[type="text"] { + width: 100%; + box-sizing: border-box; + } } } @@ -221,6 +224,9 @@ body.nav-toggled { .nav-tools, .nav-help { display: grid; } + .nav-primary, .nav-tools, .nav-help { + box-shadow: -1px 0 5px -1px var(--color-background); + } } } @@ -233,7 +239,7 @@ nav.navigation, body.nav-toggled nav.navigation { "logo secondary secondary secondary" ; grid-template-columns: min-content min-content minmax(0, 1fr) min-content; - grid-template-rows: 1.75em 1.75em; + grid-template-rows: 1.75em 2em; padding: 0 1em 0.5em; box-sizing: border-box; @@ -272,7 +278,6 @@ nav.navigation, body.nav-toggled nav.navigation { .nav-secondary { display: flex; flex-flow: row; - align-items: center; padding: 0 0.25em; font-size: 1.05em; @@ -282,7 +287,11 @@ nav.navigation, body.nav-toggled nav.navigation { overflow: hidden; li { + display: flex; + a { + align-content: center; + border-bottom: 0; padding: 0 0.75em; white-space: nowrap; @@ -291,8 +300,17 @@ nav.navigation, body.nav-toggled nav.navigation { &.divider { display: flex; align-items: center; + height: 100%; + &::after { content: "|"; } } + + form { + display: flex; + align-items: center; + + input[type="text"] { min-width: 10em; } + } } } @@ -340,6 +358,8 @@ nav.navigation, body.nav-toggled nav.navigation { i { display: none; } } } + + .nav-primary, .nav-tools, .nav-help { box-shadow: unset; } } } diff --git a/app/javascript/src/styles/specific/guest_warning.scss b/app/javascript/src/styles/specific/guest_warning.scss index a83b940ab..36701b901 100644 --- a/app/javascript/src/styles/specific/guest_warning.scss +++ b/app/javascript/src/styles/specific/guest_warning.scss @@ -4,11 +4,11 @@ top: 0; height: 100vh; width: 100vw; - z-index: 10; + z-index: 500; background-color: themed("color-background"); .guest-warning-dialog { - z-index: 100; + z-index: 500; position: relative; top: 20vh; margin-left: auto;