Stu Leak
16fb407a3c
- Implement full web interface with Go html/template server - Add GX component library (buttons, dialogs, tables, forms, etc.) - Create scene/performer/studio/movie detail and listing pages - Add Adult Empire scraper for additional metadata sources - Implement movie support with database schema - Add import and sync services for data management - Include comprehensive API and frontend documentation - Add custom color scheme and responsive layout 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
68 lines
2.1 KiB
HTML
68 lines
2.1 KiB
HTML
<div style="background:#0A0A0C; padding: 2rem; min-height: 100vh; color:white;">
|
|
|
|
<h2 style="margin-bottom:1rem;">GX Select Demo</h2>
|
|
|
|
<div class="gx-select" id="select-demo">
|
|
<div class="gx-select-trigger">
|
|
<span>Select Performer Tag</span>
|
|
<svg viewBox="0 0 24 24"><path d="M7 10l5 5 5-5H7z"/></svg>
|
|
</div>
|
|
|
|
<div class="gx-select-menu">
|
|
<div class="gx-option">Softcore</div>
|
|
<div class="gx-option">Hardcore</div>
|
|
<div class="gx-option">Solo</div>
|
|
<div class="gx-option">Lesbian</div>
|
|
<div class="gx-option selected">POV</div>
|
|
|
|
<div class="gx-select-divider"></div>
|
|
|
|
<div class="gx-option">VR</div>
|
|
<div class="gx-option disabled">Premium Only</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
|
|
<script>
|
|
/* Pure vanilla JS behavior */
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
const selects = document.querySelectorAll(".gx-select");
|
|
|
|
selects.forEach(select => {
|
|
const trigger = select.querySelector(".gx-select-trigger");
|
|
const menu = select.querySelector(".gx-select-menu");
|
|
const options = select.querySelectorAll(".gx-option");
|
|
|
|
trigger.addEventListener("click", () => {
|
|
select.classList.toggle("open");
|
|
});
|
|
|
|
options.forEach(option => {
|
|
if (option.classList.contains("disabled")) return;
|
|
|
|
option.addEventListener("click", () => {
|
|
// Mark selected option
|
|
options.forEach(o => o.classList.remove("selected"));
|
|
option.classList.add("selected");
|
|
|
|
// Update trigger text
|
|
trigger.querySelector("span").textContent = option.textContent;
|
|
|
|
select.classList.remove("open");
|
|
});
|
|
});
|
|
});
|
|
|
|
// Close dropdown when clicking outside
|
|
document.addEventListener("click", (e) => {
|
|
document.querySelectorAll(".gx-select.open").forEach(select => {
|
|
if (!select.contains(e.target)) {
|
|
select.classList.remove("open");
|
|
}
|
|
});
|
|
});
|
|
});
|
|
</script>
|