added toggle to hide system folders/consistent hover styles

gamosoft · gamosoft · commit 7dd836f53908 · 2026-02-23T10:59:58.000+01:00
diff --git a/documentation/FEATURES.md b/documentation/FEATURES.md
@@ -31,6 +31,7 @@
 - **Alphabetical sorting** - Find notes quickly
 - **Rename anything** - Files and folders, instantly
 - **Visual tree view** - Expandable/collapsible navigation
+- **Hide system folders** - Toggle to hide `_attachments`, `_templates` and other underscore-prefixed folders from sidebar
 
 ## 🔗 Linking & Discovery
 
diff --git a/frontend/app.js b/frontend/app.js
@@ -18,6 +18,7 @@ const LOCAL_SETTINGS = {
     readableLineLength: { key: 'readableLineLength', type: 'boolean', default: true },
     favoritesExpanded: { key: 'favoritesExpanded', type: 'boolean', default: true },
     tagsExpanded: { key: 'tagsExpanded', type: 'boolean', default: false },
+    hideUnderscoreFolders: { key: 'hideUnderscoreFolders', type: 'boolean', default: false },
     // Number settings with validation
     sidebarWidth: { key: 'sidebarWidth', type: 'number', default: CONFIG.DEFAULT_SIDEBAR_WIDTH, min: 200, max: 600 },
     editorWidth: { key: 'editorWidth', type: 'number', default: 50, min: 20, max: 80 },
@@ -209,6 +210,9 @@ function noteApp() {
         // Readable line length (preview max-width)
         readableLineLength: true,
         
+        // Hide underscore-prefixed folders (_attachments, _templates) from sidebar
+        hideUnderscoreFolders: false,
+        
         // Icon rail / panel state
         activePanel: 'files', // 'files', 'search', 'tags', 'settings'
         
@@ -807,6 +811,12 @@ function noteApp() {
             localStorage.setItem('readableLineLength', this.readableLineLength);
         },
         
+        // Hide underscore folders toggle (hides _attachments, _templates, etc. from sidebar)
+        toggleHideUnderscoreFolders() {
+            this.hideUnderscoreFolders = !this.hideUnderscoreFolders;
+            localStorage.setItem('hideUnderscoreFolders', this.hideUnderscoreFolders);
+        },
+        
         // Update syntax highlight overlay (debounced, called on input)
         updateSyntaxHighlight() {
             if (!this.syntaxHighlightEnabled) return;
@@ -1852,9 +1862,7 @@ function noteApp() {
                         ondragleave="window.$root.handleFolderDragLeave(this)"
                         ondrop="window.$root.handleFolderDrop(this, event)"
                         onclick="window.$root.handleFolderClick(this)"
-                        onmouseover="if(!window.$root.draggedItem) this.style.backgroundColor='var(--bg-hover)'"
-                        onmouseout="if(!window.$root.draggedItem) this.style.backgroundColor='transparent'"
-                        class="folder-item px-2 py-1 text-sm relative"
+                        class="folder-item hover-accent px-2 py-1 text-sm relative"
                         style="color: var(--text-primary); cursor: pointer;"
                     >
                         <div class="flex items-center gap-1">
@@ -1909,9 +1917,9 @@ function noteApp() {
                 
                 // First, render child folders (if any)
                 if (folder.children && Object.keys(folder.children).length > 0) {
-                    const children = Object.entries(folder.children).sort((a, b) => 
-                        a[1].name.toLowerCase().localeCompare(b[1].name.toLowerCase())
-                    );
+                    const children = Object.entries(folder.children)
+                        .filter(([k, v]) => !this.hideUnderscoreFolders || !v.name.startsWith('_'))
+                        .sort((a, b) => a[1].name.toLowerCase().localeCompare(b[1].name.toLowerCase()));
                     
                     children.forEach(([childKey, childFolder]) => {
                         html += this.renderFolderRecursive(childFolder, 0, false);
diff --git a/frontend/index.html b/frontend/index.html
@@ -763,6 +763,10 @@
             border-left-color: var(--accent-primary);
         }
         
+        .hover-accent.active:hover {
+            transform: translateX(2px);
+        }
+        
         /* Tag chip - same effect but no margin */
         .tag-chip {
             border-left: 3px solid transparent;
@@ -1586,7 +1590,7 @@
                         </div>
                         
                         <!-- Folders (rendered recursively for unlimited nesting) -->
-                        <template x-for="[folderKey, folder] in Object.entries(folderTree).filter(([k]) => k !== '__root__').sort((a, b) => a[1].name.toLowerCase().localeCompare(b[1].name.toLowerCase()))" :key="folderKey">
+                        <template x-for="[folderKey, folder] in Object.entries(folderTree).filter(([k, v]) => k !== '__root__' && (!hideUnderscoreFolders || !v.name.startsWith('_'))).sort((a, b) => a[1].name.toLowerCase().localeCompare(b[1].name.toLowerCase()))" :key="folderKey">
                             <div x-html="renderFolderRecursive(folder, 0, true)"></div>
                         </template>
                         
@@ -1898,6 +1902,24 @@
                                     <p class="text-xs mt-1" style="color: var(--text-tertiary);" x-text="t('settings.readable_line_length_desc')"></p>
                                 </div>
                                 
+                                <!-- Hide Underscore Folders Toggle -->
+                                <div class="mb-4">
+                                    <label class="flex items-center justify-between cursor-pointer">
+                                        <span class="text-xs font-medium" style="color: var(--text-secondary);" x-text="t('settings.hide_underscore_folders')"></span>
+                                        <div 
+                                            @click="toggleHideUnderscoreFolders()"
+                                            class="relative w-10 h-5 rounded-full transition-colors cursor-pointer"
+                                            :style="hideUnderscoreFolders ? 'background-color: var(--accent-primary)' : 'background-color: var(--bg-tertiary)'"
+                                        >
+                                            <div 
+                                                class="absolute top-0.5 left-0.5 w-4 h-4 rounded-full transition-transform"
+                                                :style="'background-color: var(--bg-primary);' + (hideUnderscoreFolders ? ' transform: translateX(20px);' : '')"
+                                            ></div>
+                                        </div>
+                                    </label>
+                                    <p class="text-xs mt-1" style="color: var(--text-tertiary);" x-text="t('settings.hide_underscore_folders_desc')"></p>
+                                </div>
+                                
                                 <!-- Logout (if auth enabled) - uses authEnabled from main app state -->
                                 <div x-show="authEnabled" class="mb-4">
                                     <label class="block text-xs font-medium mb-2" style="color: var(--text-secondary);" x-text="t('settings.account')"></label>
diff --git a/locales/de-DE.json b/locales/de-DE.json
@@ -239,7 +239,9 @@
     "account": "Konto",
     "logout": "Abmelden",
     "readable_line_length": "Lesbare Zeilenlänge",
-    "readable_line_length_desc": "Vorschaubreite für bessere Lesbarkeit begrenzen"
+    "readable_line_length_desc": "Vorschaubreite für bessere Lesbarkeit begrenzen",
+    "hide_underscore_folders": "Systemordner ausblenden",
+    "hide_underscore_folders_desc": "_attachments, _templates und andere Unterstrich-Ordner ausblenden"
   },
 
   "homepage": {
diff --git a/locales/en-GB.json b/locales/en-GB.json
@@ -238,7 +238,9 @@
     "account": "Account",
     "logout": "Logout",
     "readable_line_length": "Readable line length",
-    "readable_line_length_desc": "Limit preview width for easier reading"
+    "readable_line_length_desc": "Limit preview width for easier reading",
+    "hide_underscore_folders": "Hide system folders",
+    "hide_underscore_folders_desc": "Hide _attachments, _templates and other underscore folders from sidebar"
   },
 
   "homepage": {
diff --git a/locales/en-US.json b/locales/en-US.json
@@ -239,7 +239,9 @@
     "account": "Account",
     "logout": "Logout",
     "readable_line_length": "Readable line length",
-    "readable_line_length_desc": "Limit preview width for easier reading"
+    "readable_line_length_desc": "Limit preview width for easier reading",
+    "hide_underscore_folders": "Hide system folders",
+    "hide_underscore_folders_desc": "Hide _attachments, _templates and other underscore folders from sidebar"
   },
 
   "homepage": {
diff --git a/locales/es-ES.json b/locales/es-ES.json
@@ -239,7 +239,9 @@
     "account": "Cuenta",
     "logout": "Cerrar sesión",
     "readable_line_length": "Longitud de línea legible",
-    "readable_line_length_desc": "Limitar el ancho de vista previa para facilitar la lectura"
+    "readable_line_length_desc": "Limitar el ancho de vista previa para facilitar la lectura",
+    "hide_underscore_folders": "Ocultar carpetas de sistema",
+    "hide_underscore_folders_desc": "Ocultar _attachments, _templates y otras carpetas con guion bajo"
   },
 
   "homepage": {
diff --git a/locales/fr-FR.json b/locales/fr-FR.json
@@ -239,7 +239,9 @@
     "account": "Compte",
     "logout": "Déconnexion",
     "readable_line_length": "Longueur de ligne lisible",
-    "readable_line_length_desc": "Limiter la largeur de l'aperçu pour une lecture plus facile"
+    "readable_line_length_desc": "Limiter la largeur de l'aperçu pour une lecture plus facile",
+    "hide_underscore_folders": "Masquer les dossiers système",
+    "hide_underscore_folders_desc": "Masquer _attachments, _templates et autres dossiers préfixés"
   },
 
   "homepage": {
diff --git a/locales/hu-HU.json b/locales/hu-HU.json
@@ -239,7 +239,9 @@
     "account": "Fiók",
     "logout": "Kijelentkezés",
     "readable_line_length": "Olvasható sorhossz",
-    "readable_line_length_desc": "Korlátozd az előnézeti szélességet a könnyebb olvasás érdekében"
+    "readable_line_length_desc": "Korlátozd az előnézeti szélességet a könnyebb olvasás érdekében",
+    "hide_underscore_folders": "Rendszermappák elrejtése",
+    "hide_underscore_folders_desc": "_attachments, _templates és más aláhúzásos mappák elrejtése"
   },
 
   "homepage": {
diff --git a/locales/it-IT.json b/locales/it-IT.json
@@ -238,7 +238,9 @@
     "account": "Account",
     "logout": "Esci",
     "readable_line_length": "Larghezza riga leggibile",
-    "readable_line_length_desc": "Limita la larghezza dell'anteprima per una lettura più facile"
+    "readable_line_length_desc": "Limita la larghezza dell'anteprima per una lettura più facile",
+    "hide_underscore_folders": "Nascondi cartelle di sistema",
+    "hide_underscore_folders_desc": "Nascondi _attachments, _templates e altre cartelle con underscore"
   },
 
   "homepage": {
diff --git a/locales/ja-JP.json b/locales/ja-JP.json
@@ -238,7 +238,9 @@
     "account": "アカウント",
     "logout": "ログアウト",
     "readable_line_length": "読みやすい行幅",
-    "readable_line_length_desc": "プレビューの幅を制限して読みやすくする"
+    "readable_line_length_desc": "プレビューの幅を制限して読みやすくする",
+    "hide_underscore_folders": "システムフォルダを非表示",
+    "hide_underscore_folders_desc": "_attachments、_templatesなどのフォルダをサイドバーから非表示"
   },
 
   "homepage": {
diff --git a/locales/ru-RU.json b/locales/ru-RU.json
@@ -238,7 +238,9 @@
     "account": "Аккаунт",
     "logout": "Выйти",
     "readable_line_length": "Удобная длина строки",
-    "readable_line_length_desc": "Ограничить ширину предпросмотра для удобства чтения"
+    "readable_line_length_desc": "Ограничить ширину предпросмотра для удобства чтения",
+    "hide_underscore_folders": "Скрыть системные папки",
+    "hide_underscore_folders_desc": "Скрыть _attachments, _templates и другие папки с подчёркиванием"
   },
 
   "homepage": {
diff --git a/locales/sl-SI.json b/locales/sl-SI.json
@@ -238,7 +238,9 @@
     "account": "Račun",
     "logout": "Odjava",
     "readable_line_length": "Berljiva dolžina vrstice",
-    "readable_line_length_desc": "Omejite širino predogleda za lažje branje"
+    "readable_line_length_desc": "Omejite širino predogleda za lažje branje",
+    "hide_underscore_folders": "Skrij sistemske mape",
+    "hide_underscore_folders_desc": "Skrij _attachments, _templates in druge mape s podčrtajem"
   },
 
   "homepage": {
diff --git a/locales/zh-CN.json b/locales/zh-CN.json
@@ -238,7 +238,9 @@
     "account": "账户",
     "logout": "登出",
     "readable_line_length": "可读行宽",
-    "readable_line_length_desc": "限制预览宽度以便于阅读"
+    "readable_line_length_desc": "限制预览宽度以便于阅读",
+    "hide_underscore_folders": "隐藏系统文件夹",
+    "hide_underscore_folders_desc": "从侧边栏隐藏 _attachments、_templates 等下划线文件夹"
   },
 
   "homepage": {
