Files
fiddle/public/browse.html
root 77f64d2862 Add Tailwind CSS toggle, Markdown/WASM modes, and npm import resolution
- Tailwind CSS: toolbar checkbox injects Play CDN into preview, persisted
  per-fiddle via new options JSON column
- Markdown mode: uses marked.js CDN, renders markdown to HTML preview with
  CSS tab for custom styling
- WASM mode: starter template with inline WebAssembly add function, supports
  top-level await via module detection
- npm imports: auto-detect bare import specifiers in module code and inject
  importmap pointing to esm.sh CDN
- Module auto-detection for html-css-js mode (import/export statements)
- DB migration adds options column, server passes through all API endpoints
- All features work across preview, export, and embed
2026-02-26 15:15:53 -06:00

43 lines
1.3 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Fiddle - Browse</title>
<link rel="stylesheet" href="/css/browse.css">
</head>
<body>
<header class="browse-header">
<a href="/" class="logo">Fiddle</a>
<a href="/new" class="btn-new">+ New Fiddle</a>
</header>
<div class="browse-toolbar">
<input type="text" id="search-input" placeholder="Search fiddles..." spellcheck="false">
<select id="filter-framework">
<option value="">All Frameworks</option>
<option value="javascript">HTML/CSS/JS</option>
<option value="typescript">TypeScript</option>
<option value="react">React (JSX)</option>
<option value="react-ts">React + TS</option>
<option value="vue">Vue</option>
<option value="svelte">Svelte</option>
<option value="markdown">Markdown</option>
<option value="wasm">WASM</option>
</select>
<select id="filter-sort">
<option value="updated">Recently Updated</option>
<option value="created">Recently Created</option>
</select>
</div>
<div id="tags-bar" class="tags-bar"></div>
<main id="fiddle-grid" class="fiddle-grid"></main>
<div id="pagination" class="pagination"></div>
<script type="module" src="/js/browse.js"></script>
</body>
</html>