Hide explorer toggle button when file explorer panel is open (#19)

Author: arthurkowalsky

RELEASES.md

@@ -1,5 +1,13 @@
 # Releases
 
+## 1.3.1
+
+### Fixes
+- **Angle brackets in tables** — `<` and `>` in table cells and paragraphs no longer break rendering.
+- **File explorer toggle** — Toggle button no longer bleeds through the open explorer panel.
+
+---
+
 ## 1.3.0
 
 ### New features

index.html

@@ -756,7 +756,7 @@
           class="px-4 py-2.5 bg-white border-b border-gray-200 flex items-center justify-between shrink-0"
         >
           <div class="flex items-center gap-2">
-            <button id="explorerToggle" class="opacity-50 hover:opacity-80 text-gray-500 transition-all hidden lg:block relative z-40" title="Toggle file explorer (Ctrl+B)">
+            <button id="explorerToggle" class="opacity-50 hover:opacity-80 text-gray-500 transition-all hidden lg:block" title="Toggle file explorer (Ctrl+B)">
               <svg class="w-3.5 h-3.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                 <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 7v10a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-6l-2-2H5a2 2 0 00-2 2z"/>
               </svg>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "md2docx",
-  "version": "1.3.0",
+  "version": "1.3.1",
   "description": "Professional Markdown to DOCX/PDF/HTML converter",
   "type": "module",
   "scripts": {

src/file-explorer/ui.js

@@ -224,12 +224,6 @@ export function toggleExplorer(forceState) {
     localStorage.setItem("md2docx-explorer-open", _isOpen);
   } catch {}
 
-  const toggleBtn = document.getElementById("explorerToggle");
-  if (toggleBtn) {
-    toggleBtn.style.opacity = _isOpen ? "1" : "";
-    toggleBtn.style.color = _isOpen ? "#f97c00" : "";
-  }
-
   return _isOpen;
 }
 

tests/features/ui/file-explorer.feature

@@ -7,12 +7,12 @@ Feature: File explorer
   Scenario: Explorer panel is hidden by default
     Then the file explorer panel should not be visible
 
-  Scenario: Explorer toggle button opens and closes the panel
+  Scenario: Explorer panel opens via toggle and closes via close button
     When I click the explorer toggle button
     Then the file explorer panel should be visible
     And the file list should contain 1 document
     And the document "main.md" should be listed
-    When I click the explorer toggle button
+    When I click the explorer close button
     Then the file explorer panel should not be visible
 
   Scenario: Ctrl+B outside editor toggles the explorer

tests/steps/file-explorer.steps.js

@@ -18,6 +18,10 @@ When("I click the explorer toggle button", async ({ page }) => {
   await btn.click();
 });
 
+When("I click the explorer close button", async ({ page }) => {
+  await page.locator("#explorerClose").click();
+});
+
 When("I click outside the editor", async ({ page }) => {
   await page.locator("#preview").click({ position: { x: 10, y: 10 } });
   await page.evaluate(() => {