decks.html
html
<!DOCTYPE html><html lang="en" data-theme="dark"><head> {{template "head"}} <title>My Decks - SkyDeck</title></head><body class="min-h-screen bg-base-200"> {{template "navbar"}} <!-- My Decks --> <section class="py-8"> <div class="container mx-auto px-4"> <div class="flex items-center justify-between mb-8"> <h1 class="text-2xl font-bold">My Decks</h1> <a href="/editor" class="btn btn-primary"> <svg class="w-5 h-5" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4" /> </svg> New Deck </a> </div> {{$decks := decks.UserDecks}} {{if $decks}} <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6"> {{range $decks}} <div class="deck-card card bg-base-100 overflow-hidden group relative"> <a href="/editor/{{.ID}}" class="absolute inset-0 z-10"></a> {{if .CoverImage}} <figure class="h-full"> <img src="{{.CoverImage}}" alt="{{.Title}}" class="w-full h-full object-cover" /> </figure> {{else}} <figure class="h-full bg-gradient-to-br from-primary/20 to-secondary/20 flex items-center justify-center"> <span class="text-4xl font-bold text-white/30">{{slice .Title 0 1}}</span> </figure> {{end}} <div class="card-body absolute bottom-0 left-0 right-0 bg-gradient-to-t from-black/90 to-transparent p-4"> <h3 class="card-title text-white text-lg">{{.Title}}</h3> <div class="flex items-center gap-2 text-sm text-white/70"> {{if .IsPublished}} <span class="badge badge-success badge-sm">Published</span> {{else}} <span class="badge badge-ghost badge-sm">Draft</span> {{end}} <span class="ml-auto">{{.ViewCount}} views</span> </div> </div> <!-- Actions --> <div class="absolute top-2 right-2 z-20 opacity-0 group-hover:opacity-100 transition-opacity"> <button class="btn btn-circle btn-sm btn-error" hx-delete="/api/decks/{{.ID}}" hx-confirm="Are you sure you want to delete this deck?" hx-swap="none" onclick="event.stopPropagation()"> <svg class="w-4 h-4" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"> <path stroke-linecap="round" stroke-linejoin="round" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" /> </svg> </button> </div> </div> {{end}} </div> {{else}} <div class="text-center py-12"> <div class="text-6xl mb-4">📊</div> <h3 class="text-xl font-semibold mb-2">No decks yet</h3> <p class="text-base-content/60 mb-4">Create your first slide deck to get started!</p> <a href="/editor" class="btn btn-primary">Create Your First Deck</a> </div> {{end}} </div> </section> <!-- Deck deletion uses htmx with hx-confirm --> <script> // Reload page after successful deletion document.body.addEventListener('htmx:afterRequest', function(evt) { if (evt.detail.successful && evt.detail.requestConfig.verb === 'delete') { window.location.reload(); } }); </script></body></html>
72f0edf
Add rich text formatting and block styling to editor
0 stars
Pitch decks to help promote Skyscape Apps
Sign in to comment
Sign In