feat: post list and edition redirect

This commit is contained in:
Florian Sylvain
2024-05-17 16:38:41 +02:00
parent 24eefb743b
commit 900ad3e8b8
2062 changed files with 7238 additions and 24 deletions
@@ -3,7 +3,6 @@
<head>
<title>GoCMS | Create post</title>
{{.Head}}
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<style>
form {
max-width: 24rem;
@@ -17,8 +16,10 @@
<p>Create a new post</p>
<form action="create" method="post" class="d-flex align-items-center flex-column gap-3" id="createPostForm">
<div class="form-floating w-100">
<input type="text" class="form-control" id="name" name="name" placeholder="Chose the post name">
<label for="name">Name</label>
<input type="text" class="form-control {{ if .PageError.IsError }} is-invalid {{ end }}" id="name"
name="name" placeholder="Chose the post name" value="{{ .Name }}">
<label for="name">Name</label>
<div class="invalid-feedback">{{ .PageError.Message }}</div>
</div>
<button id="createPostButton" class="btn btn-primary w-100" disabled type="submit">
<span class="createPostFormButtonLoading visually-hidden spinner-border spinner-border-sm"
@@ -20,7 +20,7 @@
</div>
</div>
<div class="text-black-50 d-flex align-items-center justify-content-center h-100 py-3">
<textarea id="postContent" name="postContent"></textarea>
<textarea id="postContent" name="postContent">{{.Body}}</textarea>
</div>
</div>
@@ -3,16 +3,20 @@
<head>
<title>GoCMS | Posts</title>
{{.Head}}
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<style>
.btn-outline-danger:hover > * {
fill: #fff !important;
transition: fill ease-in-out 50ms;
}
</style>
</head>
<body class="text-dark">
{{.Navbar}}
<div class="container mt-3 text-black-50">
<h1>Posts</h1>
<p>List of your posts</p>
<table class="table">
<table class="table table-hover">
<thead>
<tr>
<th scope="col">Name</th>
@@ -29,15 +33,41 @@
</form>
</td>
</tr>
{{ range $post := .Posts }}
<tr>
<td>1</td>
<td>Mark</td>
<td>Otto</td>
<td>@mdo</td>
<td>{{ $post.Title }}</td>
<td class="date">{{ $post.CreatedAt }}</td>
<td class="date">{{ $post.UpdatedAt }}</td>
<td>
<a href="/post/{{ $post.Title }}/edit" class="btn btn-secondary btn-sm">
<svg width="12px" height="12px" fill="currentColor">
<use xlink:href="/static/bootstrap-icons.svg#pen"/>
</svg>
</a>
<a href="/post/{{ $post.Title }}/delete" class="btn btn-outline-danger btn-sm">
<svg width="12px" height="12px" fill="currentColor">
<use xlink:href="/static/bootstrap-icons.svg#trash"/>
</svg>
</a>
</td>
</tr>
{{ end }}
</tbody>
</table>
</div>
<script>
const datesElements = document.querySelectorAll("td.date")
datesElements.forEach(date => {
date.innerText = new Date(date.innerText).toLocaleDateString(undefined, {
year: "2-digit",
month: "2-digit",
day: "2-digit",
hour: "2-digit",
minute: "2-digit"
})
})
</script>
</body>
</html>