diff options
| author | realtradam <[email protected]> | 2024-07-23 20:47:31 -0400 |
|---|---|---|
| committer | realtradam <[email protected]> | 2024-07-23 20:47:31 -0400 |
| commit | 1e18e0ad7a47536be92384bbf815e0923a06698d (patch) | |
| tree | b07405ecdef4f05a96b6c4348930cbee976554cb /backend/src/main/resources/templates/articles/show.html | |
| parent | 56c59e3b98fe554c4e1484e208e4be5c30f09a04 (diff) | |
| download | spring-blog-1e18e0ad7a47536be92384bbf815e0923a06698d.tar.gz spring-blog-1e18e0ad7a47536be92384bbf815e0923a06698d.zip | |
split front and back end, add react to project
Diffstat (limited to 'backend/src/main/resources/templates/articles/show.html')
| -rw-r--r-- | backend/src/main/resources/templates/articles/show.html | 87 |
1 files changed, 87 insertions, 0 deletions
diff --git a/backend/src/main/resources/templates/articles/show.html b/backend/src/main/resources/templates/articles/show.html new file mode 100644 index 0000000..206aaae --- /dev/null +++ b/backend/src/main/resources/templates/articles/show.html @@ -0,0 +1,87 @@ +<!DOCTYPE html> +<html lang="en" + xmlns:th="http://www.thymeleaf.org" + xmlns:layout="https://www.ultraq.net.nz/thymeleaf/layout" + layout:decorate="~{layout}" +> +<body layout:fragment="content"> + + + +<!--Title--> +<div class="text-center pt-16 md:pt-32"> + <p th:text="${article.createdOn}" class="text-sm md:text-base text-green-500 font-bold"></p> + <h1 th:text="${article.title}" class="font-bold break-normal text-3xl md:text-5xl">Welcome to Ghostwind CSS</h1> +</div> + +<!--image--> +<div class="container w-full max-w-6xl mx-auto bg-white bg-cover mt-8 rounded" th:style="'background:url(' + @{${article.photoUrl}} + '); height: 75vh;'"></div> + +<!--Container--> +<div class="container max-w-5xl mx-auto -mt-32"> + + <div class="mx-0 sm:mx-6"> + + <div class="bg-white w-full p-8 md:p-24 text-xl md:text-2xl text-gray-800 leading-normal" style="font-family:Georgia,serif;"> + + <!--Post Content--> + + <div th:text="${article.content}"></div> + + <!--/ Post Content--> + + </div> + + + <!--Subscribe--> + <div class="container font-sans bg-green-100 rounded mt-8 p-4 md:p-24 text-center"> + <h2 class="font-bold break-normal text-2xl md:text-4xl">Subscribe to Ghostwind CSS</h2> + <h3 class="font-bold break-normal font-normal text-gray-600 text-base md:text-xl">Get the latest posts delivered right to your inbox</h3> + <div class="w-full text-center pt-4"> + <form action="#"> + <div class="max-w-sm mx-auto p-1 pr-0 flex flex-wrap items-center"> + <input type="email" placeholder="[email protected]" class="flex-1 appearance-none rounded shadow p-3 text-gray-600 mr-2 focus:outline-none"> + <button type="submit" class="flex-1 mt-4 md:mt-0 block md:inline-block appearance-none bg-green-500 text-white text-base font-semibold tracking-wider uppercase py-4 rounded shadow hover:bg-green-400">Subscribe</button> + </div> + </form> + </div> + </div> + <!-- /Subscribe--> + + + <!--Author--> + <div class="flex w-full items-center font-sans p-8 md:p-24"> + <img class="w-10 h-10 rounded-full mr-4" src="http://i.pravatar.cc/300" alt="Avatar of Author"> + <div class="flex-1"> + <p class="text-base font-bold text-base md:text-xl leading-none">Ghostwind CSS</p> + <p class="text-gray-600 text-xs md:text-base">Tailwind CSS version of Ghost's Casper theme by <a class="text-gray-800 hover:text-green-500 no-underline border-b-2 border-green-500" href="https://www.tailwindtoolbox.com">TailwindToolbox.com</a></p> + </div> + <div class="justify-end"> + + </div> + <!--/Author--> + + </div> + + + </div> + +</div> + + +<!-- Scroll Top Button --> +<button class="btn-toggle-round scroll-top js-scroll-top" type="button" title="Scroll to top"> + <svg class="progress-circle" width="100%" height="100%" viewBox="-1 -1 102 102"> + <path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/> + </svg> + <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-arrow-up" width="24" height="24" viewBox="0 0 24 24" stroke-width="1.5" stroke="cuurentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"> + <path stroke="none" d="M0 0h24v24H0z" fill="none"/> + <line x1="12" y1="5" x2="12" y2="19" /> + <line x1="18" y1="11" x2="12" y2="5" /> + <line x1="6" y1="11" x2="12" y2="5" /> + </svg> +</button> + + +</body> +</html>
\ No newline at end of file |