diff options
Diffstat (limited to 'index.html')
-rw-r--r-- | index.html | 29 |
1 files changed, 21 insertions, 8 deletions
@@ -30,24 +30,37 @@ | |||
30 | <div v-cloak v-if="config.links" class="container-fluid"> | 30 | <div v-cloak v-if="config.links" class="container-fluid"> |
31 | <nav class="navbar" role="navigation" aria-label="main navigation"> | 31 | <nav class="navbar" role="navigation" aria-label="main navigation"> |
32 | <div class="container"> | 32 | <div class="container"> |
33 | <div class="navbar-menu"> | 33 | <div class="navbar-brand"> |
34 | <a role="button" | ||
35 | class="navbar-burger" :class="{ 'is-active': showMenu }" | ||
36 | aria-label="menu" aria-expanded="false" | ||
37 | v-on:click="toggleMenu()"> | ||
38 | <span aria-hidden="true"></span> | ||
39 | <span aria-hidden="true"></span> | ||
40 | <span aria-hidden="true"></span> | ||
41 | </a> | ||
42 | </div> | ||
43 | <div class="navbar-menu" :class="{ 'is-active': showMenu }"> | ||
34 | <div class="navbar-start"> | 44 | <div class="navbar-start"> |
35 | <a v-for="link in config.links" class="navbar-item" :href="link.url" :target="link.target"> | 45 | <a v-for="link in config.links" class="navbar-item" :href="link.url" :target="link.target"> |
36 | <i v-if="link.icon" style="margin-right: 6px;" :class="link.icon"></i> | 46 | <i v-if="link.icon" style="margin-right: 6px;" :class="link.icon"></i> |
37 | {{ link.name }} | 47 | {{ link.name }} |
38 | </a> | 48 | </a> |
39 | </div> | 49 | </div> |
40 | <div class="end"> | 50 | <div class="navbar-end"> |
51 | <div class="navbar-item"> | ||
41 | <a | 52 | <a |
42 | v-on:click="toggleTheme()" | 53 | v-on:click="toggleTheme()" |
43 | aria-label="Toggle dark mode" | 54 | aria-label="Toggle dark mode" |
55 | class="icon-button" | ||
44 | ><i class="fas fa-adjust"></i> | 56 | ><i class="fas fa-adjust"></i> |
45 | </a> | 57 | </a> |
46 | <a v-on:click="toggleLayout()" class="icon-button navbar-item"><i | 58 | <a v-on:click="toggleLayout()" class="icon-button"><i |
47 | :class="['fas', vlayout ? 'fa-list' : 'fa-columns']"></i></a> | 59 | :class="['fas', vlayout ? 'fa-list' : 'fa-columns']"></i></a> |
48 | <div class="search-bar"> | 60 | <div class="search-bar"> |
49 | <label for="search" class="search-label"></label> | 61 | <label for="search" class="search-label"></label> |
50 | <input type="text" id="search" v-model="filter" /> | 62 | <input type="text" id="search" v-model="filter" /> |
63 | </div> | ||
51 | </div> | 64 | </div> |
52 | </div> | 65 | </div> |
53 | </div> | 66 | </div> |