]> git.immae.eu Git - github/bastienwirtz/homer.git/blobdiff - index.html
Merge pull request #36 from jozefs/keyboard-shortcuts
[github/bastienwirtz/homer.git] / index.html
index 2d88daa1f434120321c26d68a53ca94944f4b251..85c9b789f62e0ec95168e9f5333a96f2599d278c 100644 (file)
@@ -7,14 +7,13 @@
   <meta name="robots" content="noindex">
   <link rel="icon" type="image/png" href="assets/favicon.png">
   <title>Homer</title>
-  <link defer rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
-  <link defer rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.5/css/bulma.min.css">
-  <link href="https://fonts.googleapis.com/css?family=Lato|Raleway&display=swap" rel="stylesheet">
+  <link defer rel="stylesheet" href="vendors/font-awesone.min.css">
+  <link defer rel="stylesheet" href="vendors/bulma.min.css">
   <link rel="stylesheet" href="app.css">
 </head>
 
 <body>
-  <div id="app" v-if="config" :class="[isDark ? 'is-dark' : 'is-light']">
+  <div id="app" v-if="config" :class="[isDark ? 'is-dark' : 'is-light', !config.footer ? 'no-footer': '']">
     <div id="bighead">
       <section class="first-line">
         <div v-cloak class="container">
       <div v-cloak v-if="config.links" class="container-fluid">
         <nav class="navbar" role="navigation" aria-label="main navigation">
           <div class="container">
-            <div class="navbar-menu">
+            <div class="navbar-brand">
+              <a role="button" 
+                class="navbar-burger" :class="{ 'is-active': showMenu }" 
+                aria-label="menu" aria-expanded="false"
+                v-on:click="toggleMenu()">
+                <span aria-hidden="true"></span>
+                <span aria-hidden="true"></span>
+                <span aria-hidden="true"></span>
+              </a>
+            </div>
+            <div class="navbar-menu" :class="{ 'is-active': showMenu }">
               <div class="navbar-start">
                 <a v-for="link in config.links" class="navbar-item" :href="link.url" :target="link.target">
                   <i v-if="link.icon" style="margin-right: 6px;" :class="link.icon"></i>
                   {{ link.name }}
                 </a>
               </div>
-              <div class="end">
+              <div class="navbar-end">
+                <div class="navbar-item">
                   <a
                     v-on:click="toggleTheme()"
                     aria-label="Toggle dark mode"
+                    class="icon-button"
                     ><i class="fas fa-adjust"></i>
-                </a>
-                <a v-on:click="toggleLayout()" class="icon-button navbar-item"><i
-                    :class="['fas', vlayout ? 'fa-list' : 'fa-columns']"></i></a>
-                <div class="search-bar">
-                  <label for="search" class="search-label"></label>
-                  <input type="text" id="search" v-model="filter" />
+                  </a>
+                  <a v-on:click="toggleLayout()" class="icon-button"><i
+                      :class="['fas', vlayout ? 'fa-list' : 'fa-columns']"></i></a>
+                  <div class="search-bar">
+                    <label for="search" class="search-label"></label>
+                    <input type="text" id="search" ref="search" v-model="filter" />
+                  </div>
                 </div>
               </div>
             </div>
     </section>
     <footer class="footer">
         <div class="container">
-          <div class="content has-text-centered">
-            <p>Created with <span class="has-text-danger">❤️</span> with <a href="https://bulma.io/">bulma</a>, <a
-                href="https://vuejs.org/">vuejs</a>
-              & <a href="https://fontawesome.com/">font awesome</a> // Fork me on <a href="https://github.com/bastienwirtz/homer"><i
-                  class="fab fa-github-alt"></i></a></p>
+          <div class="content has-text-centered" v-if="config.footer" v-html="config.footer">
+            
           </div>
         </div>
       </footer>
   </div>
 
-  <script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.min.js"></script>
+  <script src="vendors/vue.min.js"></script>
   <script src="vendors/js-yaml.min.js"></script>
   <script src="app.js"></script>
 </body>