Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Bookmarklet Manager</title> | |
| <meta name="theme-color" content="#0f1014"> | |
| <link rel="manifest" href="manifest.webmanifest"> | |
| <link rel="stylesheet" href="style.css"> | |
| <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&display=swap" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <header> | |
| <div style="flex: 1; margin-right: 30px;"> | |
| <h1>Bookmarklets</h1> | |
| <!-- Search Input --> | |
| <input type="search" id="search-input" placeholder="Search title, code, or tags..." autocomplete="off" | |
| style="width: 100%; max-width: 400px; padding: 10px; margin-bottom: 15px; border-radius: 8px; border: 1px solid #333; background: #0f1014; color: white;"> | |
| <!-- Tag Filter Bar --> | |
| <div id="tag-filter-bar" class="filter-bar"></div> | |
| </div> | |
| <div style="display:flex; gap:10px; align-items: flex-start;"> | |
| <!-- Data Controls --> | |
| <div class="view-toggle"> | |
| <button class="toggle-btn" onclick="downloadData()" title="Download Backup">💾</button> | |
| <button class="toggle-btn" onclick="triggerImport()" title="Import Backup">📂</button> | |
| <button class="toggle-btn" onclick="openUrlModal()" title="Load from URL">🌐</button> | |
| </div> | |
| <button onclick="openNew()" class="btn-primary" style="font-size:1.1rem;">+ New Bookmarklet</button> | |
| </div> | |
| <!-- Hidden Input for File Upload --> | |
| <input type="file" id="import-file" accept=".json" style="display:none" onchange="handleFileImport(this)"> | |
| </header> | |
| <div id="grid" class="grid"></div> | |
| </div> | |
| <!-- Editor Modal --> | |
| <div id="modal" class="modal"> | |
| <div class="wizard-box"> | |
| <button onclick="closeModal()" style="float:right; background:none; border:none; color:#666; cursor:pointer; font-size:1.2rem;">×</button> | |
| <div id="wizard-body"> | |
| <!-- Injected via JS --> | |
| </div> | |
| <div style="display:flex; justify-content:flex-end; margin-top:30px;"> | |
| <button id="save-btn" class="btn-primary" onclick="saveEntry()">Save</button> | |
| </div> | |
| </div> | |
| </div> | |
| <script src="script.js"></script> | |
| <script> | |
| if ('serviceWorker' in navigator) { | |
| window.addEventListener('load', () => { | |
| navigator.serviceWorker.register('sw.js') | |
| .catch(err => console.error('SW registration failed', err)); | |
| }); | |
| } | |
| </script> | |
| </body> | |
| </html> |