adrian/hugo-theme-re-terminal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix menu layout and bring back spacer element

Browse Source
This commit is contained in:
panr 2022-11-06 10:05:46 +01:00
parent c5febe957a
commit 3a101141d0
2 changed files with 13 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
assets/css/header.scss
View File

@ -47,6 +47,8 @@
} }
.menu { .menu {
display: flex;
align-items: flex-start;
margin: 20px 1px; margin: 20px 1px;
@media ($phone) { @media ($phone) {
@ -112,7 +114,7 @@
&-more { &-more {
@include menu; @include menu;
top: 35px; top: 0;
left: 0; left: 0;
&-trigger { &-trigger {
@ -130,7 +132,7 @@
} }
.spacer { .spacer {
flex-grow: 1; flex-grow: 1 !important;
} }
.language-selector { .language-selector {
@ -144,12 +146,12 @@
flex-direction: row; flex-direction: row;
color: $accent; color: $accent;
cursor: pointer; cursor: pointer;
margin: 0; margin-right: 0 !important;
} }
&__more { &__more {
@include menu; @include menu;
top: 35px; top: 0;
right: 0; right: 0;
} }
} }

13
layouts/partials/menu.html
View File

@ -9,7 +9,7 @@
{{ if gt (len $.Site.Menus.main) $.Site.Params.showMenuItems }} {{ if gt (len $.Site.Menus.main) $.Site.Params.showMenuItems }}
<li> <li>
<ul class="menu__sub-inner"> <ul class="menu__sub-inner">
<li class="menu__sub-inner-more-trigger">{{ $.Site.Params.MenuMore }} ▾</li> <li class="menu__sub-inner-more-trigger">{{ $.Site.Params.MenuMore }}&nbsp;▾</li>
<li> <li>
<ul class="menu__sub-inner-more hidden"> <ul class="menu__sub-inner-more hidden">
{{ range last (sub (len $.Site.Menus.main) $.Site.Params.showMenuItems) $.Site.Menus.main }} {{ range last (sub (len $.Site.Menus.main) $.Site.Params.showMenuItems) $.Site.Menus.main }}
@ -29,15 +29,16 @@
{{ end }} {{ end }}
{{ end }} {{ end }}
{{ end }} {{ end }}
</ul>
<span class="spacer"></span>
<ul class="menu__inner menu__inner--desktop">
{{ if and $.Site.Params.showLanguageSelector (len $.Site.Home.AllTranslations) }} {{ if and $.Site.Params.showLanguageSelector (len $.Site.Home.AllTranslations) }}
<!-- <div class="spacer"></div> -->
<li> <li>
<ul class="language-selector"> <ul class="language-selector">
<li class="language-selector-current">
{{ .Language.LanguageName }}&nbsp;▾
</li>
<li> <li>
<ul class="language-selector-current">
<li>{{ .Language.LanguageName }} ▾</li>
</ul>
<ul class="language-selector__more hidden"> <ul class="language-selector__more hidden">
{{ range $.Site.Home.AllTranslations }} {{ range $.Site.Home.AllTranslations }}
<li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li> <li><a href="{{ .Permalink }}">{{ .Language.LanguageName }}</a></li>