e41c3e7dc4
- Browse dashboard at / with search, framework filter, tag pills, and pagination - Tags system with autocomplete datalist and per-fiddle tag management - Listed/unlisted toggle for visibility control (unlisted still accessible via direct URL) - Export standalone HTML with inlined CSS/JS and framework CDN tags - QR code modal for sharing fiddle URLs - Embed mode at /embed/:id for minimal preview-only rendering - Extract shared loadScript() utility from 4 files into utils.js - Database schema: listed column, tags and fiddle_tags tables with index
41 lines
1.2 KiB
HTML
41 lines
1.2 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>
|
|
</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>
|