tools
/
configui
1
0
Fork 0
Code Issues 14 Pull Requests Projects Releases 6 Wiki Activity

feat: update nav

feat/muzan
Evan Chen 2021-11-12 17:26:35 +08:00
parent 31c141b6f9
commit 56841cc8be
3 changed files with 76 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
templates/base/header.tmpl
View File

@ -8,4 +8,6 @@
<link rel="stylesheet" href="{{.BaseUrl}}public/css/main.css"> <link rel="stylesheet" href="{{.BaseUrl}}public/css/main.css">
</head> </head>
<body> <body>
{{template "base/nav" .}}
{{end}} {{end}}

74
templates/base/nav.tmpl Normal file
View File

@ -0,0 +1,74 @@
{{define "base/nav"}}
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="navbar-brand">
<a class="navbar-item" href="{{.BaseUrl}}">
<p><strong>{{.AppName}}</strong></p>
</a>
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
<span aria-hidden="true"></span>
</a>
</div>
<div id="navbarBasicExample" class="navbar-menu">
<div class="navbar-start">
{{if .Actions}}
<a class="navbar-item">
Actions
</a>
{{end}}
{{if .Integrations}}
<a class="navbar-item">
Integrations
</a>
{{end}}
</div>
{{/*
<div class="navbar-end">
<div class="navbar-item">
<div class="buttons">
<a class="button is-primary">
<strong>Sign up</strong>
</a>
<a class="button is-light">
Log in
</a>
</div>
</div>
</div>
*/}}
</div>
</nav>
<script>
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');
});
});
}
});
</script>
{{end}}

8
templates/home.tmpl
View File

@ -5,14 +5,6 @@
var Active = "{{.File.Name}}"; var Active = "{{.File.Name}}";
</script> </script>
<section class="hero is-small is-primary">
<div class="hero-body" id="title">
<p class="title">
{{.AppName}}
</p>
</div>
</section>
<div class="columns"> <div class="columns">
<div class="column is-one-quarter"> <div class="column is-one-quarter">
<div class="box"> <div class="box">