feat: add backslash shortcut to toggle editor panel

Added \ key to toggle the editor panel open/closed:
- Opens to 'document' tab when panel is closed
- Closes panel when it's open
- Updated button tooltips to indicate the keyboard shortcut

Works in all contexts (main document and iframe).

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
isUnknown 2026-01-09 17:10:26 +01:00
parent 8e2f0a10e2
commit 4d39a83a63
2 changed files with 12 additions and 1 deletions

View file

@ -52,6 +52,14 @@ const handleKeyboardShortcut = (event) => {
}
}
// Backslash key - toggle editor panel
if (event.key === '\\') {
event.preventDefault();
// Toggle: if panel is closed, open to 'document' tab; if open, close it
activeTab.value = activeTab.value.length > 0 ? '' : 'document';
return;
}
// Cmd+S (Mac) or Ctrl+S (Windows/Linux) - save
if ((event.metaKey || event.ctrlKey) && event.key === 's') {
event.preventDefault();

View file

@ -6,6 +6,7 @@
class="tab"
:class="{ active: activeTab === 'document' }"
@click="activeTab = 'document'"
title="Ouvrir l'onglet Document (\)"
>
Document
</button>
@ -14,6 +15,7 @@
class="tab"
:class="{ active: activeTab === 'code' }"
@click="activeTab = 'code'"
title="Ouvrir l'onglet Code"
>
Code
</button>
@ -22,6 +24,7 @@
class="tab"
:class="{ active: activeTab === 'contenu' }"
@click="activeTab = 'contenu'"
title="Ouvrir l'onglet Contenu"
>
Contenu
</button>
@ -32,7 +35,7 @@
type="button"
class="close-button"
@click="activeTab = ''"
title="Fermer le panneau"
title="Fermer le panneau (\)"
>
<svg
xmlns="http://www.w3.org/2000/svg"