69 lines
2.5 KiB
HTML
69 lines
2.5 KiB
HTML
{% extends "base.html" %}
|
|
|
|
{% block title %}Hello!{% endblock %}
|
|
|
|
{% block head %}
|
|
{% endblock %}
|
|
|
|
{% block content %}
|
|
<div x-data>
|
|
<nav class="navbar bg-base-100 shadow-sm overflow-hidden fixed top-0 left-0 z-20 flex justify-between">
|
|
<a class="btn btn-ghost text-xl flex" href="/">
|
|
<img class="m-2 h-8" src="/assets/logo.svg" alt="RSS Notifier Logo"/>
|
|
<h2 style="margin-bottom: auto; margin-top: auto">RSS Notifier</h2>
|
|
</a>
|
|
<button class="btn btn-primary" @click="document.getElementById('create_modal').showModal()">Create</button>
|
|
</nav>
|
|
<div class="pt-20">
|
|
<dialog id="create_modal" class="modal" x-cloak x-transition @close="document.getElementById('create_form').reset()">
|
|
<div class="modal-box">
|
|
<h3 class="text-lg font-bold pb-2">Create new RSS Feed subscription</h3>
|
|
<form method="dialog">
|
|
<button class="btn btn-sm btn-circle btn-ghost absolute right-2 top-2">✕</button>
|
|
</form>
|
|
<form id="create_form" hx-post="/feed/" hx-target="#feed_tbody" hx-swap="beforeend"
|
|
hx-indicator="#indicator"
|
|
@htmx:after-on-load="document.getElementById('create_modal').close()">
|
|
<fieldset class="fieldset gap-2">
|
|
<label class="floating-label">
|
|
<span>Name</span>
|
|
<input type="text" class="input input-md w-full" placeholder="Name" name="name">
|
|
</label>
|
|
<label class="floating-label">
|
|
<span>Feed URL</span>
|
|
<input type="url" class="input input-md w-full" placeholder="Feed URL" name="feed_url">
|
|
</label>
|
|
</fieldset>
|
|
<div class="modal-action">
|
|
<button class="btn btn-primary" form="create_form" type="submit">
|
|
Submit
|
|
<img id="indicator" class="htmx-inline htmx-indicator" src="/assets/oval.svg"
|
|
style="height: 1rem; margin-left: 2px"
|
|
alt="...">
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<form method="dialog" class="modal-backdrop">
|
|
<button>close</button>
|
|
</form>
|
|
</dialog>
|
|
<div class="overflow-x-auto mx-4 rounded-box border border-base-content/5 bg-base-100">
|
|
<table class="table table-zebra">
|
|
<thead>
|
|
<tr>
|
|
<th>Feed Name</th>
|
|
<th>Feed URL</th>
|
|
<th>Last Mail Sent</th>
|
|
<th>Actions</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="feed_tbody">
|
|
{{ feeds|safe }}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endblock %}
|