navbar updates

* change login button
* add more mobile options

Signed-off-by: Toshaan Bharvani <toshaan@vantosh.com>
remotes/1693381142243034077/jamesk-patch-1
Toshaan Bharvani 3 years ago
parent 8ced6eb860
commit 8fa1aedaeb

@ -1,84 +1,90 @@
<header class="header"> <header class="header">
<div class="container navigation"> <div class="container navigation">
<div class="row d-lg-flex flex-lg-nowrap"> <div class="row d-lg-flex flex-lg-nowrap">
{{ $imageresource := resources.Get "img/logo.png" }} {{ $imageresource := resources.Get "img/logo.png" }}
{{ $imagefile := $imageresource.Resize "350x60" }} {{ $imagefile := $imageresource.Resize "350x60 webp" }}
<div class="header__logo-col col d-flex justify-content-center align-items-center"> <div class="header__logo-col col d-flex justify-content-center align-items-center">
<a class="header__logo" href="{{ "/" | relURL }}"> <a class="header__logo" href="{{ "/" | relURL }}">
<img src="{{ $imagefile.RelPermalink }}" width="297" height="49" alt="OpenPOWER"> <img src="{{ $imagefile.RelPermalink }}" width="297" height="49" alt="OpenPOWER">
</a> </a>
</div> </div>
<div class="header__menu-col col"> <div class="header__menu-col col">
<nav class="navbar navbar-expand-lg header__menu-nav" id="nav-menu-container"> <nav class="navbar navbar-expand-lg header__menu-nav" id="nav-menu-container">
<ul class="nav-menu header__menu d-lg-flex justify-content-center list-unstyled"> <ul class="nav-menu header__menu d-lg-flex justify-content-center list-unstyled">
{{ range .Site.Menus.navbar }} {{ range .Site.Menus.navbar }}
{{ if eq .Identifier "groups" }} {{ if eq .Identifier "groups" }}
<li class="header__menu-item menu-has-children"><a href="{{ .URL }}">{{ .Name }}</a> <li class="header__menu-item menu-has-children"><a href="{{ .URL }}">{{ .Name }}</a>
<ul class="list-unstyled"> <ul class="list-unstyled">
{{ range $.Site.Pages }} {{ range $.Site.Pages }}
{{ $group := .Param "wgtype" }} {{ $group := .Param "wgtype" }}
{{ if eq $group "twg" }} {{ if eq $group "twg" }}
<li class="header__menu-item"><a href="{{ .Permalink }}">{{ .Title }}</a></li> <li class="header__menu-item"><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}
{{ if eq $group "sig" }} {{ if eq $group "sig" }}
<li class="header__menu-item"> <a href="{{ .Permalink }}">{{ .Title }}</a></li> <li class="header__menu-item"><a href="{{ .Permalink }}">{{ .Title }}</a></li>
{{ end }} {{ end }}
{{ end }} {{ end }}
</ul> </ul>
{{ else }} </li>
{{ if .HasChildren }} {{ else }}
<li class="header__menu-item menu-has-children"> {{ if .HasChildren }}
<a href="{{ .URL }}">{{ .Name }}</a> <li class="header__menu-item menu-has-children">
<ul class=""> <a href="{{ .URL }}">{{ .Name }}</a>
<ul class="">
{{ range .Children }} {{ range .Children }}
{{ if .HasChildren }} {{ if .HasChildren }}
<li class="header__menu-item menu-has-children"> <li class="header__menu-item menu-has-children">
<a href="{{ .URL }}">{{ .Name }}</a> <a href="{{ .URL }}">{{ .Name }}</a>
<ul class=""> <ul class="">
{{ range .Children }} {{ range .Children }}
<li class="header__menu-item"><a href="{{ .URL }}">{{ .Name }}</a></li> <li class="header__menu-item"><a href="{{ .URL }}">{{ .Name }}</a></li>
{{ end }} {{ end }}
</ul> </ul>
</li> </a>
{{ else }} </li>
<li class="header__menu-item"> {{ else }}
<a href="{{ .URL }}"> <li class="header__menu-item">
{{ if .Pre }} <a href="{{ .URL }}">
<i class={{ .Pre }}></i>&nbsp;&nbsp; {{ if .Pre }}
{{ end }} <i class={{ .Pre }}></i>&nbsp;&nbsp;
{{ .Name }} {{ end }}
{{ if .Post }} {{ .Name }}
&nbsp;&nbsp;<i class="{{ .Post }}"></i> {{ if .Post }}
{{ end }} &nbsp;&nbsp;<i class="{{ .Post }}"></i>
</a> {{ end }}
</li> </a>
{{ end }} </li>
{{ end }}
{{ end }} {{ end }}
</ul> </ul>
{{ else }} </a>
<li class="header__menu-item {{lower .Name }}" ><a href="{{ .URL }}">{{ .Name }}</a></li> </li>
{{ end }} {{ else }}
<li class="header__menu-item {{lower .Name }}" ><a href="{{ .URL }}">{{ .Name }}</a></li>
{{ end }} {{ end }}
{{ end }} {{ end }}
<li class="header__menu-item"><a href="{{ "/contact/" | relURL }}"><i class="fas fa-envelope-open-text"></i>&nbsp;Contact</a></li> {{ end }}
<div class="mobile-view-social-join pt-3"> <li class="header__menu-item"><a href="{{ "/contact/" | relURL }}"><i class="fas fa-envelope-open-text"></i>&nbsp;Contact</a></li>
<div class="header__contact-btn join-us-button mobile-view py-4"> </ul>
<a class="d-inline-block btn-outline-primary btn-sm btn" href="/join">Join</a> <div class="mobile-view-social-join pt-3">
</div> <div class="header__contact-btn join-us-button mobile-view py-4">
</div> <a class="d-inline-block btn-outline-primary btn-sm btn" href="{{ "/join/" | relURL }}">Join</a>
</ul>
</nav>
</div>
<div class="header__contact-col col d-flex flex-nowrap justify-content-center align-items-center">
<div class="header__contact-btn join-us-button desktop-view">
<a class="d-block btn-outline-primary btn-sm btn" href="{{ "/join/" | relURL }}">Join</a>
</div> </div>
<div class="header__login-btn login-button desktop-view"> <div class="header__login-btn login-button mobile-view py-4">
<a class="d-block btn-outline-primary btn-sm btn" href="https://portal.openpower.foundation/"> <a class="d-block" href="https://portal.openpower.foundation/"> Login&nbsp;<i class="fas fa-sign-in-alt"></i></a>
Login&nbsp;<i class="fas fa-sign-in-alt"></i>
</a>
</div> </div>
</div> </div>
</nav>
</div>
<div class="header__contact-col col d-flex flex-nowrap justify-content-center align-items-center">
<div class="header__contact-btn join-us-button desktop-view">
<a class="d-block btn-outline-primary btn-sm btn" href="{{ "/join/" | relURL }}">Join</a>
</div>
<div class="header__login-btn login-button desktop-view">
<a class="d-block" href="https://portal.openpower.foundation/"> Login&nbsp;<i class="fas fa-sign-in-alt"></i>
</a>
</div>
</div> </div>
</div> </div>
</div>
</header> </header>

Loading…
Cancel
Save