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

Add test dialog

Browse Source
This commit is contained in:
Federico Pasqua
2025-01-28 22:03:55 +01:00
parent 3c180625b2
commit 5760335304
2 changed files with 48 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
templates/base.html
View File

@@ -5,6 +5,10 @@
<!-- <script src="https://cdn.twind.style" crossorigin></script>--> <!-- <script src="https://cdn.twind.style" crossorigin></script>-->
<title>{% block title %}{{ title }}{% endblock %}</title> <title>{% block title %}{{ title }}{% endblock %}</title>
<script src="https://unpkg.com/htmx.org@2.0.4"></script> <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>
<style>
[x-cloak] { display: none !important; }
</style>
{% block head %}{% endblock %} {% block head %}{% endblock %}
</head> </head>
<body> <body>

49
templates/index.html
View File

@@ -3,20 +3,59 @@
{% block title %}Hello!{% endblock %} {% block title %}Hello!{% endblock %}
{% block head %} {% block head %}
<style>
.navbar {
overflow: hidden;
position: fixed;
width: 100%;
}
.overlay {
width: 100%;
height: 100%;
position: fixed;
top: 0;
left: 0;
background: #161b22;
opacity: 0.75;
}
</style>
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<nav class="no-overflow fixed width" style="z-index: 20"> <nav class="navbar" style="z-index: 20">
<div> <div>
<a href="/" class="flex"> <a href="/" style="display: flex">
<img src="/assets/logo.svg" class="m-.5" style="height: 32px" alt="RSS Notifier Logo"/> <img src="/assets/logo.svg" style="margin:8px; height: 32px" alt="RSS Notifier Logo"/>
<h2 style="margin-bottom: auto; margin-top: auto">RSS Notifier</h2> <h2 style="margin-bottom: auto; margin-top: auto">RSS Notifier</h2>
</a> </a>
</div> </div>
</nav> </nav>
<div style="height: 48px; margin-bottom: 8px"></div> <div style="height: 48px; margin-bottom: 8px"></div>
<div class="flex end"><button>Create</button></div> <div x-data="{'isModalOpen': false}">
<table class="centered"> <div style="display:flex; justify-content:flex-end">
<button x-on:click="isModalOpen = true">Create</button>
</div>
<div class="overlay" x-show="isModalOpen" x-cloak></div>
<dialog open x-show="isModalOpen" x-cloak x-transition>
<header>
<h2>Create new RSS Feed</h2>
</header>
<p>
<b><strong>Gol D. Roger</strong></b>
<br>
<b>฿5,564,800,000</b>
</p>
<p>
Kono sakuhin ha fiction dethunode jitsuzaisuru jinbutsu dantai sonota no soshiki to doitsu no meishou ga
gekichu ni toujyou shitatoshitemo jitsuzai na monotoha issai mukankeideth.
</p>
<footer>
<button x-on:click="isModalOpen = false">Close</button>
</footer>
</dialog>
</div>
<table style="text-align:center">
<tr> <tr>
<th>Feed Name</th> <th>Feed Name</th>
<th>Feed URL</th> <th>Feed URL</th>