feat: favicon + manifest update + page selector locale switch fix

client/components/admin/admin-locale.vue

@@ -93,9 +93,9 @@
                           v-avatar.blue.white--text(tile, size='40', v-html='data.item.code.toUpperCase()')
                         v-list-item-content
                           v-list-item-title(v-html='data.item.name')
-                          v-list-item-sub-title(v-html='data.item.nativeName')
+                          v-list-item-subtitle(v-html='data.item.nativeName')
                         v-list-item-action
-                          v-checkbox(:input-value='data.tile.props.value', color='primary', value)
+                          v-checkbox(:input-value='data.attrs.inputValue', color='primary', value)
             v-flex(lg6 xs12)
               v-card.animated.fadeInUp.wait-p4s
                 v-toolbar(color='teal', dark, dense, flat)

client/components/common/page-selector.vue

@@ -28,6 +28,7 @@
           div(style='height:400px;')
             vue-scroll(:ops='scrollStyle')
               v-treeview(
+                :key='`pageTree` + treeViewCacheId'
                 :active.sync='currentNode'
                 :open.sync='openNodes'
                 :items='tree'
@@ -55,7 +56,7 @@
                   color='primary'
                   )
                   template(v-for='(page, idx) of currentPages')
-                    v-list-item(:key='page.id', :value='page.path')
+                    v-list-item(:key='`page` + page.id', :value='page.path')
                       v-list-item-icon: v-icon mdi-file-document-box
                       v-list-item-title {{page.title}}
                     v-divider(v-if='idx < pages.length - 1')
@@ -131,6 +132,7 @@ export default {
   },
   data() {
     return {
+      treeViewCacheId: 0,
       searchLoading: false,
       currentLocale: siteConfig.lang,
       currentFolderPath: '',
@@ -234,6 +236,22 @@ export default {
       if (!_.isEmpty(newValue)) {
         this.currentPath = newValue
       }
+    },
+    currentLocale (newValue, oldValue) {
+      this.$nextTick(() => {
+        this.tree = [
+          {
+            id: 0,
+            title: '/ (root',
+            children: []
+          }
+        ]
+        this.currentNode = [0]
+        this.openNodes = [0]
+        this.pages = []
+        this.all = []
+        this.treeViewCacheId += 1
+      })
     }
   },
   methods: {

client/static/browserconfig.xml

@@ -2,10 +2,8 @@
 <browserconfig>
   <msapplication>
     <tile>
-      <square70x70logo src="/favicons/ms-icon-70x70.png"/>
       <square150x150logo src="/favicons/ms-icon-150x150.png"/>
-      <square310x310logo src="/favicons/ms-icon-310x310.png"/>
+      <TileColor>#1976d2</TileColor>
-      <TileColor>#ffffff</TileColor>
     </tile>
   </msapplication>
 </browserconfig>

client/static/favicons/browserconfig.xml

@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#1976d2</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>

client/static/favicons/safari-pinned-tab.svg

@@ -0,0 +1 @@
+<svg version="1" xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 300.000000 300.000000"><path d="M250 43.3c-2.5 2.7-8.1 7.9-12.5 11.4l-8 6.3-1.2-3.7c-.7-2-1.5-3.8-1.7-4-.2-.2-2.4 3.4-5 8-4.5 8-5.3 8.8-14.5 15.1-14 9.4-18.6 14.3-33.6 35.9-6.6 9.5-11.6 15.4-19 22.2l-10 9.3v-6.4c0-5.9.2-6.4 2.6-7.3 5.4-1.9 8.1-7.7 4-8.8-1.9-.5-1.9-.7.6-7.7 3.8-10.7 7.7-17.8 11.9-21.9 3.4-3.3 4.4-3.7 8.5-3.6 5.7.2 7.5-.7 5.7-2.8-2.1-2.6-11.4-1.1-15 2.4-5.3 5-11.5 15.7-13.2 22.5-.9 3.9-2.8 3.5-2.2-.5.3-1.7.8-5.2 1.1-7.7.3-2.5.9-6.3 1.2-8.5 1.1-7.9 5.3-22.7 7.5-26.3 2.7-4.6 3.6-5.2 7.1-5.2 3.1 0 6.7-1.6 6.7-3 0-.5-.7-1.6-1.6-2.4-1.9-1.9-5.8-1.4-9.4 1.2-6.2 4.5-12.7 25.1-13.7 43.7-.3 6-.7 11.2-.9 11.4-.2.2-2.1.3-4.1.2-2.1-.2-4.5-.3-5.4-.3-.9 0-2-1.6-2.9-4.6-2.1-7.1-8.5-17.3-13.4-21.4-4.1-3.3-14.6-3.5-14.6-.2 0 1.5 1.1 1.7 7.1 1.4 6.4-.3 11.7 5.8 17.8 20.7 3.7 9.1 4.7 13.5 3 13.1-2.7-.6-2.1 3.9.8 6.3 2.7 2.3 2.8 2.7 2.3 8.4l-.5 6-4.5-4.2c-3.4-3.1-6.3-7.6-11.4-17.9-8.7-17.4-13.1-23.8-21.4-31.1-10.2-8.9-24-23-26.9-27.4-1.4-2.1-2.8-3.9-3-3.9-1.6 0-4.5 2.5-5.8 5-.9 1.7-1.9 3-2.3 3-1.1 0-12.8-17.8-15-22.8-2.3-5.1-3.1-4.4-5.5 4.3-2.3 8.3-2.8 12.6-2.8 22.6 0 8 .3 11.5 1.7 18.2.5 2.5.3 2.8-1.2 2.4-2.4-.7-12.8-1.6-26.2-2.2-9-.4-10.2-.3-10.2 1.2 0 3.4 10.5 14.5 24 25.5 4.1 3.4 7.4 6.5 7.2 7-.1.5.2.7.7.4.5-.4 1.5-.1 2.3.6 2.4 2.3 7.3 5.5 9.3 6.2 1.1.3 3.1 1.5 4.5 2.6 1.9 1.4 2.2 2.2 1.3 3.1-1.4 1.4-.6 3.9 1.2 3.9.7 0 1.9-.8 2.6-1.7 1.2-1.4 1.2-1.6 0-.8-1 .6-1.2.4-.6-.5.5-.9.4-1.1-.4-.6-.6.4-.9 1.2-.6 1.7.4.5.2.9-.4.9-2 0-2.1-1.9-.2-2.9 1.5-.8 2.3-.7 3.4.4.8.8 1.8 1.1 2.2.7.4-.4.6-.3.5.3-.4 2 0 3 .8 1.7.6-.9 1.3-.7 2.9.7 1.1 1.1 2.3 1.8 2.6 1.5.2-.2.9.2 1.5.9.9 1.1.2 1.3-4.1 1.3-5.2-.1-8.3-2-5.7-3.6.8-.5.8-1 .2-1.4-1.1-.7-2.5 2.1-1.6 3.5.6 1-4.7.4-11.1-1.3-2.2-.5-4.7-1.1-5.6-1.3-.8-.2-3.9-1-6.9-1.9-2.9-.9-5.5-1.4-5.7-1.2-.2.2 1.7 3.1 4.2 6.5 5.3 6.9 12.2 13.3 21.2 19.4 5.8 3.9 8.3 6.7 4.7 5.3-1-.4-1.3-.2-.8.6s.1.9-1.2.4c-1-.4-1.5-.4-1.1 0 .4.4-1.9 2.5-5 4.5-17.1 11.3-35.9 37-38.8 53.1l-.7 3.8 5.3.1c31.7.8 43.2-.5 62.9-6.6 16.5-5.2 31.8-14.9 44.6-28.2 3.3-3.5 6-6.4 5.9-6.6-.2-.1.5-.9 1.4-1.9 1.5-1.5 1.6-1.1 1.3 5-.2 3.6-.1 9.1.3 12.1l.7 5.6 2.6-4.5c1.5-2.4 2.7-4.9 2.8-5.5.1-.5.8-3 1.5-5.5 1.6-5.3 1.6-5.6 1.8-9.5.2-3 .2-2.9 1.6 1 .8 2.2 1.5 4.6 1.5 5.3 0 3.2 9.5 20.6 15 27.6 11.8 15.2 28.9 25.8 55.7 34.5 13.4 4.4 39.1 10.6 40 9.8.3-.4.8-4.9 1.1-10.1 1.1-20.8-4.9-41.5-17.2-60-4.9-7.3-14-17.3-19.1-21-1.1-.8-1.8-1.6-1.5-1.8.3-.3 5.9-2.8 12.5-5.8 12.4-5.4 14.5-6.7 14.8-9.1.2-.8.7-2 1.1-2.8.5-.8.5-1.2 0-.8-.5.3-.9-.5-.9-1.8 0-1.9.3-2.1 1.4-1.2 1.1.9 1.3.9.8 0-.9-1.4.2-4.5 1.4-3.7.5.3.9 0 .9-.6 0-.7.6-1 1.3-.7.7.3 2.1-.1 3.1-.9 1.6-1.1 2.4-1.1 5 .2 2.7 1.3 2.8 1.3 1.2 0-2.3-1.9-1.5-3.1 3.9-5.5 2.4-1.1 5-2.5 5.7-3.1.7-.6 3.5-2.6 6.3-4.5 2.7-1.9 4.7-3.5 4.4-3.5-.3 0 1.3-2 3.7-4.4 3.8-4 9.1-12.3 8.2-13.1-.2-.2-1.9-.6-3.8-.9-1.9-.3-4.5-.8-5.6-1-2.8-.6-7.8-1.3-13.9-2.2-2.7-.3-5.5-1-6.2-1.6-.7-.6-1.4-.5-1.8.2-.3.6-1.1.8-1.6.4-.6-.3-.6-1-.1-1.7 1.8-2.3 5.3-13.3 6.6-21.2 1.8-10.3 1.4-23.9-1-30.4-1.7-4.9-6.4-11.2-8.1-11-.4.1-2.8 2.4-5.3 5.2z"/><path d="M113 56.9c-1.5 2.8 1.2 5.1 6 5.1 3.8 0 4 .2 6.9 6.2 3.2 6.9 9.1 30.9 9.1 37.6 0 1.5.5 3.4 1.1 4.2.7 1.1.8-1 .4-7-1.3-17.7-8.2-40.9-13.7-45.5-3.6-3-8.3-3.3-9.8-.6zM39.3 128.5c0 .8.4 1.2.9.9.5-.3.6-1 .3-1.5-.9-1.3-1.2-1.1-1.2.6zM35.6 132.7c-.6 1.4-.5 1.5.5.6.7-.7 1-1.5.7-1.8-.3-.3-.9.2-1.2 1.2zM46 132c0 .5.5 1 1.1 1 .5 0 .7-.5.4-1-.3-.6-.8-1-1.1-1-.2 0-.4.4-.4 1zM283.6 132.7c-.6 1.4-.5 1.5.5.6.7-.7 1-1.5.7-1.8-.3-.3-.9.2-1.2 1.2zM271 133.1c0 .5-.5.7-1.2.3-.7-.4-.8-.3-.4.4.4.6 1.3.9 2.1.6.8-.4 1.2-1 .9-1.5-.7-1.2-1.4-1.1-1.4.2zM43.3 134.5c0 .8.4 1.2.9.9.4-.3.8-.9.8-1.5 0-.5-.4-.9-.8-.9-.5 0-.9.7-.9 1.5zM48.5 134c-.4.6-1.1.7-1.7.4-.7-.4-.8-.2-.4.5.6.9 1.1.9 2.2 0 1.4-1.1 1.8-1.9 1-1.9-.3 0-.8.5-1.1 1zM274.6 134.1c.2.4 1.3.7 2.4.6 2.3-.2 1.7-1-1-1.2-1-.1-1.7.2-1.4.6zM45.4 137.8c.4.3 1.4.7 2.2.8.9.1 1.3 0 1-.4-.4-.3-1.4-.7-2.2-.8-.9-.1-1.3 0-1 .4zM260.1 138.4c-2.1 1.2-2.2 1.4-.5 2 1 .4 1.5.4 1.1 0-.4-.4.1-1.3 1.1-2 2.2-1.7 1.4-1.7-1.7 0zM265.5 138.1c-.3.5.1.6 1 .3 1.1-.5 1.4-.2.9 1.2-.7 2-.6 1.9 1.3-.6 1-1.3.8-1.6-.7-1.7-1.1-.1-2.2.2-2.5.8zM56.3 140.4c-.3.5-.1.6.5.2.6-.3 1.3-.2 1.7.3.3.5 1.4.9 2.5.8 1.4-.1 1.6-.5.9-1.3-1.2-1.4-4.8-1.4-5.6 0zM263.2 142.9c.7.9 1.3 1.8 1.5 2 .1.2.1-.5 0-1.6 0-1.1-.7-2-1.4-2-1 0-1 .4-.1 1.6zM248.2 144.6c-1.6 1.7-1.5 2.1.3 2.1.8 0 1.3-.3 1-.5-.3-.3.3-1 1.1-1.7 1.3-.9 1.4-1.2.2-1.2-.7 0-1.9.6-2.6 1.3zM254.5 144.1c-.4.6-.5 1.2-.2 1.5.2.3.7-.2 1-1.1.7-1.7.1-2-.8-.4zM257.6 147.3c.3 1 .9 1.5 1.2 1.2.3-.3 0-1.1-.7-1.8-1-.9-1.1-.8-.5.6zM251.9 148.7c-1.3 1.6-1.2 1.7.4.4.9-.7 1.7-1.5 1.7-1.7 0-.8-.8-.3-2.1 1.3z"/></svg>

client/static/manifest.json

@@ -1,46 +1,20 @@
 {
-  "background_color": "#fbfbfc",
+  "name": "Wiki.js",
-  "display": "standalone",
+  "short_name": "Wiki.js",
-  "icons": [
-    {
-      "src": "\/favicons\/android-icon-36x36.png",
-      "sizes": "36x36",
-      "type": "image\/png",
-      "density": "0.75"
-    },
-    {
-      "src": "\/favicons\/android-icon-48x48.png",
-      "sizes": "48x48",
-      "type": "image\/png",
-      "density": "1.0"
-    },
-    {
-      "src": "\/favicons\/android-icon-72x72.png",
-      "sizes": "72x72",
-      "type": "image\/png",
-      "density": "1.5"
-    },
-    {
-      "src": "\/favicons\/android-icon-96x96.png",
-      "sizes": "96x96",
-      "type": "image\/png",
-      "density": "2.0"
-    },
-    {
-      "src": "\/favicons\/android-icon-144x144.png",
-      "sizes": "144x144",
-      "type": "image\/png",
-      "density": "3.0"
-    },
-    {
-      "src": "\/favicons\/android-icon-192x192.png",
-      "sizes": "192x192",
-      "type": "image\/png",
-      "density": "4.0"
-    }
-  ],
-  "name": "Wiki",
-  "short_name": "Wiki",
   "start_url": "/",
-  "theme_color": "#0288d1"
+  "icons": [
+      {
+          "src": "/favicons/android-chrome-192x192.png",
+          "sizes": "192x192",
+          "type": "image/png"
+      },
+      {
+          "src": "/favicons/android-chrome-256x256.png",
+          "sizes": "256x256",
+          "type": "image/png"
+      }
+  ],
+  "theme_color": "#1976d2",
+  "background_color": "#1976d2",
+  "display": "standalone"
 }

dev/templates/legacy.pug

@@ -4,9 +4,9 @@ html
     meta(http-equiv='X-UA-Compatible', content='IE=edge')
     meta(charset='UTF-8')
     meta(name='viewport', content='user-scalable=yes, width=device-width, initial-scale=1, maximum-scale=5')
-    meta(name='theme-color', content='#333333')
+    meta(name='theme-color', content='#1976d2')
-    meta(name='msapplication-TileColor', content='#333333')
+    meta(name='msapplication-TileColor', content='#1976d2')
-    meta(name='msapplication-TileImage', content='/favicons/ms-icon-144x144.png')
+    meta(name='msapplication-TileImage', content='/favicons/mstile-150x150.png')
 
     title= pageMeta.title + ' | ' + config.title
 
@@ -20,11 +20,11 @@ html
     meta(property='og:site_name', content=config.title)
 
     //- Favicon
-    each favsize in [57, 60, 72, 76, 114, 120, 144, 152, 180]
+    link(rel='apple-touch-icon', sizes='180x180', href='/apple-touch-icon.png')
-      link(rel='apple-touch-icon', sizes=favsize + 'x' + favsize, href='/favicons/apple-icon-' + favsize + 'x' + favsize + '.png')
     link(rel='icon', type='image/png', sizes='192x192', href='/favicons/android-icon-192x192.png')
-    each favsize in [32, 96, 16]
+    link(rel='icon', type='image/png', sizes='32x32', href='/favicons/favicon-32x32.png')
-      link(rel='icon', type='image/png', sizes=favsize + 'x' + favsize, href='/favicons/favicon-' + favsize + 'x' + favsize + '.png')
+    link(rel='icon', type='image/png', sizes='16x16', href='/favicons/favicon-16x16.png')
+    link(rel='mask-icon', href='/favicons/safari-pinned-tab.svg', color='#1976d2')
     link(rel='manifest', href='/manifest.json')
 
     //- Icon Set

dev/templates/master.pug

@@ -4,9 +4,9 @@ html(lang=siteConfig.lang)
     meta(http-equiv='X-UA-Compatible', content='IE=edge')
     meta(charset='UTF-8')
     meta(name='viewport', content='user-scalable=yes, width=device-width, initial-scale=1, maximum-scale=5')
-    meta(name='theme-color', content='#333333')
+    meta(name='theme-color', content='#1976d2')
-    meta(name='msapplication-TileColor', content='#333333')
+    meta(name='msapplication-TileColor', content='#1976d2')
-    meta(name='msapplication-TileImage', content='/favicons/ms-icon-144x144.png')
+    meta(name='msapplication-TileImage', content='/favicons/mstile-150x150.png')
 
     title= pageMeta.title + ' | ' + config.title
 
@@ -20,11 +20,11 @@ html(lang=siteConfig.lang)
     meta(property='og:site_name', content=config.title)
 
     //- Favicon
-    each favsize in [57, 60, 72, 76, 114, 120, 144, 152, 180]
+    link(rel='apple-touch-icon', sizes='180x180', href='/apple-touch-icon.png')
-      link(rel='apple-touch-icon', sizes=favsize + 'x' + favsize, href='/favicons/apple-icon-' + favsize + 'x' + favsize + '.png')
     link(rel='icon', type='image/png', sizes='192x192', href='/favicons/android-icon-192x192.png')
-    each favsize in [32, 96, 16]
+    link(rel='icon', type='image/png', sizes='32x32', href='/favicons/favicon-32x32.png')
-      link(rel='icon', type='image/png', sizes=favsize + 'x' + favsize, href='/favicons/favicon-' + favsize + 'x' + favsize + '.png')
+    link(rel='icon', type='image/png', sizes='16x16', href='/favicons/favicon-16x16.png')
+    link(rel='mask-icon', href='/favicons/safari-pinned-tab.svg', color='#1976d2')
     link(rel='manifest', href='/manifest.json')
 
     //- Site Properties

dev/templates/setup.pug

@@ -4,17 +4,17 @@ html
     meta(http-equiv='X-UA-Compatible', content='IE=edge')
     meta(charset='UTF-8')
     meta(name='viewport', content='user-scalable=yes, width=device-width, initial-scale=1, maximum-scale=5')
-    meta(name='theme-color', content='#333333')
+    meta(name='theme-color', content='#1976d2')
-    meta(name='msapplication-TileColor', content='#333333')
+    meta(name='msapplication-TileColor', content='#1976d2')
-    meta(name='msapplication-TileImage', content='/favicons/ms-icon-144x144.png')
+    meta(name='msapplication-TileImage', content='/favicons/mstile-150x150.png')
     title Wiki.js Setup
 
     //- Favicon
-    each favsize in [57, 60, 72, 76, 114, 120, 144, 152, 180]
+    link(rel='apple-touch-icon', sizes='180x180', href='/apple-touch-icon.png')
-      link(rel='apple-touch-icon', sizes=favsize + 'x' + favsize, href='/favicons/apple-icon-' + favsize + 'x' + favsize + '.png')
     link(rel='icon', type='image/png', sizes='192x192', href='/favicons/android-icon-192x192.png')
-    each favsize in [32, 96, 16]
+    link(rel='icon', type='image/png', sizes='32x32', href='/favicons/favicon-32x32.png')
-      link(rel='icon', type='image/png', sizes=favsize + 'x' + favsize, href='/favicons/favicon-' + favsize + 'x' + favsize + '.png')
+    link(rel='icon', type='image/png', sizes='16x16', href='/favicons/favicon-16x16.png')
+    link(rel='mask-icon', href='/favicons/safari-pinned-tab.svg', color='#1976d2')
     link(rel='manifest', href='/manifest.json')
 
     //- Site Lang