style: Improve markdown editor styling and functionality

- Update dark mode button icon and styling
- Add styling for new collection button
- Apply default iframe styles in preview pane
- Adjust vertical divider height in header buttons
- Improve handling of JSX-like attributes in markdown
- Add support for new collection functionality
- Refine file loading logic in view mode
- Improve dark mode toggle icon and integration
- Update UI for edit/view mode toggle button

static/js/dark-mode.js

@@ -16,7 +16,7 @@ class DarkMode {
         this.isDark = !this.isDark;
         localStorage.setItem(Config.STORAGE_KEYS.DARK_MODE, this.isDark);
         this.apply();
-        
+
         Logger.debug(`Dark mode ${this.isDark ? 'enabled' : 'disabled'}`);
     }
 
@@ -27,7 +27,7 @@ class DarkMode {
         if (this.isDark) {
             document.body.classList.add('dark-mode');
             const btn = document.getElementById('darkModeBtn');
-            if (btn) btn.textContent = '☀️';
+            if (btn) btn.innerHTML = '<i class="bi bi-sun-fill"></i>';
 
             // Update mermaid theme
             if (window.mermaid) {
@@ -36,7 +36,7 @@ class DarkMode {
         } else {
             document.body.classList.remove('dark-mode');
             const btn = document.getElementById('darkModeBtn');
-            if (btn) btn.textContent = '🌙';
+            if (btn) btn.innerHTML = '<i class="bi bi-moon-fill"></i>';
 
             // Update mermaid theme
             if (window.mermaid) {