5 files changed, 29 insertions, 23 deletions

diff --git a/viewer/ldgallery-viewer.7.md b/viewer/ldgallery-viewer.7.md
index c0634b6..736f61f 100644
--- a/viewer/ldgallery-viewer.7.md
+++ b/viewer/ldgallery-viewer.7.md
@@ -2,7 +2,7 @@
 pagetitle: Viewer user manual - ldgallery
 title: LDGALLERY-VIEWER(7) ldgallery
 author: Pacien TRAN-GIRARD, Guillaume FOUET
-date: 2022-09-04 (v2.1)
+date: 2022-10-26 (v2.1-SNAPSHOT)
 ---
 
 
@@ -43,6 +43,13 @@ Items of the following formats can be opened and visualised within the web appli
 Formats which are not listed above or which are not supported by the user's web browser are offered for download instead of being directly displayed in the same window.
 
 
+# KEYBOARD SHORTCUTS
+
+`CTRL-K`
+: Moves the focus to the tag search field, opening the side search panel if it is closed.
+  Pressing again while in the search input field sets the focus to the browser's address bar.
+
+
 # SEARCH QUERIES
 
 Items can be filtered based on their tags.
diff --git a/viewer/src/components/async/AsyncLdMarkdown.vue b/viewer/src/components/async/AsyncLdMarkdown.vue
index 213c11c..c3f368a 100644
--- a/viewer/src/components/async/AsyncLdMarkdown.vue
+++ b/viewer/src/components/async/AsyncLdMarkdown.vue
@@ -40,7 +40,6 @@ const html = computed(() => marked(props.markdown));
 <style lang="scss" module>
 .markdown {
   color: white;
-  line-height: 1.7;
   word-wrap: break-word;
 
   a {
@@ -52,19 +51,10 @@ const html = computed(() => marked(props.markdown));
     background-color: #666;
   }
 
-  p,
-  blockquote,
-  ul,
-  ol,
-  dl,
-  table,
-  pre {
-    margin: 15px 0;
-  }
-
   ul,
   ol {
-    padding-left: 30px;
+    list-style-type: disc;
+    padding-left: 1em;
   }
 
   h1 {
diff --git a/viewer/src/views/MainLayout.vue b/viewer/src/views/MainLayout.vue
index d8b3300..30bfe97 100644
--- a/viewer/src/views/MainLayout.vue
+++ b/viewer/src/views/MainLayout.vue
@@ -26,7 +26,10 @@
     />
     <template v-else-if="galleryStore.config && galleryStore.galleryIndex">
       <LayoutTop :class="[$style.layout, $style.layoutTop]" />
-      <LayoutLeft :class="[$style.layout, $style.layoutLeft]" />
+      <LayoutLeft
+        v-show="!uiStore.fullWidth"
+        :class="[$style.layout, $style.layoutLeft]"
+      />
       <router-view
         ref="content"
         :class="[$style.layout, $style.layoutContent]"
diff --git a/viewer/src/views/layout/left/LayoutInformation.vue b/viewer/src/views/layout/left/LayoutInformation.vue
index 780a458..9dfb311 100644
--- a/viewer/src/views/layout/left/LayoutInformation.vue
+++ b/viewer/src/views/layout/left/LayoutInformation.vue
@@ -67,6 +67,7 @@ const formatDate = computed(() => {
 .infopanel {
   padding: 2px 2px 7px 7px;
   overflow-wrap: break-word;
+  max-height: 50%;
 
   .title {
     font-weight: bold;
@@ -80,13 +81,6 @@ const formatDate = computed(() => {
     > * {
       margin-top: 5px;
     }
-    ul,
-    ol {
-      margin-left: 1em;
-    }
-    ul {
-      list-style-type: disc;
-    }
     a {
       color: $palette-200;
       &:hover {
diff --git a/viewer/src/views/layout/left/LayoutTagInput.vue b/viewer/src/views/layout/left/LayoutTagInput.vue
index a37c546..9ee6f8a 100644
--- a/viewer/src/views/layout/left/LayoutTagInput.vue
+++ b/viewer/src/views/layout/left/LayoutTagInput.vue
@@ -23,7 +23,7 @@
     v-model="search"
     :placeholder="t('tagInput.placeholder')"
     :tabindex="50"
-    @focus="e => (e.target as HTMLInputElement).select()"
+    @focus="(e: FocusEvent) => (e.target as HTMLInputElement).select()"
     @keypress.enter="inputEnter"
     @keydown.backspace="inputBackspace"
   />
@@ -58,7 +58,8 @@ import LdDropdown from '@/components/LdDropdown.vue';
 import LdInput from '@/components/LdInput.vue';
 import { useIndexFactory } from '@/services/indexFactory';
 import { useGalleryStore } from '@/store/galleryStore';
-import { computedEager, useElementBounding, useFocus, useVModel } from '@vueuse/core';
+import { useUiStore } from '@/store/uiStore';
+import { computedEager, onKeyStroke, useElementBounding, useFocus, useKeyModifier, useVModel } from '@vueuse/core';
 import { computed, ref, StyleValue, watchEffect } from 'vue';
 import { useI18n } from 'vue-i18n';
 
@@ -69,6 +70,7 @@ const emit = defineEmits(['update:modelValue', 'search', 'opening', 'closing']);
 const model = useVModel(props, 'modelValue', emit);
 
 const { t } = useI18n();
+const uiStore = useUiStore();
 const galeryStore = useGalleryStore();
 const indexFactory = useIndexFactory();
 
@@ -88,6 +90,16 @@ const { focused } = useFocus(input);
 
 // ---
 
+const controlState = useKeyModifier('Control');
+onKeyStroke('k', e => {
+  if (!controlState.value || focused.value) return;
+  e.preventDefault();
+  uiStore.toggleFullWidth(false);
+  focused.value = true;
+});
+
+// ---
+
 const filteredTags = computed(() => indexFactory.searchTags(galeryStore.tagsIndex, search.value, false)
   .filter(filterAlreadyPresent)
   .sort((a, b) => b.items.length - a.items.length));