fix new appbar

CHANGELOG

@@ -2,12 +2,22 @@ All notable changes to this project will be documented in this file.
 
 ### UNRELEASED
   - new plugin system - fix #17
-    - new "publish on telegram" plugin: thanks @fadelkon
+    - new "publish on telegram" plugin: (thanks @fadelkon)
   - i18n refactoring
   - people can now choose the language displayed - fix #171
   - fix place "[Object]" issue - #194
   - admin could choose a custom fallback image - fix #195
   - it is now possible NOT to enter the end time of an event - fix #188
+  - Wordpress plugin now supports MU installation
+  - add nominatim / openstreetmap feature (thanks @gothos)
+  - improve event import
+  - add Apple touch icon - fix #200
+  - improve navbar layout
+  - improve event layout
+  - new hide calendar option
+  - new hide thumbs from homepage option
+  - complete oauth2 refactoring
+  - fix random restart
 
 
 ### 1.5.6 - 22 set '22

assets/style.css

@@ -9,6 +9,10 @@ li {
   margin-left: 10px;
 }
 
+.v-main {
+  padding-top: 224px !important;
+}
+
 .v-dialog .theme--dark.v-card {
   background-color: #434343;
 }
@@ -21,8 +25,9 @@ li {
   letter-spacing: normal !important;
 }
 
-.v-main {
-  padding-top: 176px !important;
+/* https://github.com/vuetifyjs/vuetify/issues/8875#issuecomment-559900683 */
+.v-slide-group__prev {
+  display: none !important;
 }
 
 .v-toolbar .v-list-item__subtitle,
@@ -34,8 +39,8 @@ li {
 
 #home {
   max-width: 1400px;
-  padding: 0px;
-  overflow: hidden;
+  /* padding: 0px; */
+  /* overflow: hidden; */
 }
 
 #events {

components/Appbar.vue

@@ -1,15 +1,17 @@
 <template>
-  <v-app-bar absolute prominent app hide-on-scroll
-      src="/headerimage.png">
-      <template v-slot:img="{ props }">
-        <v-img
-          v-bind="props"
-          :gradient="gradient"
-        ></v-img>
+  <v-app-bar shrink-on-scroll  promiment app src="/headerimage.png">
+    <template v-slot:img="{ props }">
+      <v-img
+        v-bind="props"
+        :gradient="gradient"></v-img>
       </template>
+
       <v-app-bar-nav-icon to='/'>
         <img src='/logo.png' height='40' />
       </v-app-bar-nav-icon>
+
+      <!-- <v-text-field name='search' :label='$t("common.search")' dense outlined rounded hide-details :append-icon='mdiMagnify'/> -->
+
       <v-list-item class='align-self-end' two-line>
         <v-list-item-content>
           <h4 v-text='settings.title'></h4>
@@ -126,25 +128,26 @@
 <!-- .v-application--is-ltr .v-tabs--align-with-title > .v-tabs-bar:not(.v-tabs-bar--show-arrows):not(.v-slide-group--is-overflowing) > .v-slide-group__wrapper > .v-tabs-bar__content > .v-tab:first-child,
      .v-application--is-ltr .v-tabs--align-with-title > .v-tabs-bar:not(.v-tabs-bar--show-arrows):not(.v-slide-group--is-overflowing) > .v-slide-group__wrapper > .v-tabs-bar__content > .v-tabs-slider-wrapper + .v-tab -->
       <template v-slot:extension>
-        <v-tabs dense icons-and-text :align-with-title='$vuetify.breakpoint.smAndUp' optional>
-          <v-tab to='/'>
-            <span class='d-none d-sm-flex'>Home</span>
-            <v-icon v-text='mdiHome' />
-          </v-tab>
-          <v-tab v-if='loggedIn || settings.allow_anon_event' to='/add'>
-            <span class='d-none d-sm-flex'>{{$t('common.add_event')}}</span>
-            <v-icon color='primary' v-text='mdiPlus' />
-          </v-tab>
-          <v-tab to='/export' >
-            <span class='d-none d-sm-flex'>{{$t('common.share')}}</span>
-            <v-icon v-text='mdiShareVariant' />
-          </v-tab>
-          <v-tab to='/about'>
-            <span class='d-none d-sm-flex'>About</span>
-            <v-icon v-text='mdiInformation' />
-          </v-tab>
-        </v-tabs>
+      <v-tabs v-model='tab' optional dense icons-and-text>
+        <v-tab to='/'>
+          <span class='d-none d-sm-flex'>Home</span>
+          <v-icon v-text='mdiHome' />
+        </v-tab>
+        <v-tab v-if='loggedIn || settings.allow_anon_event' to='/add'>
+          <span class='d-none d-sm-flex'>{{$t('common.add_event')}}</span>
+          <v-icon color='primary' v-text='mdiPlus' />
+        </v-tab>
+        <v-tab to='/export' >
+          <span class='d-none d-sm-flex'>{{$t('common.share')}}</span>
+          <v-icon v-text='mdiShareVariant' />
+        </v-tab>
+        <v-tab to='/about'>
+          <span class='d-none d-sm-flex'>About</span>
+          <v-icon v-text='mdiInformation' />
+        </v-tab>
+      </v-tabs>
       </template>
+
     </v-app-bar>
 
 <!-- //- v-app-bar(app aria-label='Menu' height=64)
@@ -220,9 +223,9 @@ import { mdiPlus, mdiShareVariant, mdiLogin, mdiDotsVertical, mdiLogout, mdiAcco
 
 
 export default {
-  name: 'Nav',
+  name: 'Appbar',
   data () {
-    return { mdiPlus, mdiShareVariant, mdiLogout, mdiLogin, mdiDotsVertical, mdiAccount, mdiCog, mdiRss, mdiHome, mdiInformation, locales }
+    return { mdiPlus, mdiShareVariant, mdiLogout, mdiLogin, mdiDotsVertical, mdiAccount, mdiCog, mdiRss, mdiHome, mdiInformation, locales, tab: '' }
   },
   mixins: [clipboard],
   computed: {

layouts/default.vue

@@ -1,7 +1,7 @@
 <template>
   <v-app>
-    <Nav/>
-    <v-main >
+    <Appbar/>
+    <v-main>
       <Snackbar/>
       <Confirm/>
         <!-- <div v-if='showCollections || showBack'>
@@ -9,7 +9,9 @@
           <v-btn class='ml-2 mt-2' outlined v-for='collection in collections' color='primary' :key='collection.id' :to='`/collection/${collection.name}`'>{{collection.name}}</v-btn>
         </div> -->
         <!-- <v-fade-transition hide-on-leave> -->
-          <nuxt />
+          <v-container>
+            <nuxt />
+          </v-container>
         <!-- </v-fade-transition> -->
     </v-main>
     <Footer/>
@@ -19,7 +21,7 @@
 
 </template>
 <script>
-import Nav from '~/components/Nav.vue'
+import Appbar from '../components/Appbar.vue'
 import Snackbar from '../components/Snackbar'
 import Footer from '../components/Footer'
 import Confirm from '../components/Confirm'
@@ -42,7 +44,7 @@ export default {
   //   }
   // },  
   name: 'Default',
-  components: { Nav, Snackbar, Footer, Confirm },
+  components: { Appbar, Snackbar, Footer, Confirm },
   computed: {
     ...mapState(['settings']),
     // showBack () {

layouts/modal.vue

@@ -2,7 +2,7 @@
 v-app(app)
   Snackbar
   Confirm
-  Nav
+  Appbar
 
   v-main(app)
     v-fade-transition(hide-on-leave)
@@ -12,13 +12,13 @@ v-app(app)
 
 </template>
 <script>
-import Nav from '~/components/Nav.vue'
+import Appbar from '~/components/Appbar.vue'
 import Snackbar from '../components/Snackbar'
 import Footer from '../components/Footer'
 import Confirm from '../components/Confirm'
 
 export default {
   name: 'Default',
-  components: { Nav, Snackbar, Footer, Confirm }
+  components: { Appbar, Snackbar, Footer, Confirm }
 }
 </script>

locales/en.json

@@ -90,7 +90,8 @@
     "collections": "Collections",
     "close": "Close",
     "plugins": "Plugins",
-    "help_translate": "Help Translate"
+    "help_translate": "Help Translate",
+    "show_map": "Show map"
   },
   "login": {
     "description": "By logging in you can publish new events.",