nellemann
/
hellomicronaut
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Compare commits

base: nellemann:13169b8452bd293975f5cd0fa5d2104fdec3417e
Branches Tags
nellemann:main
...
compare: nellemann:b6f927521868d7abde74e7eb07b0d069ffba54a9
Branches Tags
nellemann:main

2 Commits
13169b8452 ... b6f9275218

Author SHA1 Message Date
Mark Nellemann b6f9275218 Fix layout 2023-03-03 07:44:49 +01:00
Mark Nellemann 9e9dcb2fe9 Fix layout 2023-03-03 07:44:43 +01:00
5 changed files with 21 additions and 5 deletions
Show Stats Expand all files Collapse all files

10
src/main/resources/assets/application.css Normal file
View File

@ -0,0 +1,10 @@
.htmx-indicator{
opacity:0;
transition: opacity 500ms ease-in;
}
.htmx-request .htmx-indicator{
opacity:1
}
.htmx-request.htmx-indicator{
opacity:1
}

0
src/main/resources/assets/application.js Normal file
View File

5
src/main/resources/assets/img/spinner.svg Normal file
View File

@ -0,0 +1,5 @@
<?xml version="1.0" encoding="utf-8"?><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools -->
<svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path opacity="0.2" fill-rule="evenodd" clip-rule="evenodd" d="M12 19C15.866 19 19 15.866 19 12C19 8.13401 15.866 5 12 5C8.13401 5 5 8.13401 5 12C5 15.866 8.13401 19 12 19ZM12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 17.5228 6.47715 22 12 22Z" fill="#000000"/>
<path d="M2 12C2 6.47715 6.47715 2 12 2V5C8.13401 5 5 8.13401 5 12H2Z" fill="#000000"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 619 B

1
src/main/resources/views/defaultLayout.html
View File

@ -8,6 +8,7 @@
<title th:replace="${title}">Hello Micronaut</title> <title th:replace="${title}">Hello Micronaut</title>
<link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico"> <link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico">
<link href="/assets/vendor/bulma/css/bulma.min.css" rel="stylesheet"> <link href="/assets/vendor/bulma/css/bulma.min.css" rel="stylesheet">
<link href="/assets/application.css" rel="stylesheet">
</head> </head>
<body> <body>

10
src/main/resources/views/index.html
View File

@ -13,24 +13,24 @@
<article class="message"> <article class="message">
<div class="message-header"> <div class="message-header">
<p>Hello Micronaut from <span th:text="${hostname}"></span></span></p> <p>Hello Micronaut from <span th:text="${hostname}"></span></span></p>
<button class="delete" aria-label="delete"></button>
</div> </div>
<div class="message-body" th:text="${info}"> <div class="message-body" th:text="${info}">
</div> </div>
</article> </article>
<div class="columns"> <div class="columns">
<div class="column"> <div class="column is-full">
<form hx-post="/ping"> <form hx-post="/ping">
<div class="field has-addons" hx-target="#pong"> <div class="field has-addons" hx-target="#pong">
<div class="control"> <div class="control">
<input name="message" class="input" type="text" placeholder="Enter message"> <input name="message" class="input" type="text" placeholder="Enter message" maxlength="128" size="64">
</div> </div>
<div class="control"> <div class="control">
<a class="button is-info" hx-post="/ping" hx-include="[msg='message']"> <a class="button is-info" hx-post="/ping" hx-include="[msg='message']" hx-indicator="#spinner">
Submit Submit
</a> </a>
<img id="spinner" class="htmx-indicator" src="/img/spinner.svg"/>
</div> </div>
</div> </div>
</form> </form>
@ -39,7 +39,7 @@
</div> </div>
<div class="columns mt-4"> <div class="columns mt-4">
<div class="collumn" id="pong" hx-get="/ping" hx-trigger="load, queue:last, every 3s"> <div class="column is-full" id="pong" hx-get="/ping" hx-trigger="load, queue:last, every 3s">
</div> </div>
</div> </div>