eisterman/htmxtailwindtest
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add Tailwind and DaisyUI

Browse Source
This commit is contained in:
Federico Pasqua
2025-02-01 18:42:08 +01:00
parent d16391fab0
commit 0ffe405e84
10 changed files with 571 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
templates/base.html
View File

@@ -1,7 +1,9 @@
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://matcha.mizu.sh/matcha.css">
<link rel="stylesheet" href="/assets/generated/main.css">
<!-- Inter Font is so hot right now! -->
<link rel="stylesheet" href="https://rsms.me/inter/inter.css">
<title>{% block title %}{{ title }}{% endblock %}</title>
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.14.8/dist/cdn.min.js"></script>

8
templates/feed.html
View File

@@ -3,17 +3,19 @@
<td>{{feed.feed_url}}</td>
<td>{{feed.last_pub_date.clone().unwrap_or("None".to_string())}}</td>
<td>
<button hx-get="/feed/{{feed.id}}/edit/inline"
<button class="btn"
hx-get="/feed/{{feed.id}}/edit/inline"
hx-target="#feed_{{feed.id}}"
hx-swap="outerHTML">
Edit Inline
</button>
<button hx-get="/feed/{{feed.id}}/edit/form"
<button class="btn"
hx-get="/feed/{{feed.id}}/edit/form"
hx-target="body"
hx-swap="beforeend">
Edit Dialog
</button>
<button class="danger"
<button class="btn btn-warning"
hx-confirm="Are you sure?"
hx-delete="/feed/{{feed.id}}"
hx-target="#feed_{{feed.id}}"

4
templates/feed_form.html
View File

@@ -17,9 +17,9 @@
</label>
</form>
<footer>
<button form="modify_form" type="reset" @click="document.getElementById('modal').remove()">Close
<button class="btn" form="modify_form" type="reset" @click="document.getElementById('modal').remove()">Close
</button>
<button form="modify_form" type="submit">
<button class="btn" form="modify_form" type="submit">
Submit
<img id="mod_indicator" class="htmx-indicator" src="/assets/oval.svg"
style="height: 1rem; margin-left: 2px" alt="...">

4
templates/feed_inline.html
View File

@@ -13,13 +13,13 @@
<td>
<form id="update_feed_{{feed.id}}" hx-put="/feed/{{feed.id}}" hx-target="#feed_{{feed.id}}" hx-swap="outerHTML"
hx-indicator="update_feed_{{feed.id}}_indicator" style="padding: 0; background: unset">
<button type="reset"
<button class="btn" type="reset"
hx-get="/feed/{{feed.id}}"
hx-target="#feed_{{feed.id}}"
hx-swap="outerHTML">
Cancel
</button>
<button type="submit">
<button class="btn" type="submit">
Confirm
<img id="update_feed_{{feed.id}}_indicator" class="htmx-indicator" src="/assets/oval.svg"
style="height: 1rem; margin-left: 2px" alt="...">

7
templates/index.html
View File

@@ -10,7 +10,6 @@
top: 0;
left: 0;
width: 100%;
background: #161b22;
}
.overlay {
@@ -45,7 +44,7 @@
<div style="height: 48px; margin-bottom: 8px"></div>
<div x-data="{'isModalOpen': false}">
<div style="display:flex; justify-content:flex-end">
<button @click="isModalOpen = true">Create</button>
<button class="btn" @click="isModalOpen = true">Create</button>
</div>
<div class="overlay" style="z-index: 30" x-show="isModalOpen" x-cloak></div>
<dialog open style="z-index: 31" x-show="isModalOpen" x-cloak x-transition>
@@ -64,8 +63,8 @@
</label>
</form>
<footer>
<button form="create_form" type="reset" @click="isModalOpen = false">Close</button>
<button form="create_form" type="submit">
<button class="btn" form="create_form" type="reset" @click="isModalOpen = false">Close</button>
<button class="btn" form="create_form" type="submit">
Submit
<img id="indicator" class="htmx-indicator" src="/assets/oval.svg" style="height: 1rem; margin-left: 2px"
alt="...">