Chosto
/
blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Put icons into a level to keep horizontal layout on mobile devices

master
Quentin Duchemin 2021-05-27 02:33:35 +02:00
parent fb30014a2d
commit 62c7ec7511
1 changed files with 24 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
themes/chosto/layouts/partials/navbar.html
View File

@ -5,8 +5,8 @@
{{ $image := resources.Get "img/logo.jpg" }}
{{ with $image }}
{{ $imageResized := $image.Resize "64x" }}
{{ $imageURL = $imageResized.Permalink }}
{{ $imageResized := $image.Resize "64x" }}
{{ $imageURL = $imageResized.Permalink }}
{{ end }}
<img src="{{ $imageURL }}">
</a>
@ -73,22 +73,28 @@
<a class="navbar-item {{ if $currentPage.IsMenuCurrent $menuName . }}is-active is-tab{{ end }}" href="{{ .URL }}">{{ .Name }}</a>
{{ end }}
{{ end }}
{{ end }}
</div>
{{ end }}
</div>
{{ end }}
<div class="navbar-end ml-0 mr-4">
<!-- Each item should have a corresponding assets/img/x.png and link in config.yaml -->
{{ range (slice "github" "mastodon" "gitea" "mail" "funkwhale" )}}
{{ $imageName := . }}
<!-- Get image and resize to logo size -->
{{ $imagePath := printf "img/%s.png" $imageName }}
{{ $image := resources.Get $imagePath }}
{{ $imageResized := $image.Resize "64x" }}
<!-- Get logo link in site params (index allows to use a dynamic parameter name) -->
<a class="navbar-item" href="{{ index $.Site.Params $imageName }}">
<img src="{{ $imageResized.Permalink }}">
</a>
{{ end }}
</div>
<div class="navbar-end ml-0 mr-4">
<div class="level">
<div class="level-left">
<div class="level-item">
<!-- Each item should have a corresponding assets/img/x.png and link in config.yaml -->
{{ range (slice "github" "mastodon" "gitea" "mail" "funkwhale" )}}
{{ $imageName := . }}
<!-- Get image and resize to logo size -->
{{ $imagePath := printf "img/%s.png" $imageName }}
{{ $image := resources.Get $imagePath }}
{{ $imageResized := $image.Resize "64x" }}
<!-- Get logo link in site params (index allows to use a dynamic parameter name) -->
<a class="navbar-item" href="{{ index $.Site.Params $imageName }}">
<img src="{{ $imageResized.Permalink }}">
</a>
{{ end }}
</div>
</div>
</div>
</div>
</div>
</nav>