diff options
| -rw-r--r-- | assets/css/base/base.scss | 2 | ||||
| -rw-r--r-- | layouts/_default/single.html | 7 | ||||
| -rw-r--r-- | layouts/pages/archive.html | 1 | ||||
| -rw-r--r-- | layouts/pages/contact.html | 2 | ||||
| -rw-r--r-- | layouts/partials/head.html | 2 | ||||
| -rw-r--r-- | layouts/partials/header.html | 38 | ||||
| -rw-r--r-- | static/js/bulma.js | 25 |
7 files changed, 46 insertions, 31 deletions
diff --git a/assets/css/base/base.scss b/assets/css/base/base.scss index 0e92839..6629b46 100644 --- a/assets/css/base/base.scss +++ b/assets/css/base/base.scss @@ -10,7 +10,7 @@ $family-primary: $family-san-serif; // colors -$scheme-main: #bbb; // set background color +$scheme-main: #fff; // set background color $link: #000; // main link color $link-hover: #444; $footer-background-color: false; // removes background color in footer diff --git a/layouts/_default/single.html b/layouts/_default/single.html index 65d1668..f8402f9 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -1,18 +1,11 @@ {{ define "main"}} - <!-- content --> <div class="content is-normal"> - <div class="level"> - </div> - <!-- published date --> <p class="title is-3"><i class="fas fa-file"></i> {{.Page.Title}}</p> <p class="subtitle is-4">{{.Page.Description}}</p> {{ $dateFormat := .Site.Params.dateFormat | default "January 2, 2006"}} <p class="date">Published on {{ .PublishDate.Format $dateFormat }}{{ if ne .Lastmod .PublishDate }}, last updated on {{ .Lastmod.Format $dateFormat }} {{ end }} </p> - - - {{ .Content }} </div> {{ end }} diff --git a/layouts/pages/archive.html b/layouts/pages/archive.html index 645279f..f5db684 100644 --- a/layouts/pages/archive.html +++ b/layouts/pages/archive.html @@ -7,7 +7,6 @@ <div class="content"> {{ .Content }} </div> - <div class="level"></div> <ul class="fa-ul"> {{ range .Pages.ByLastmod }} <li> diff --git a/layouts/pages/contact.html b/layouts/pages/contact.html index 351b24b..91d7886 100644 --- a/layouts/pages/contact.html +++ b/layouts/pages/contact.html @@ -7,8 +7,6 @@ {{ .Content }} </div> </p> - <div class="level"> - </div> </div> </main> {{ end }} diff --git a/layouts/partials/head.html b/layouts/partials/head.html index 4d0668c..6813def 100644 --- a/layouts/partials/head.html +++ b/layouts/partials/head.html @@ -21,5 +21,7 @@ <script src="https://kit.fontawesome.com/{{ .Site.Params.fontawesomeToken }}.js" crossorigin="anonymous"></script> {{ end }} + <script src="/js/bulma.js"></script> + <link rel="shortcut icon" type="image/x-icon" href="/img/{{ .Site.Params.favicon }}"> </head>
\ No newline at end of file diff --git a/layouts/partials/header.html b/layouts/partials/header.html index 236e9b9..82c5cd3 100644 --- a/layouts/partials/header.html +++ b/layouts/partials/header.html @@ -1,25 +1,23 @@ {{ $currentPage := . }} -<div class="container"> - <div class="level"> - <div class="level-left "> - <div class="level-item"> - <p class="title is-4"> - <a href="{{ .Site.BaseURL }}" class="title">{{.Site.Title}}</a> - </p> - </div> - - </div> - <div class="level-right"> - <div class="level-item"> - <nav class="navbar is-transparent" role="navigation" aria-label="main navigation"> - <div class="navbar-brand has-text-weight-semibold"> +<nav class="navbar {{ .Site.Params.navbarStyle }} mb-4" role="navigation" aria-label="main navigation"> + <div class="navbar-brand"> + <a class="navbar-item title {{ .Site.Params.navbarTitleStyle | default "has-text-black" }}" href="{{ .Site.BaseURL }}">{{.Site.Title}}</a> + <a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbar-menu"> + <span aria-hidden="true"></span> + <span aria-hidden="true"></span> + <span aria-hidden="true"></span> + </a> + </div> + <div id="navbar-menu" class="navbar-menu"> + <div class="navbar-end"> {{ range .Site.Menus.nav }} - <a class="navbar-item{{if or ($currentPage.IsMenuCurrent "nav" .) ($currentPage.HasMenuCurrent "nav" .) }} is-active{{end}}" href="{{.URL}}" >{{ .Name }}</a> + <a class="navbar-item{{if or ($currentPage.IsMenuCurrent "nav" .) ($currentPage.HasMenuCurrent "nav" .) }}{{end}}" href="{{.URL}}" >{{ .Name }}</a> {{ end }} - </div> - </nav> - </div> </div> </div> - <div class="level"></div> -</div>
\ No newline at end of file +</nav> + + + + +<!-- is-active for navbar-menu class -->
\ No newline at end of file diff --git a/static/js/bulma.js b/static/js/bulma.js new file mode 100644 index 0000000..9b18a3e --- /dev/null +++ b/static/js/bulma.js @@ -0,0 +1,25 @@ +document.addEventListener('DOMContentLoaded', () => { + + // Get all "navbar-burger" elements + const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0); + + // Check if there are any navbar burgers + if ($navbarBurgers.length > 0) { + + // Add a click event on each of them + $navbarBurgers.forEach( el => { + el.addEventListener('click', () => { + + // Get the target from the "data-target" attribute + const target = el.dataset.target; + const $target = document.getElementById(target); + + // Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu" + el.classList.toggle('is-active'); + $target.classList.toggle('is-active'); + + }); + }); + } + +});
\ No newline at end of file |