dalu/htmxginpongo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

initial

Browse Source
This commit is contained in:
Darko Luketic
2023-10-02 17:42:50 +02:00
commit a42c8943fc
19 changed files with 553 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
ui/templates.go Normal file
View File

@ -0,0 +1,6 @@
package ui
import "embed"
//go:embed all:templates
var Templates embed.FS

18
ui/templates/base.html.twig Normal file
View File

@ -0,0 +1,18 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
{%- block meta %}{% endblock -%}
<title>{{ title }}</title>
<script src="/assets/node_modules/htmx.org/dist/htmx.min.js"></script>
{%- block js %}{% endblock -%}
{%- block css %}{% endblock -%}
</head>
<body>
{%- block body %}{% endblock -%}
{%- block jsbottom %}{% endblock -%}
</body>
</html>

21
ui/templates/index.html.twig Normal file
View File

@ -0,0 +1,21 @@
{% extends "layout.html.twig" %}
{%- block middle %}
<div class="px-4 py-5 my-5 text-center">
<h1 class="display-5 fw-bold">Hello</h1>
</div>
{% include "message/form.new.html.twig" %}
<div id="messages">
{% if messages|length > 0 %}
<table>
<tr>
<th>Name</th>
<th>Text</th>
<th>Time</th>
</tr>
{% for message in messages %}
{% include "message/fragment.html.twig" %}
{% endfor %}
</table>
{% endif %}
</div>
{% endblock -%}

20
ui/templates/layout.html.twig Normal file
View File

@ -0,0 +1,20 @@
{% extends "base.html.twig" %}
{%- block css %}
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">{% endblock -%}
{%- block js %}
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL" crossorigin="anonymous"></script>{% endblock -%}
{%- block body %}
<div class="container">
<div class="row">
<div class="col-2">
{%- block left -%}{% endblock -%}
</div>
<div class="col-8">
{%- block middle -%}{% endblock -%}
</div>
<div class="col-2">
{%- block right -%}{% endblock -%}
</div>
</div>
</div>
{% endblock -%}

11
ui/templates/message/form.new.html.twig Normal file
View File

@ -0,0 +1,11 @@
<form hx-post="/" hx-target="#messages" hx-swap="beforeend">
<div class="mb-3">
<label for="name" class="form-label">Name</label>
<input type="text" name="name" class="form-control" id="name">
</div>
<div class="mb-3">
<label for="text" class="form-label">Message</label>
<textarea class="form-control" name="text" id="text"></textarea>
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>

11
ui/templates/message/fragment.html.twig Normal file
View File

@ -0,0 +1,11 @@
<tr id="message-{{ message.ID }}">
<td>
{{ message.Name }}
</td>
<td>
{{ message.Text }}
</td>
<td>
{{ message.Time|naturaltime }}
</td>
</tr>