diff --git a/build/webpack.prod.conf.js b/build/webpack.prod.conf.js
index 27ef7add..1ce999de 100644
--- a/build/webpack.prod.conf.js
+++ b/build/webpack.prod.conf.js
@@ -93,6 +93,9 @@ var webpackConfig = merge(baseWebpackConfig, {
       }
     ]),
     new OfflinePlugin({
+      ServiceWorker: {
+        events: true
+      },
       excludes: ['**/.*', '**/*.map', '**/index.html', '**/static/oauth2/callback.html'],
       externals: ['/app', '/oauth2/callback']
     })
diff --git a/src/components/App.vue b/src/components/App.vue
index 79bd17e4..b15f1967 100644
--- a/src/components/App.vue
+++ b/src/components/App.vue
@@ -1,6 +1,6 @@
 <template>
   <splash-screen v-if="!ready"></splash-screen>
-  <div v-else class="app" :class="{'app--loading': loading}">
+  <div v-else class="app">
     <layout></layout>
     <modal v-if="showModal"></modal>
     <notification></notification>
@@ -33,9 +33,6 @@ export default {
     ...mapState([
       'ready',
     ]),
-    loading() {
-      return !this.$store.getters['content/current'].id;
-    },
     showModal() {
       return !!this.$store.getters['modal/config'];
     },
diff --git a/src/components/ButtonBar.vue b/src/components/ButtonBar.vue
index 3e090b0b..9690027a 100644
--- a/src/components/ButtonBar.vue
+++ b/src/components/ButtonBar.vue
@@ -15,6 +15,9 @@
       <div class="button-bar__button" :class="{ 'button-bar__button--on': localSettings.focusMode }" @click="toggleFocusMode()">
         <icon-target></icon-target>
       </div>
+      <div class="button-bar__button" :class="{ 'button-bar__button--on': localSettings.scrollSync }" @click="toggleScrollSync()">
+        <icon-scroll-sync></icon-scroll-sync>
+      </div>
       <div class="button-bar__button" :class="{ 'button-bar__button--on': localSettings.showStatusBar }" @click="toggleStatusBar()">
         <icon-status-bar></icon-status-bar>
       </div>
@@ -35,6 +38,7 @@ export default {
     'toggleSidePreview',
     'toggleStatusBar',
     'toggleFocusMode',
+    'toggleScrollSync',
   ]),
 };
 </script>
diff --git a/src/components/Layout.vue b/src/components/Layout.vue
index 1660ccec..4273ec2d 100644
--- a/src/components/Layout.vue
+++ b/src/components/Layout.vue
@@ -122,17 +122,4 @@ export default {
 .layout__panel--side-bar {
   background-color: #dadada;
 }
-
-.layout__panel--button-bar,
-.layout__panel--status-bar,
-.layout__panel--side-bar,
-.layout__panel--explorer,
-.layout__panel--navigation-bar {
-  .app--loading & > * {
-    opacity: 0.5;
-
-    /* Hack to disable mouse focus */
-    pointer-events: none;
-  }
-}
 </style>
diff --git a/src/components/NavigationBar.vue b/src/components/NavigationBar.vue
index d09d653b..55a93435 100644
--- a/src/components/NavigationBar.vue
+++ b/src/components/NavigationBar.vue
@@ -2,7 +2,7 @@
   <div class="navigation-bar" :class="{'navigation-bar--editor': styles.showEditor}">
     <div class="navigation-bar__inner navigation-bar__inner--left navigation-bar__inner--button">
       <button class="navigation-bar__button button" @click="toggleExplorer()">
-        <icon-folder-open></icon-folder-open>
+        <icon-folder></icon-folder>
       </button>
     </div>
     <div class="navigation-bar__inner navigation-bar__inner--right navigation-bar__inner--button">
@@ -158,7 +158,11 @@ export default {
       }
     },
     pagedownClick(name) {
-      editorSvc.pagedownEditor.uiManager.doClick(name);
+      if (this.$store.getters['content/current'].id &&
+        this.$store.getters['layout/styles'].showEditor
+      ) {
+        editorSvc.pagedownEditor.uiManager.doClick(name);
+      }
     },
     editTitle(toggle) {
       this.titleFocus = toggle;
diff --git a/src/components/SideBar.vue b/src/components/SideBar.vue
index 83cc6f95..d28a25d7 100644
--- a/src/components/SideBar.vue
+++ b/src/components/SideBar.vue
@@ -90,7 +90,7 @@ export default {
   height: 100%;
 
   hr {
-    margin: 10px 15px;
+    margin: 10px 40px;
     display: none;
   }
 
diff --git a/src/components/common/app.scss b/src/components/common/app.scss
index 1d47b712..6b49215e 100644
--- a/src/components/common/app.scss
+++ b/src/components/common/app.scss
@@ -22,6 +22,9 @@ body {
 }
 
 .icon {
+  width: 100%;
+  height: 100%;
+
   * {
     fill: currentColor;
   }
diff --git a/src/components/common/base.scss b/src/components/common/base.scss
index f56afb3c..c1ed422e 100644
--- a/src/components/common/base.scss
+++ b/src/components/common/base.scss
@@ -77,7 +77,6 @@ a {
 }
 
 code,
-kbd,
 pre,
 samp {
   font-family: $font-family-monospace;
@@ -140,13 +139,14 @@ td {
 }
 
 kbd {
+  font-family: $font-family-main;
   background-color: #fff;
   border: 1px solid rgba(63, 63, 63, 0.25);
   border-radius: 3px;
   box-shadow: 0 1px 0 rgba(63, 63, 63, 0.25);
   color: #333;
   display: inline-block;
-  font-size: 0.7em;
+  font-size: 0.8em;
   margin: 0 0.1em;
   padding: 0.1em 0.6em;
   white-space: nowrap;
@@ -159,6 +159,15 @@ abbr {
   }
 }
 
+img {
+  max-width: 100%;
+}
+
+.table-wrapper {
+  max-width: 100%;
+  overflow: auto;
+}
+
 .footnote {
   font-size: 0.8em;
   position: relative;
diff --git a/src/components/modals/SettingsModal.vue b/src/components/modals/SettingsModal.vue
index 252e78dd..3ed1fe94 100644
--- a/src/components/modals/SettingsModal.vue
+++ b/src/components/modals/SettingsModal.vue
@@ -11,7 +11,7 @@
       </div>
       <div class="form-entry">
         <label class="form-entry__label">YAML</label>
-        <div class="form-entry__field">
+        <div class="form-entry__field form-entry__field--code-editor">
           <code-editor v-if="tab === 'custom'" lang="yaml" :value="customSettings" key="custom-settings" @changed="setCustomSettings"></code-editor>
           <code-editor v-else lang="yaml" :value="defaultSettings" disabled="true" key="default-settings"></code-editor>
         </div>
diff --git a/src/data/defaultFileProperties.yml b/src/data/defaultFileProperties.yml
index 80470809..fb3a3969 100644
--- a/src/data/defaultFileProperties.yml
+++ b/src/data/defaultFileProperties.yml
@@ -1,5 +1,6 @@
-### File properties can contain metadata used for your publications (Wordpress, Blogger...).
-### For example:
+# File properties can contain metadata used for your publications (Wordpress, Blogger...).
+
+# For example:
 #title: My article
 #author:
 #tags: Tag 1, Tag 2
@@ -9,21 +10,11 @@
 #status: draft
 #date: YYYY-MM-DD HH:MM:SS
 
-### Extension configuration
+# Extension configuration
 extensions:
 
   # Markdown extensions
   markdown:
-    ### For strict CommonMark:
-    #abbr: false
-    #deflist: false
-    #del: false
-    #footnote: false
-    #linkify: false
-    #sub: false
-    #sup: false
-    #table: false
-    #typographer: false
     abbr: true
     breaks: false
     deflist: true
@@ -35,6 +26,16 @@ extensions:
     sup: true
     table: true
     typographer: true
+    # For strict CommonMark:
+    #abbr: false
+    #deflist: false
+    #del: false
+    #footnote: false
+    #linkify: false
+    #sub: false
+    #sup: false
+    #table: false
+    #typographer: false
 
   # Katex extension
   katex:
diff --git a/src/data/defaultLocalSettings.js b/src/data/defaultLocalSettings.js
index 3ad5f24f..f7d9f280 100644
--- a/src/data/defaultLocalSettings.js
+++ b/src/data/defaultLocalSettings.js
@@ -5,6 +5,7 @@ export default () => ({
   showStatusBar: true,
   showSideBar: false,
   showExplorer: false,
+  scrollSync: true,
   focusMode: false,
   sideBarPanel: 'menu',
   htmlExportTemplate: 'styledHtml',
diff --git a/src/data/defaultSettings.yml b/src/data/defaultSettings.yml
index 037aa8e2..4b0c4a24 100644
--- a/src/data/defaultSettings.yml
+++ b/src/data/defaultSettings.yml
@@ -2,8 +2,6 @@
 fontSizeFactor: 1
 # Adjust maximum text width in editor and preview
 maxWidthFactor: 1
-# Synchronize editor and preview scrollbars
-scrollSync: true
 
 # Editor settings
 editor:
@@ -66,14 +64,14 @@ shortcuts:
   - '<== '
   - '⇐ '
 
-# Default content for newly created files
+# Default content for new files
 newFileContent: |
 
 
 
   > Written with [StackEdit](https://stackedit.io/).
 
-# Default properties for newly created files
+# Default properties for new files
 newFileProperties: |
 #  extensions:
 #    markdown:
diff --git a/src/data/emptyTemplateHelpers.js b/src/data/emptyTemplateHelpers.js
index b0984d4b..5cc3a784 100644
--- a/src/data/emptyTemplateHelpers.js
+++ b/src/data/emptyTemplateHelpers.js
@@ -1,11 +1,16 @@
 /* Add your custom Handlebars helpers here.
 
 For example:
+
 Handlebars.registerHelper('transform', function (options) {
   var result = options.fn(this);
   return new Handlebars.SafeString(
     result.replace(/<pre[^>]*>/g, '<pre class="prettyprint">')
   );
 });
+
+Then use the helper in your template:
+
+{{#transform}}{{{file.content.html}}}{{/transform}}
 */
 
diff --git a/src/data/emptyTemplateValue.html b/src/data/emptyTemplateValue.html
index d5fae404..4a3b6ed2 100644
--- a/src/data/emptyTemplateValue.html
+++ b/src/data/emptyTemplateValue.html
@@ -1,6 +1,7 @@
 <!-- Specify your Handlebars template here.
 
 The following JavaScript context will be passed to the template:
+
 {
   files: [{
     name: 'The filename',
@@ -18,8 +19,10 @@ The following JavaScript context will be passed to the template:
   }]
 }
 
-You can use Handlebars built-in helpers and some custom StackEdit helpers:
+You can use Handlebars built-in helpers and the custom StackEdit ones:
+
 {{#tocToHtml files.0.content.toc}}{{/tocToHtml}} will produce a clickable TOC.
+
 {{#tocToHtml files.0.content.toc 3}}{{/tocToHtml}} will limit the TOC depth to 3.
 -->
 
diff --git a/src/icons/Alert.vue b/src/icons/Alert.vue
index 2b98fd7a..cd0928ac 100644
--- a/src/icons/Alert.vue
+++ b/src/icons/Alert.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M 13,14L 11,14L 11,9.99998L 13,9.99998M 13,18L 11,18L 11,16L 13,16M 1,21L 23,21L 12,1.99998L 1,21 Z "/>
   </svg>
 </template>
diff --git a/src/icons/ArrowLeft.vue b/src/icons/ArrowLeft.vue
index d17730ec..2fc8bf08 100644
--- a/src/icons/ArrowLeft.vue
+++ b/src/icons/ArrowLeft.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 20,11L 20,13L 7.98958,13L 13.4948,18.5052L 12.0806,19.9194L 4.16116,12L 12.0806,4.08058L 13.4948,5.49479L 7.98958,11L 20,11 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 20,11L 20,13L 7.98958,13L 13.4948,18.5052L 12.0806,19.9194L 4.16116,12L 12.0806,4.08058L 13.4948,5.49479L 7.98958,11L 20,11 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Close.vue b/src/icons/Close.vue
index 12784acd..1802bf1c 100644
--- a/src/icons/Close.vue
+++ b/src/icons/Close.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12L19,6.41Z" />
   </svg>
 </template>
diff --git a/src/icons/CodeBraces.vue b/src/icons/CodeBraces.vue
index 20d4a2ba..e77a3ead 100644
--- a/src/icons/CodeBraces.vue
+++ b/src/icons/CodeBraces.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M 8,3C 6.89543,3 6,3.89539 6,5L 6,9C 6,10.1046 5.10457,11 4,11L 3,11L 3,13L 4,13C 5.10457,13 6,13.8954 6,15L 6,19C 6,20.1046 6.92841,20.7321 8,21L 10,21L 10,19L 8,19L 8,14C 8,12.8954 7.10457,12 6,12C 7.10457,12 8,11.1046 8,10L 8,5L 10,5L 10,3M 16,3C 17.1046,3 18,3.89539 18,5L 18,9C 18,10.1046 18.8954,11 20,11L 21,11L 21,13L 20,13C 18.8954,13 18,13.8954 18,15L 18,19C 18,20.1046 17.0716,20.7321 16,21L 14,21L 14,19L 16,19L 16,14C 16,12.8954 16.8954,12 18,12C 16.8954,12 16,11.1046 16,10L 16,5L 14,5L 14,3L 16,3 Z " />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 8,3C 6.89543,3 6,3.89539 6,5L 6,9C 6,10.1046 5.10457,11 4,11L 3,11L 3,13L 4,13C 5.10457,13 6,13.8954 6,15L 6,19C 6,20.1046 6.92841,20.7321 8,21L 10,21L 10,19L 8,19L 8,14C 8,12.8954 7.10457,12 6,12C 7.10457,12 8,11.1046 8,10L 8,5L 10,5L 10,3M 16,3C 17.1046,3 18,3.89539 18,5L 18,9C 18,10.1046 18.8954,11 20,11L 21,11L 21,13L 20,13C 18.8954,13 18,13.8954 18,15L 18,19C 18,20.1046 17.0716,20.7321 16,21L 14,21L 14,19L 16,19L 16,14C 16,12.8954 16.8954,12 18,12C 16.8954,12 16,11.1046 16,10L 16,5L 14,5L 14,3L 16,3 Z " />
   </svg>
 </template>
diff --git a/src/icons/CodeTags.vue b/src/icons/CodeTags.vue
index 2d085d5c..b12e7b01 100644
--- a/src/icons/CodeTags.vue
+++ b/src/icons/CodeTags.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="2.00 2.00 20.00 20.00">
-    <path fill="#0D0E0E" fill-opacity="1" stroke-linejoin="round" d="M 14.6,16.6L 19.2,12L 14.6,7.4L 16,6L 22,12L 16,18L 14.6,16.6 Z M 9.4,16.6L 4.8,12L 9.4,7.4L 8,6L 2,12L 8,18L 9.4,16.6 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="2 2 20 20">
+    <path d="M 14.6,16.6L 19.2,12L 14.6,7.4L 16,6L 22,12L 16,18L 14.6,16.6 Z M 9.4,16.6L 4.8,12L 9.4,7.4L 8,6L 2,12L 8,18L 9.4,16.6 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Delete.vue b/src/icons/Delete.vue
index f250d37e..ca1d02d0 100644
--- a/src/icons/Delete.vue
+++ b/src/icons/Delete.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M19,4H15.5L14.5,3H9.5L8.5,4H5V6H19M6,19C6,20.1 6.9,21 8,21H16C17.1,21 18,20.1 18,19V7H6V19Z" />
   </svg>
 </template>
diff --git a/src/icons/Download.vue b/src/icons/Download.vue
index c9f80165..f49fba9c 100644
--- a/src/icons/Download.vue
+++ b/src/icons/Download.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 4.9994,19.9981L 18.9994,19.9981L 18.9994,17.9981L 4.9994,17.9981M 18.9994,8.99807L 14.9994,8.99807L 14.9994,2.99807L 8.9994,2.99807L 8.9994,8.99807L 4.9994,8.99807L 11.9994,15.9981L 18.9994,8.99807 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 4.9994,19.9981L 18.9994,19.9981L 18.9994,17.9981L 4.9994,17.9981M 18.9994,8.99807L 14.9994,8.99807L 14.9994,2.99807L 8.9994,2.99807L 8.9994,8.99807L 4.9994,8.99807L 11.9994,15.9981L 18.9994,8.99807 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Eye.vue b/src/icons/Eye.vue
index 018d7195..376d0c59 100644
--- a/src/icons/Eye.vue
+++ b/src/icons/Eye.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M 11.9994,8.99813C 10.3424,8.99813 8.99941,10.3411 8.99941,11.9981C 8.99941,13.6551 10.3424,14.9981 11.9994,14.9981C 13.6564,14.9981 14.9994,13.6551 14.9994,11.9981C 14.9994,10.3411 13.6564,8.99813 11.9994,8.99813 Z M 11.9994,16.9981C 9.23841,16.9981 6.99941,14.7591 6.99941,11.9981C 6.99941,9.23714 9.23841,6.99813 11.9994,6.99813C 14.7604,6.99813 16.9994,9.23714 16.9994,11.9981C 16.9994,14.7591 14.7604,16.9981 11.9994,16.9981 Z M 11.9994,4.49813C 6.99741,4.49813 2.72741,7.60915 0.99941,11.9981C 2.72741,16.3871 6.99741,19.4981 11.9994,19.4981C 17.0024,19.4981 21.2714,16.3871 22.9994,11.9981C 21.2714,7.60915 17.0024,4.49813 11.9994,4.49813 Z " />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 11.9994,8.99813C 10.3424,8.99813 8.99941,10.3411 8.99941,11.9981C 8.99941,13.6551 10.3424,14.9981 11.9994,14.9981C 13.6564,14.9981 14.9994,13.6551 14.9994,11.9981C 14.9994,10.3411 13.6564,8.99813 11.9994,8.99813 Z M 11.9994,16.9981C 9.23841,16.9981 6.99941,14.7591 6.99941,11.9981C 6.99941,9.23714 9.23841,6.99813 11.9994,6.99813C 14.7604,6.99813 16.9994,9.23714 16.9994,11.9981C 16.9994,14.7591 14.7604,16.9981 11.9994,16.9981 Z M 11.9994,4.49813C 6.99741,4.49813 2.72741,7.60915 0.99941,11.9981C 2.72741,16.3871 6.99741,19.4981 11.9994,19.4981C 17.0024,19.4981 21.2714,16.3871 22.9994,11.9981C 21.2714,7.60915 17.0024,4.49813 11.9994,4.49813 Z " />
   </svg>
 </template>
diff --git a/src/icons/FileImage.vue b/src/icons/FileImage.vue
index 107bc539..360af230 100644
--- a/src/icons/FileImage.vue
+++ b/src/icons/FileImage.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 12.9994,8.99807L 18.4994,8.99807L 12.9994,3.49807L 12.9994,8.99807 Z M 5.99938,1.99809L 13.9994,1.99809L 19.9994,7.99808L 19.9994,19.9981C 19.9994,21.1021 19.1034,21.9981 17.9994,21.9981L 5.98937,21.9981C 4.88537,21.9981 3.99939,21.1021 3.99939,19.9981L 4.0094,3.99808C 4.0094,2.89407 4.89437,1.99809 5.99938,1.99809 Z M 6,20L 15,20L 18,20L 18,12L 14,16L 12,14L 6,20 Z M 8,9C 6.89543,9 6,9.89543 6,11C 6,12.1046 6.89543,13 8,13C 9.10457,13 10,12.1046 10,11C 10,9.89543 9.10457,9 8,9 Z " />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 12.9994,8.99807L 18.4994,8.99807L 12.9994,3.49807L 12.9994,8.99807 Z M 5.99938,1.99809L 13.9994,1.99809L 19.9994,7.99808L 19.9994,19.9981C 19.9994,21.1021 19.1034,21.9981 17.9994,21.9981L 5.98937,21.9981C 4.88537,21.9981 3.99939,21.1021 3.99939,19.9981L 4.0094,3.99808C 4.0094,2.89407 4.89437,1.99809 5.99938,1.99809 Z M 6,20L 15,20L 18,20L 18,12L 14,16L 12,14L 6,20 Z M 8,9C 6.89543,9 6,9.89543 6,11C 6,12.1046 6.89543,13 8,13C 9.10457,13 10,12.1046 10,11C 10,9.89543 9.10457,9 8,9 Z " />
   </svg>
 </template>
diff --git a/src/icons/FileMultiple.vue b/src/icons/FileMultiple.vue
index a1dd4914..c9a008f1 100644
--- a/src/icons/FileMultiple.vue
+++ b/src/icons/FileMultiple.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path d="M14.63,7.617l4.821,0l-4.821,-4.821l0,4.821Zm-6.136,-6.136l7.012,0l5.259,5.26l0,10.518c0,0.968 -0.785,1.753 -1.753,1.753l-10.527,0c-0.968,0 -1.744,-0.785 -1.744,-1.753l0.009,-14.024c0,-0.968 0.775,-1.754 1.744,-1.754Zm-3.506,3.507l0,15.777l14.024,0l0,1.754l-14.024,0c-0.965,0 -1.753,-0.789 -1.753,-1.754l0,-15.777l1.753,0Z"/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="-1 -1 25 25">
+    <path d="M15,7H20.5L15,1.5V7M8,0H16L22,6V18C22,19.1 21.1,20 20,20H8C6.89,20 6,19.1 6,18V2C6,0.9 6.9,0 8,0M4,4V22H20V24H4C2.9,24 2,23.1 2,22V4H4Z" />
   </svg>
 </template>
diff --git a/src/icons/FilePlus.vue b/src/icons/FilePlus.vue
index d75373ff..2a108120 100644
--- a/src/icons/FilePlus.vue
+++ b/src/icons/FilePlus.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M13,9H18.5L13,3.5V9M6,2H14L20,8V20C20,21.1 19.1,22 18,22H6C4.89,22 4,21.1 4,20V4C4,2.89 4.89,2 6,2M11,15V12H9V15H6V17H9V20H11V17H14V15H11Z" />
   </svg>
 </template>
diff --git a/src/icons/Folder.vue b/src/icons/Folder.vue
new file mode 100644
index 00000000..71f2cf31
--- /dev/null
+++ b/src/icons/Folder.vue
@@ -0,0 +1,5 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M10,4H4C2.89,4 2,4.89 2,6V18C2,19.1 2.9,20 4,20H20C21.1,20 22,19.1 22,18V8C22,6.89 21.1,6 20,6H12L10,4Z" />
+  </svg>
+</template>
diff --git a/src/icons/FolderMultiple.vue b/src/icons/FolderMultiple.vue
index 56795645..d2e5b07a 100644
--- a/src/icons/FolderMultiple.vue
+++ b/src/icons/FolderMultiple.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M22,4H14L12,2H6C4.9,2 4,2.9 4,4V16C4,17.1 4.9,18 6,18H22C23.1,18 24,17.1 24,16V6C24,4.9 23.1,4 22,4M2,6H0V11H0V20C0,21.1 0.9,22 2,22H20V20H2V6Z" />
   </svg>
 </template>
diff --git a/src/icons/FolderOpen.vue b/src/icons/FolderOpen.vue
deleted file mode 100644
index a11cb157..00000000
--- a/src/icons/FolderOpen.vue
+++ /dev/null
@@ -1,5 +0,0 @@
-<template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path d="M 18.9994,19.9981L 3.99939,19.9981C 2.89437,19.9981 1.99939,19.1021 1.99939,17.9981L 2.0094,5.99807C 2.0094,4.89407 2.89437,3.99807 3.99939,3.99807L 9.99939,3.99807L 11.9994,5.99807L 18.9994,5.99808C 20.1034,5.99808 20.9994,6.89407 20.9994,7.99808L 20.9994,8.00001L 3.99939,7.99807L 3.99939,17.9981L 6.14359,10L 23.2141,10L 20.9318,18.5176C 20.7023,19.37 19.9237,19.9981 18.9994,19.9981 Z " />
-  </svg>
-</template>
diff --git a/src/icons/FolderPlus.vue b/src/icons/FolderPlus.vue
index bba3207a..db1814a7 100644
--- a/src/icons/FolderPlus.vue
+++ b/src/icons/FolderPlus.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M10,4L12,6H20C21.1,6 22,6.9 22,8V18C22,19.1 21.1,20 20,20H4C2.89,20 2,19.1 2,18V6C2,4.89 2.89,4 4,4H10M15,9V12H12V14H15V17H17V14H20V12H17V9H15Z" />
   </svg>
 </template>
diff --git a/src/icons/FormatBold.vue b/src/icons/FormatBold.vue
index 34cf0f1c..807b93d9 100644
--- a/src/icons/FormatBold.vue
+++ b/src/icons/FormatBold.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M13.35,17.401l-4.201,0l0,-3.601l4.201,0c0.997,0 1.801,0.805 1.801,1.801c0,0.996 -0.804,1.8 -1.801,1.8m-4.201,-10.802l3.601,0c0.996,0 1.801,0.804 1.801,1.8c0,0.996 -0.805,1.801 -1.801,1.801l-3.601,0m6.722,1.548c1.164,-0.816 1.98,-2.149 1.98,-3.349c0,-2.712 -2.1,-4.801 -4.801,-4.801l-7.502,0l0,16.804l8.45,0c2.521,0 4.454,-2.04 4.454,-4.549c0,-1.825 -1.033,-3.385 -2.581,-4.105Z" style="fill-rule:nonzero;"/>
   </svg>
 </template>
diff --git a/src/icons/FormatHorizontalRule.vue b/src/icons/FormatHorizontalRule.vue
index e5236952..df352828 100644
--- a/src/icons/FormatHorizontalRule.vue
+++ b/src/icons/FormatHorizontalRule.vue
@@ -1,5 +1,5 @@
 <template>
-	<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+	<svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
 		<path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M3,13l5,0l0,-2l-5,0l0,2Zm6.5,0l5,0l0,-2l-5,0l0,2Zm6.5,0l5,0l0,-2l-5,0l0,2Z" />
 	</svg>
 </template>
diff --git a/src/icons/FormatItalic.vue b/src/icons/FormatItalic.vue
index 3cfdb631..d8f4e331 100644
--- a/src/icons/FormatItalic.vue
+++ b/src/icons/FormatItalic.vue
@@ -1,5 +1,5 @@
 <template>
-	<svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+	<svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
 		<path d="M8.617,3.658l0,3.575l2.633,0l-2.075,9.534l-3.325,0l0,3.575l9.533,0l0,-3.575l-2.633,0l2.075,-9.534l3.325,0l0,-3.575l-9.533,0Z" style="fill-rule:nonzero;"/>
 	</svg>
 </template>
diff --git a/src/icons/FormatListBulleted.vue b/src/icons/FormatListBulleted.vue
index 959276ba..0eef6207 100644
--- a/src/icons/FormatListBulleted.vue
+++ b/src/icons/FormatListBulleted.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M7.043,4.695l14.61,0l0,2.087l-14.61,0l0,-2.087m0,8.349l0,-2.088l14.61,0l0,2.088l-14.61,0m-3.131,-8.871c0.866,0 1.566,0.699 1.566,1.565c0,0.867 -0.7,1.566 -1.566,1.566c-0.866,0 -1.565,-0.699 -1.565,-1.566c0,-0.866 0.699,-1.565 1.565,-1.565m0,6.262c0.866,0 1.566,0.699 1.566,1.565c0,0.866 -0.7,1.565 -1.566,1.565c-0.866,0 -1.565,-0.699 -1.565,-1.565c0,-0.866 0.699,-1.565 1.565,-1.565m3.131,8.87l0,-2.087l14.61,0l0,2.087l-14.61,0m-3.131,-2.609c0.866,0 1.566,0.699 1.566,1.566c0,0.866 -0.7,1.565 -1.566,1.565c-0.866,0 -1.565,-0.699 -1.565,-1.565c0,-0.867 0.699,-1.566 1.565,-1.566Z" style="fill-rule:nonzero;"/>
   </svg>
 </template>
diff --git a/src/icons/FormatListNumbers.vue b/src/icons/FormatListNumbers.vue
index e6c5825f..4383c3f3 100644
--- a/src/icons/FormatListNumbers.vue
+++ b/src/icons/FormatListNumbers.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M7.235,13.059l14.825,0l0,-2.118l-14.825,0m0,8.471l14.825,0l0,-2.117l-14.825,0m0,-10.59l14.825,0l0,-2.117l-14.825,0m-5.295,6.353l1.906,0l-1.906,2.224l0,0.953l3.177,0l0,-1.059l-1.906,0l1.906,-2.224l0,-0.953l-3.177,0m1.059,-2.118l1.059,0l0,-4.235l-2.118,0l0,1.059l1.059,0m-1.059,12.707l2.118,0l0,0.529l-1.059,0l0,1.059l1.059,0l0,0.529l-2.118,0l0,1.059l3.177,0l0,-4.235l-3.177,0l0,1.059Z" style="fill-rule:nonzero;"/>
   </svg>
 </template>
diff --git a/src/icons/FormatQuoteClose.vue b/src/icons/FormatQuoteClose.vue
index bb655925..878d0b6f 100644
--- a/src/icons/FormatQuoteClose.vue
+++ b/src/icons/FormatQuoteClose.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M14.446,18.235l2.92,0l1.946,-4.988l0,-7.482l-5.839,0l0,7.482l2.92,0m-10.732,4.988l2.919,0l1.947,-4.988l0,-7.482l-5.839,0l0,7.482l2.919,0l-1.946,4.988Z" style="fill-rule:nonzero;"/>
   </svg>
 </template>
diff --git a/src/icons/FormatSize.vue b/src/icons/FormatSize.vue
index fba58d02..ccd3608f 100644
--- a/src/icons/FormatSize.vue
+++ b/src/icons/FormatSize.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M2.007,12.526l3.156,0l0,7.363l3.155,0l0,-7.363l3.156,0l0,-3.156l-9.467,0m6.311,-5.259l0,3.155l5.26,0l0,12.623l3.156,0l0,-12.623l5.259,0l0,-3.155l-13.675,0Z" style="fill-rule:nonzero;"/>
   </svg>
 </template>
diff --git a/src/icons/FormatStrikethrough.vue b/src/icons/FormatStrikethrough.vue
index 32bb9197..9e604536 100644
--- a/src/icons/FormatStrikethrough.vue
+++ b/src/icons/FormatStrikethrough.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M20.874,12.059l0,1.729l-3.541,0c0.806,1.851 0.766,6.918 -5.026,6.918c-6.721,0.043 -6.463,-5.621 -6.463,-5.621l3.203,0.044c0.024,2.914 2.55,2.914 3.05,2.879c0.516,-0.043 2.444,-0.034 2.598,-2.058c0.064,-0.942 -0.823,-1.66 -1.791,-2.162l-9.778,0l0,-1.729l17.748,0m-2.896,-3.554l-3.211,-0.026c0,0 0.137,-2.395 -2.646,-2.404c-2.783,-0.017 -2.541,1.902 -2.541,2.144c0.032,0.243 0.274,1.436 2.42,2.007l-5.074,0c0,0 -2.816,-5.82 4.057,-6.814c7.027,-1.038 7.011,5.11 6.995,5.093Z" style="fill-rule:nonzero;"/>
   </svg>
 </template>
diff --git a/src/icons/HardDisk.vue b/src/icons/HardDisk.vue
index 9d928125..55b1cf5b 100644
--- a/src/icons/HardDisk.vue
+++ b/src/icons/HardDisk.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M 6,2L 18,2C 19.1046,2 20,2.89543 20,4L 20,20C 20,21.1046 19.1046,22 18,22L 6,22C 4.89543,22 4,21.1046 4,20L 4,4C 4,2.89543 4.89543,2 6,2 Z M 12,4.00001C 8.68629,4.00001 5.99999,6.6863 5.99999,10C 5.99999,13.3137 8.68629,16 12.1022,15.9992L 11.2221,13.7674C 10.946,13.2891 11.1099,12.6775 11.5882,12.4013L 12.4542,11.9013C 12.9325,11.6252 13.5441,11.7891 13.8202,12.2674L 15.7446,14.6884C 17.1194,13.5889 18,11.8973 18,10C 18,6.6863 15.3137,4.00001 12,4.00001 Z M 12,9.00001C 12.5523,9.00001 13,9.44773 13,10C 13,10.5523 12.5523,11 12,11C 11.4477,11 11,10.5523 11,10C 11,9.44773 11.4477,9.00001 12,9.00001 Z M 7,18C 6.44771,18 6,18.4477 6,19C 6,19.5523 6.44771,20 7,20C 7.55228,20 8,19.5523 8,19C 8,18.4477 7.55228,18 7,18 Z M 12.0882,13.2674L 14.5757,19.5759L 17.1738,18.0759L 12.9542,12.7674L 12.0882,13.2674 Z "/>
   </svg>
 </template>
diff --git a/src/icons/HelpCircle.vue b/src/icons/HelpCircle.vue
index 8e6bad45..ceb97b62 100644
--- a/src/icons/HelpCircle.vue
+++ b/src/icons/HelpCircle.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M 15.0661,11.2518L 14.1711,12.1697C 13.4471,12.8937 12.9991,13.4977 12.9991,14.9977L 10.9991,14.9977L 10.9991,14.4977C 10.9991,13.3937 11.4471,12.3937 12.1711,11.6697L 13.4141,10.4117C 13.7751,10.0497 13.9991,9.54974 13.9991,8.99774C 13.9991,7.89374 13.1041,6.99774 11.9991,6.99774C 10.8951,6.99774 9.99908,7.89374 9.99908,8.99774L 7.99908,8.99774C 7.99908,6.78876 9.7901,4.99774 11.9991,4.99774C 14.2091,4.99774 15.9991,6.78876 15.9991,8.99774C 15.9991,9.87775 15.6431,10.6747 15.0661,11.2518 Z M 12.9991,18.9977L 10.9991,18.9977L 10.9991,16.9977L 12.9991,16.9977M 11.9991,1.99774C 6.4761,1.99774 1.99908,6.47473 1.99908,11.9977C 1.99908,17.5217 6.4761,21.9977 11.9991,21.9977C 17.5231,21.9977 21.9991,17.5217 21.9991,11.9977C 21.9991,6.47473 17.5231,1.99774 11.9991,1.99774 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Information.vue b/src/icons/Information.vue
index f6cae1dc..f2a9c4ed 100644
--- a/src/icons/Information.vue
+++ b/src/icons/Information.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M 12.9994,8.99805L 10.9994,8.99805L 10.9994,6.99805L 12.9994,6.99805M 12.9994,16.998L 10.9994,16.998L 10.9994,10.998L 12.9994,10.998M 11.9994,1.99805C 6.47642,1.99805 1.99943,6.47504 1.99943,11.998C 1.99943,17.5211 6.47642,21.998 11.9994,21.998C 17.5224,21.998 21.9994,17.5211 21.9994,11.998C 21.9994,6.47504 17.5224,1.99805 11.9994,1.99805 Z "/>
   </svg>
 </template>
diff --git a/src/icons/LinkVariant.vue b/src/icons/LinkVariant.vue
index 6e7a23a4..39c24fb2 100644
--- a/src/icons/LinkVariant.vue
+++ b/src/icons/LinkVariant.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M 10.5858,13.4142C 10.9763,13.8047 10.9763,14.4379 10.5858,14.8284C 10.1952,15.2189 9.56207,15.2189 9.17154,14.8284C 7.21892,12.8758 7.21892,9.70995 9.17154,7.75733L 9.17157,7.75736L 12.707,4.2219C 14.6596,2.26928 17.8255,2.26929 19.7781,4.2219C 21.7307,6.17452 21.7307,9.34034 19.7781,11.293L 18.2925,12.7785C 18.3008,11.9583 18.1659,11.1368 17.8876,10.355L 18.3639,9.87865C 19.5355,8.70708 19.5355,6.80759 18.3639,5.63602C 17.1923,4.46445 15.2929,4.46445 14.1213,5.63602L 10.5858,9.17155C 9.41419,10.3431 9.41419,12.2426 10.5858,13.4142 Z M 13.4142,9.17155C 13.8047,8.78103 14.4379,8.78103 14.8284,9.17155C 16.781,11.1242 16.781,14.29 14.8284,16.2426L 14.8284,16.2426L 11.2929,19.7782C 9.34026,21.7308 6.17444,21.7308 4.22182,19.7782C 2.26921,17.8255 2.2692,14.6597 4.22182,12.7071L 5.70744,11.2215C 5.69913,12.0417 5.8341,12.8631 6.11234,13.645L 5.63601,14.1213C 4.46444,15.2929 4.46444,17.1924 5.63601,18.3639C 6.80758,19.5355 8.70708,19.5355 9.87865,18.3639L 13.4142,14.8284C 14.5858,13.6568 14.5858,11.7573 13.4142,10.5858C 13.0237,10.1952 13.0237,9.56207 13.4142,9.17155 Z " />
   </svg>
 </template>
diff --git a/src/icons/Login.vue b/src/icons/Login.vue
index f99c5156..31ffcdb8 100644
--- a/src/icons/Login.vue
+++ b/src/icons/Login.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 10,17.25L 10,14L 3.00002,14L 3.00002,10L 10,10L 10,6.75L 15.25,12L 10,17.25 Z M 7.99999,2.00003L 17,2.00005C 18.1045,2.00005 19,2.89546 19,4.00003L 19,20C 19,21.1046 18.1045,22 17,22L 7.99999,22C 6.89542,22 5.99999,21.1046 5.99999,20L 6,16L 7.99999,16L 7.99999,20L 17,20L 17,4.00003L 7.99999,4.00002L 7.99999,8.00001L 6,8.00001L 5.99999,4.00002C 5.99999,2.89545 6.89542,2.00003 7.99999,2.00003 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Logout.vue b/src/icons/Logout.vue
index 3f0be0d6..3c4564be 100644
--- a/src/icons/Logout.vue
+++ b/src/icons/Logout.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 16.9999,17.25L 16.9999,14L 9.99998,14L 9.99998,10L 16.9999,10L 16.9999,6.75L 22.2499,12L 16.9999,17.25 Z M 13,2.00002C 14.1046,2.00002 15,2.89545 15,4.00002L 15,8L 13,8L 13,4.00002L 4,4.00004L 4,20L 13,20L 13,16L 15,16L 15,20C 15,21.1046 14.1046,22 13,22L 4,22C 2.89543,22 2,21.1046 2,20L 2,4.00004C 2,2.89547 2.89543,2.00006 4,2.00006L 13,2.00002 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Menu.vue b/src/icons/Menu.vue
index 44a53f13..461e3b90 100644
--- a/src/icons/Menu.vue
+++ b/src/icons/Menu.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 3,6L 21,6L 21,8L 3,8L 3,6 Z M 3,11L 21,11L 21,13L 3,13L 3,11 Z M 3,16L 21,16L 21,18L 3,18L 3,16 Z "/>
   </svg>
 </template>
diff --git a/src/icons/NavigationBar.vue b/src/icons/NavigationBar.vue
index bd096ae1..6e40d086 100644
--- a/src/icons/NavigationBar.vue
+++ b/src/icons/NavigationBar.vue
@@ -1,6 +1,6 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="miter" d="M19,8.977l-14,0l0,10l14,0m0,2l-14,0c-1.104,0 -2,-0.896 -2,-2l0,-10c0,-1.105 0.896,-2 2,-2l14,0c1.105,0 2,0.895 2,2l0,10c0,1.104 -0.895,2 -2,2Z" />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M19,8.977l-14,0l0,10l14,0m0,2l-14,0c-1.104,0 -2,-0.896 -2,-2l0,-10c0,-1.105 0.896,-2 2,-2l14,0c1.105,0 2,0.895 2,2l0,10c0,1.104 -0.895,2 -2,2Z" />
     <rect x="3" y="3.023" width="18" height="2" />
   </svg>
 </template>
diff --git a/src/icons/OpenInNew.vue b/src/icons/OpenInNew.vue
index ac0a4a43..04ba2eca 100644
--- a/src/icons/OpenInNew.vue
+++ b/src/icons/OpenInNew.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M 14,3L 14,5L 17.59,5L 7.76,14.83L 9.17,16.24L 19,6.41L 19,10L 21,10L 21,3M 19,19L 5,19L 5,5L 12,5L 12,3L 5,3C 3.89,3 3,3.9 3,5L 3,19C 3,20.1 3.89,21 5,21L 19,21C 20.1,21 21,20.1 21,19L 21,12L 19,12L 19,19 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Pen.vue b/src/icons/Pen.vue
index f336e105..01a25911 100644
--- a/src/icons/Pen.vue
+++ b/src/icons/Pen.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 16.8363,2.73375C 16.45,2.73375 16.0688,2.88125 15.7712,3.17375L 13.6525,5.2925L 18.955,10.5962L 21.0737,8.47625C 21.665,7.89 21.665,6.94375 21.0737,6.3575L 17.895,3.17375C 17.6025,2.88125 17.2163,2.73375 16.8363,2.73375 Z M 12.9437,6.00125L 4.84375,14.1062L 7.4025,14.39L 7.57875,16.675L 9.85875,16.85L 10.1462,19.4088L 18.2475,11.3038M 4.2475,15.0437L 2.515,21.7337L 9.19875,19.9412L 8.955,17.7838L 6.645,17.6075L 6.465,15.2925"/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 16.8363,2.73375C 16.45,2.73375 16.0688,2.88125 15.7712,3.17375L 13.6525,5.2925L 18.955,10.5962L 21.0737,8.47625C 21.665,7.89 21.665,6.94375 21.0737,6.3575L 17.895,3.17375C 17.6025,2.88125 17.2163,2.73375 16.8363,2.73375 Z M 12.9437,6.00125L 4.84375,14.1062L 7.4025,14.39L 7.57875,16.675L 9.85875,16.85L 10.1462,19.4088L 18.2475,11.3038M 4.2475,15.0437L 2.515,21.7337L 9.19875,19.9412L 8.955,17.7838L 6.645,17.6075L 6.465,15.2925"/>
   </svg>
 </template>
diff --git a/src/icons/ScrollSync.vue b/src/icons/ScrollSync.vue
new file mode 100644
index 00000000..162b6fc3
--- /dev/null
+++ b/src/icons/ScrollSync.vue
@@ -0,0 +1,5 @@
+<template>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M4.037,6l3.5,-3.5l3.5,3.5l-2.5,0l0,12l2.5,0l-3.5,3.5l-3.5,-3.5l2.5,0l0,-12l-2.5,0Zm8.926,0l3.5,-3.5l3.5,3.5l-2.5,0l0,12l2.5,0l-3.5,3.5l-3.5,-3.5l2.5,0l0,-12l-2.5,0Z"/>
+  </svg>
+</template>
diff --git a/src/icons/Settings.vue b/src/icons/Settings.vue
index e0cf49ad..7f99b66a 100644
--- a/src/icons/Settings.vue
+++ b/src/icons/Settings.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 11.9994,15.498C 10.0664,15.498 8.49939,13.931 8.49939,11.998C 8.49939,10.0651 10.0664,8.49805 11.9994,8.49805C 13.9324,8.49805 15.4994,10.0651 15.4994,11.998C 15.4994,13.931 13.9324,15.498 11.9994,15.498 Z M 19.4284,12.9741C 19.4704,12.6531 19.4984,12.329 19.4984,11.998C 19.4984,11.6671 19.4704,11.343 19.4284,11.022L 21.5414,9.36804C 21.7294,9.21606 21.7844,8.94604 21.6594,8.73004L 19.6594,5.26605C 19.5354,5.05005 19.2734,4.96204 19.0474,5.04907L 16.5584,6.05206C 16.0424,5.65607 15.4774,5.32104 14.8684,5.06903L 14.4934,2.41907C 14.4554,2.18103 14.2484,1.99805 13.9994,1.99805L 9.99939,1.99805C 9.74939,1.99805 9.5434,2.18103 9.5054,2.41907L 9.1304,5.06805C 8.52039,5.32104 7.95538,5.65607 7.43939,6.05206L 4.95139,5.04907C 4.7254,4.96204 4.46338,5.05005 4.33939,5.26605L 2.33939,8.73004C 2.21439,8.94604 2.26938,9.21606 2.4574,9.36804L 4.5694,11.022C 4.5274,11.342 4.49939,11.6671 4.49939,11.998C 4.49939,12.329 4.5274,12.6541 4.5694,12.9741L 2.4574,14.6271C 2.26938,14.78 2.21439,15.05 2.33939,15.2661L 4.33939,18.73C 4.46338,18.946 4.7254,19.0341 4.95139,18.947L 7.4404,17.944C 7.95639,18.34 8.52139,18.675 9.1304,18.9271L 9.5054,21.577C 9.5434,21.8151 9.74939,21.998 9.99939,21.998L 13.9994,21.998C 14.2484,21.998 14.4554,21.8151 14.4934,21.577L 14.8684,18.9271C 15.4764,18.6741 16.0414,18.34 16.5574,17.9431L 19.0474,18.947C 19.2734,19.0341 19.5354,18.946 19.6594,18.73L 21.6594,15.2661C 21.7844,15.05 21.7294,14.78 21.5414,14.6271L 19.4284,12.9741 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 11.9994,15.498C 10.0664,15.498 8.49939,13.931 8.49939,11.998C 8.49939,10.0651 10.0664,8.49805 11.9994,8.49805C 13.9324,8.49805 15.4994,10.0651 15.4994,11.998C 15.4994,13.931 13.9324,15.498 11.9994,15.498 Z M 19.4284,12.9741C 19.4704,12.6531 19.4984,12.329 19.4984,11.998C 19.4984,11.6671 19.4704,11.343 19.4284,11.022L 21.5414,9.36804C 21.7294,9.21606 21.7844,8.94604 21.6594,8.73004L 19.6594,5.26605C 19.5354,5.05005 19.2734,4.96204 19.0474,5.04907L 16.5584,6.05206C 16.0424,5.65607 15.4774,5.32104 14.8684,5.06903L 14.4934,2.41907C 14.4554,2.18103 14.2484,1.99805 13.9994,1.99805L 9.99939,1.99805C 9.74939,1.99805 9.5434,2.18103 9.5054,2.41907L 9.1304,5.06805C 8.52039,5.32104 7.95538,5.65607 7.43939,6.05206L 4.95139,5.04907C 4.7254,4.96204 4.46338,5.05005 4.33939,5.26605L 2.33939,8.73004C 2.21439,8.94604 2.26938,9.21606 2.4574,9.36804L 4.5694,11.022C 4.5274,11.342 4.49939,11.6671 4.49939,11.998C 4.49939,12.329 4.5274,12.6541 4.5694,12.9741L 2.4574,14.6271C 2.26938,14.78 2.21439,15.05 2.33939,15.2661L 4.33939,18.73C 4.46338,18.946 4.7254,19.0341 4.95139,18.947L 7.4404,17.944C 7.95639,18.34 8.52139,18.675 9.1304,18.9271L 9.5054,21.577C 9.5434,21.8151 9.74939,21.998 9.99939,21.998L 13.9994,21.998C 14.2484,21.998 14.4554,21.8151 14.4934,21.577L 14.8684,18.9271C 15.4764,18.6741 16.0414,18.34 16.5574,17.9431L 19.0474,18.947C 19.2734,19.0341 19.5354,18.946 19.6594,18.73L 21.6594,15.2661C 21.7844,15.05 21.7294,14.78 21.5414,14.6271L 19.4284,12.9741 Z "/>
   </svg>
 </template>
diff --git a/src/icons/SidePreview.vue b/src/icons/SidePreview.vue
index d8f703a0..90734db0 100644
--- a/src/icons/SidePreview.vue
+++ b/src/icons/SidePreview.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="miter" d="M11,20.977l-6,0c-1.104,0 -2,-0.896 -2,-2l0,-14c0,-1.105 0.896,-2 2,-2l14,0c1.105,0 2,0.895 2,2l0,14c0,1.104 -0.895,2 -2,2l-6,0l0,0.023l-2,0l0,-0.023Zm0,-2l0,-14l-6,0l0,14l6,0Zm8,-14l-6,0l0,14l6,0l0,-14Z" />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M11,20.977l-6,0c-1.104,0 -2,-0.896 -2,-2l0,-14c0,-1.105 0.896,-2 2,-2l14,0c1.105,0 2,0.895 2,2l0,14c0,1.104 -0.895,2 -2,2l-6,0l0,0.023l-2,0l0,-0.023Zm0,-2l0,-14l-6,0l0,14l6,0Zm8,-14l-6,0l0,14l6,0l0,-14Z" />
   </svg>
 </template>
diff --git a/src/icons/SignalOff.vue b/src/icons/SignalOff.vue
index 255b5fb8..4eb3d299 100644
--- a/src/icons/SignalOff.vue
+++ b/src/icons/SignalOff.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M 18,3L 18,16.1777L 21,19.1777L 21,3L 18,3 Z M 4.27734,5L 3,6.2676L 10.7324,14L 8,14L 8,21L 11,21L 11,14.2676L 13,16.2676L 13,21L 16,21L 16,19.2676L 19.7324,23L 21,21.7227L 4.27734,5 Z M 13,9L 13,11.1777L 16,14.1777L 16,9L 13,9 Z M 3,18L 3,21L 6,21L 6,18L 3,18 Z "/>
   </svg>
 </template>
diff --git a/src/icons/StatusBar.vue b/src/icons/StatusBar.vue
index dc9b013b..ad5ac2c7 100644
--- a/src/icons/StatusBar.vue
+++ b/src/icons/StatusBar.vue
@@ -1,6 +1,6 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="miter" d="M19,15.023l-14,0l0,-10l14,0m0,-2l-14,0c-1.104,0 -2,0.896 -2,2l0,10c0,1.105 0.896,2 2,2l14,0c1.105,0 2,-0.895 2,-2l0,-10c0,-1.104 -0.895,-2 -2,-2Z" />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M19,15.023l-14,0l0,-10l14,0m0,-2l-14,0c-1.104,0 -2,0.896 -2,2l0,10c0,1.105 0.896,2 2,2l14,0c1.105,0 2,-0.895 2,-2l0,-10c0,-1.104 -0.895,-2 -2,-2Z" />
     <rect x="3" y="18.977" width="18" height="2" />
   </svg>
 </template>
diff --git a/src/icons/Sync.vue b/src/icons/Sync.vue
index 171b7577..e287161e 100644
--- a/src/icons/Sync.vue
+++ b/src/icons/Sync.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M12,18C8.69,18 6,15.31 6,12C6,11 6.25,10.03 6.7,9.2L5.24,7.74C4.46,8.97 4,10.43 4,12C4,16.42 7.58,20 12,20V23L16,19L12,15M12,4V1L8,5L12,9V6C15.31,6 18,8.69 18,12C18,13 17.75,13.97 17.3,14.8L18.76,16.26C19.54,15.03 20,13.57 20,12C20,7.58 16.42,4 12,4Z" />
   </svg>
 </template>
diff --git a/src/icons/SyncOff.vue b/src/icons/SyncOff.vue
index 0c586268..615392c4 100644
--- a/src/icons/SyncOff.vue
+++ b/src/icons/SyncOff.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M20,4H14V10L16.24,7.76C17.32,8.85 18,10.34 18,12C18,13 17.75,13.94 17.32,14.77L18.78,16.23C19.55,15 20,13.56 20,12C20,9.79 19.09,7.8 17.64,6.36L20,4M2.86,5.41L5.22,7.77C4.45,9 4,10.44 4,12C4,14.21 4.91,16.2 6.36,17.64L4,20H10V14L7.76,16.24C6.68,15.15 6,13.66 6,12C6,11 6.25,10.06 6.68,9.23L14.76,17.31C14.5,17.44 14.26,17.56 14,17.65V19.74C14.79,19.53 15.54,19.2 16.22,18.78L18.58,21.14L19.85,19.87L4.14,4.14L2.86,5.41M10,6.35V4.26C9.2,4.47 8.45,4.8 7.77,5.22L9.23,6.68C9.5,6.56 9.73,6.44 10,6.35Z" />
   </svg>
 </template>
diff --git a/src/icons/Table.vue b/src/icons/Table.vue
index ef551464..df610e82 100644
--- a/src/icons/Table.vue
+++ b/src/icons/Table.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="1.33333" stroke-linejoin="round" d="M 5,4L 19,4C 20.1046,4 21,4.89543 21,6L 21,18C 21,19.1046 20.1046,20 19,20L 5,20C 3.89543,20 3,19.1046 3,18L 3,6C 3,4.89543 3.89543,4 5,4 Z M 5,8L 5,12L 11,12L 11,8L 5,8 Z M 13,8L 13,12L 19,12L 19,8L 13,8 Z M 5,14L 5,18L 11,18L 11,14L 5,14 Z M 13,14L 13,18L 19,18L 19,14L 13,14 Z " />
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 5,4L 19,4C 20.1046,4 21,4.89543 21,6L 21,18C 21,19.1046 20.1046,20 19,20L 5,20C 3.89543,20 3,19.1046 3,18L 3,6C 3,4.89543 3.89543,4 5,4 Z M 5,8L 5,12L 11,12L 11,8L 5,8 Z M 13,8L 13,12L 19,12L 19,8L 13,8 Z M 5,14L 5,18L 11,18L 11,14L 5,14 Z M 13,14L 13,18L 19,18L 19,14L 13,14 Z " />
   </svg>
 </template>
diff --git a/src/icons/Target.vue b/src/icons/Target.vue
index 0cb2d714..9bf2d867 100644
--- a/src/icons/Target.vue
+++ b/src/icons/Target.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 11.0013,2.0025L 11.0013,4.0725C 7.3825,4.53125 4.53125,7.3825 4.0725,11.0012L 2.0025,11.0012L 2.0025,12.9975L 4.0725,12.9975C 4.53125,16.6213 7.3825,19.4675 11.0013,19.9262L 11.0013,22.0025L 12.9975,22.0025L 12.9975,19.9313C 16.6212,19.4675 19.4675,16.6213 19.9263,12.9975L 22.0025,12.9975L 22.0025,11.0012L 19.9312,11.0012C 19.4675,7.3825 16.6212,4.53125 12.9975,4.0725L 12.9975,2.0025M 11.0013,6.08375L 11.0013,7.9975L 12.9975,7.9975L 12.9975,6.08875C 15.5175,6.51375 17.485,8.48625 17.915,11.0012L 16.0012,11.0012L 16.0012,12.9975L 17.91,12.9975C 17.485,15.5175 15.5125,17.485 12.9975,17.915L 12.9975,16.0012L 11.0013,16.0012L 11.0013,17.91C 8.48625,17.485 6.51375,15.5125 6.08375,12.9975L 7.9975,12.9975L 7.9975,11.0012L 6.08875,11.0012C 6.51375,8.48625 8.48625,6.51375 11.0013,6.08375 Z M 12.0025,11.0012C 11.445,11.0012 11.0013,11.445 11.0013,12.0025C 11.0013,12.5538 11.445,12.9975 12.0025,12.9975C 12.5537,12.9975 12.9975,12.5538 12.9975,12.0025C 12.9975,11.445 12.5537,11.0012 12.0025,11.0012 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 11.0013,2.0025L 11.0013,4.0725C 7.3825,4.53125 4.53125,7.3825 4.0725,11.0012L 2.0025,11.0012L 2.0025,12.9975L 4.0725,12.9975C 4.53125,16.6213 7.3825,19.4675 11.0013,19.9262L 11.0013,22.0025L 12.9975,22.0025L 12.9975,19.9313C 16.6212,19.4675 19.4675,16.6213 19.9263,12.9975L 22.0025,12.9975L 22.0025,11.0012L 19.9312,11.0012C 19.4675,7.3825 16.6212,4.53125 12.9975,4.0725L 12.9975,2.0025M 11.0013,6.08375L 11.0013,7.9975L 12.9975,7.9975L 12.9975,6.08875C 15.5175,6.51375 17.485,8.48625 17.915,11.0012L 16.0012,11.0012L 16.0012,12.9975L 17.91,12.9975C 17.485,15.5175 15.5125,17.485 12.9975,17.915L 12.9975,16.0012L 11.0013,16.0012L 11.0013,17.91C 8.48625,17.485 6.51375,15.5125 6.08375,12.9975L 7.9975,12.9975L 7.9975,11.0012L 6.08875,11.0012C 6.51375,8.48625 8.48625,6.51375 11.0013,6.08375 Z M 12.0025,11.0012C 11.445,11.0012 11.0013,11.445 11.0013,12.0025C 11.0013,12.5538 11.445,12.9975 12.0025,12.9975C 12.5537,12.9975 12.9975,12.5538 12.9975,12.0025C 12.9975,11.445 12.5537,11.0012 12.0025,11.0012 Z "/>
   </svg>
 </template>
diff --git a/src/icons/Toc.vue b/src/icons/Toc.vue
index 09470cba..ea38dee7 100644
--- a/src/icons/Toc.vue
+++ b/src/icons/Toc.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
     <path d="M3 9h14V7H3v2zm0 4h14v-2H3v2zm0 4h14v-2H3v2zm16 0h2v-2h-2v2zm0-10v2h2V7h-2zm0 6h2v-2h-2v2z"/>
   </svg>
 </template>
diff --git a/src/icons/Upload.vue b/src/icons/Upload.vue
index 26ab37d0..8de403f3 100644
--- a/src/icons/Upload.vue
+++ b/src/icons/Upload.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-width="0.2" stroke-linejoin="round" d="M 8.99939,15.998L 8.99939,9.99805L 4.99939,9.99805L 11.9994,2.99805L 18.9994,9.99805L 14.9994,9.99805L 14.9994,15.998L 8.99939,15.998 Z M 4.99937,19.9981L 4.99937,17.9981L 18.9994,17.9981L 18.9994,19.9981L 4.99937,19.9981 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 8.99939,15.998L 8.99939,9.99805L 4.99939,9.99805L 11.9994,2.99805L 18.9994,9.99805L 14.9994,9.99805L 14.9994,15.998L 8.99939,15.998 Z M 4.99937,19.9981L 4.99937,17.9981L 18.9994,17.9981L 18.9994,19.9981L 4.99937,19.9981 Z "/>
   </svg>
 </template>
diff --git a/src/icons/ViewList.vue b/src/icons/ViewList.vue
index ab665d9b..8094fa33 100644
--- a/src/icons/ViewList.vue
+++ b/src/icons/ViewList.vue
@@ -1,5 +1,5 @@
 <template>
-  <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="100%" height="100%" viewBox="0 0 24.00 24.00">
-    <path fill="#000000" fill-opacity="1" stroke-linejoin="round" d="M 9,5L 9,9L 21,9L 21,5M 9,19L 21,19L 21,15L 9,15M 9,14L 21,14L 21,10L 9,10M 4,9L 8,9L 8,5L 4,5M 4,19L 8,19L 8,15L 4,15M 4,14L 8,14L 8,10L 4,10L 4,14 Z "/>
+  <svg xmlns="http://www.w3.org/2000/svg" class="icon" viewBox="0 0 24 24">
+    <path d="M 9,5L 9,9L 21,9L 21,5M 9,19L 21,19L 21,15L 9,15M 9,14L 21,14L 21,10L 9,10M 4,9L 8,9L 8,5L 4,5M 4,19L 8,19L 8,15L 4,15M 4,14L 8,14L 8,10L 4,10L 4,14 Z "/>
   </svg>
 </template>
diff --git a/src/icons/index.js b/src/icons/index.js
index 4f59dfd0..d86bf528 100644
--- a/src/icons/index.js
+++ b/src/icons/index.js
@@ -21,7 +21,6 @@ import FileMultiple from './FileMultiple';
 import FolderPlus from './FolderPlus';
 import Delete from './Delete';
 import Close from './Close';
-import FolderOpen from './FolderOpen';
 import Pen from './Pen';
 import Target from './Target';
 import ArrowLeft from './ArrowLeft';
@@ -41,6 +40,8 @@ import OpenInNew from './OpenInNew';
 import Information from './Information';
 import Alert from './Alert';
 import SignalOff from './SignalOff';
+import Folder from './Folder';
+import ScrollSync from './ScrollSync';
 
 Vue.component('iconProvider', Provider);
 Vue.component('iconFormatBold', FormatBold);
@@ -64,7 +65,6 @@ Vue.component('iconFileMultiple', FileMultiple);
 Vue.component('iconFolderPlus', FolderPlus);
 Vue.component('iconDelete', Delete);
 Vue.component('iconClose', Close);
-Vue.component('iconFolderOpen', FolderOpen);
 Vue.component('iconPen', Pen);
 Vue.component('iconTarget', Target);
 Vue.component('iconArrowLeft', ArrowLeft);
@@ -84,3 +84,5 @@ Vue.component('iconOpenInNew', OpenInNew);
 Vue.component('iconInformation', Information);
 Vue.component('iconAlert', Alert);
 Vue.component('iconSignalOff', SignalOff);
+Vue.component('iconFolder', Folder);
+Vue.component('iconScrollSync', ScrollSync);
diff --git a/src/index.js b/src/index.js
index 5e07a638..c3822e38 100644
--- a/src/index.js
+++ b/src/index.js
@@ -5,9 +5,28 @@ import './services/optional';
 import './icons/';
 import App from './components/App';
 import store from './store';
+import localDbSvc from './services/localDbSvc';
 
 if (NODE_ENV === 'production') {
-  OfflinePluginRuntime.install();
+  OfflinePluginRuntime.install({
+    onUpdateReady: () => {
+      // Tells to new SW to take control immediately
+      OfflinePluginRuntime.applyUpdate();
+    },
+    onUpdated: () => {
+      localDbSvc.sync()
+        .then(() => {
+          localStorage.updated = true;
+          // Reload the webpage to load into the new version
+          window.location.reload();
+        });
+    },
+  });
+}
+
+if (localStorage.updated) {
+  store.dispatch('notification/info', 'StackEdit has just updated itself!');
+  setTimeout(() => localStorage.removeItem('updated'), 2000);
 }
 
 Vue.config.productionTip = false;
diff --git a/src/services/networkSvc.js b/src/services/networkSvc.js
index 8aff39b6..46368078 100644
--- a/src/services/networkSvc.js
+++ b/src/services/networkSvc.js
@@ -149,7 +149,7 @@ export default {
 
         xhr.onload = () => {
           if (offlineCheck) {
-            store.commit('setOffline', false);
+            isConnectionDown = false;
           }
           clearTimeout(timeoutId);
           const result = {
@@ -174,6 +174,7 @@ export default {
         xhr.onerror = () => {
           clearTimeout(timeoutId);
           if (offlineCheck) {
+            isConnectionDown = true;
             store.commit('setOffline', true);
             reject('You are offline.');
           } else {
@@ -184,6 +185,7 @@ export default {
         timeoutId = setTimeout(() => {
           xhr.abort();
           if (offlineCheck) {
+            isConnectionDown = true;
             store.commit('setOffline', true);
             reject('You are offline.');
           } else {
diff --git a/src/services/optional/scrollSync.js b/src/services/optional/scrollSync.js
index 7eb4649b..fb711385 100644
--- a/src/services/optional/scrollSync.js
+++ b/src/services/optional/scrollSync.js
@@ -35,7 +35,7 @@ function throttle(func, wait) {
 const doScrollSync = () => {
   const localSkipAnimation = skipAnimation || !store.getters['layout/styles'].showSidePreview;
   skipAnimation = false;
-  if (!store.getters['data/computedSettings'].scrollSync || !sectionDescList || sectionDescList.length === 0) {
+  if (!store.getters['data/localSettings'].scrollSync || !sectionDescList || sectionDescList.length === 0) {
     return;
   }
   let editorScrollTop = editorScrollerElt.scrollTop;
@@ -117,7 +117,7 @@ const forceScrollSync = () => {
     doScrollSync();
   }
 };
-store.watch(() => store.getters['data/computedSettings'].scrollSync, forceScrollSync);
+store.watch(() => store.getters['data/localSettings'].scrollSync, forceScrollSync);
 
 editorSvc.$on('inited', () => {
   editorScrollerElt = editorSvc.editorElt.parentNode;
diff --git a/src/services/optional/shortcuts.js b/src/services/optional/shortcuts.js
index ad9ada12..579a231b 100644
--- a/src/services/optional/shortcuts.js
+++ b/src/services/optional/shortcuts.js
@@ -5,7 +5,8 @@ import editorEngineSvc from '../../services/editorEngineSvc';
 import syncSvc from '../../services/syncSvc';
 
 // Skip shortcuts if modal is open or editor is hidden
-Mousetrap.prototype.stopCallback = () => store.getters['modal/config'] || !store.getters['layout/styles'].showEditor;
+Mousetrap.prototype.stopCallback = () => store.getters['modal/config'] ||
+  !store.getters['content/current'].id || !store.getters['layout/styles'].showEditor;
 
 const pagedownHandler = name => () => {
   editorSvc.pagedownEditor.uiManager.doClick(name);
diff --git a/src/store/modules/data.js b/src/store/modules/data.js
index 69c832bd..5c5dd25f 100644
--- a/src/store/modules/data.js
+++ b/src/store/modules/data.js
@@ -68,6 +68,7 @@ module.actions.toggleSideBar = ({ getters, dispatch }, value) => {
   });
 };
 module.actions.toggleExplorer = localSettingsToggler('showExplorer');
+module.actions.toggleScrollSync = localSettingsToggler('scrollSync');
 module.actions.toggleFocusMode = localSettingsToggler('focusMode');
 module.actions.setSideBarPanel = ({ dispatch }, value) => dispatch('patchLocalSettings', {
   sideBarPanel: value === undefined ? 'menu' : value,
diff --git a/src/store/modules/notification.js b/src/store/modules/notification.js
index 623b781b..e2fa1537 100644
--- a/src/store/modules/notification.js
+++ b/src/store/modules/notification.js
@@ -11,16 +11,20 @@ export default {
     },
   },
   actions: {
-    info({ state, commit }, info) {
-      const item = {
+    showItem({ state, commit }, item) {
+      if (state.items.every(other => other.type !== item.type || other.content !== item.content)) {
+        commit('setItems', [...state.items, item]);
+        setTimeout(() =>
+          commit('setItems', state.items.filter(otherItem => otherItem !== item)), itemTimeout);
+      }
+    },
+    info({ dispatch }, info) {
+      dispatch('showItem', {
         type: 'info',
         content: info,
-      };
-      commit('setItems', [item, ...state.items]);
-      setTimeout(() =>
-        commit('setItems', state.items.filter(otherItem => otherItem !== item)), itemTimeout);
+      });
     },
-    error({ state, commit, rootState }, error) {
+    error({ dispatch, rootState }, error) {
       const item = {
         type: 'error',
       };
@@ -41,9 +45,7 @@ export default {
       if (!item.content || item.content === '[object Object]') {
         item.content = 'Unknown error.';
       }
-      commit('setItems', [item, ...state.items]);
-      setTimeout(() =>
-        commit('setItems', state.items.filter(otherItem => otherItem !== item)), itemTimeout);
+      dispatch('showItem', item);
     },
   },
 };