work

Author: thomaswoehlke

src/main/resources/templates/layout/breadcrumb.html

@@ -4,8 +4,9 @@
       xmlns:sec="http://www.thymeleaf.org/extras/spring-security"
       xmlns:sd="http://www.thymeleaf.org/spring-data">
 
-    <section th:fragment="breadcrumb(breadcrumb)">
-        <div class="container" sec:authorize="isAuthenticated()" th:if="${breadcrumb != null}">
+    <div th:fragment="breadcrumb(breadcrumb)">
+      <section class="container" sec:authorize="isAuthenticated()" th:if="${breadcrumb != null}">
+
             <nav aria-label="breadcrumb" class="m-1 mb-1 p-2">
                 <ol class="breadcrumb">
                     <li th:each="bc,iterStat : ${breadcrumb.getBreadcrumb()}"
@@ -18,7 +19,7 @@
                     </li>
                 </ol>
             </nav>
-        </div>
-    </section>
+        </section>
+    </div>
 
 </html>

src/main/resources/templates/layout/page.html

@@ -33,12 +33,14 @@
 		</div>
 	</header>
 
+  <!-- Breadcrumb -->
+  <div th:replace="layout/breadcrumb :: breadcrumb(breadcrumb=${breadcrumb})">
+  </div>
+
+  <!-- taskstates -->
 	<section th:replace="layout/taskstates :: navigation-taskstates(rootProjects=${rootProjects},thisProject=${thisProject})">
 	</section>
 
-	<!-- Breadcrumb -->
-	<section th:replace="layout/breadcrumb :: breadcrumb(breadcrumb=${breadcrumb})">
-	</section>
 
 	<!-- Menu on Left Column and Document Window on the Right Column -->
 	<section id="tw-main-section">

src/main/resources/templates/project/root/show.html

@@ -13,21 +13,21 @@
 	<div id="tw-content-title">
 		<h1>
 			<i class="fas fa-folder-open"></i>
-			<span th:text="#{project.show.h1}">Project</span>
+			<span th:text="#{project.show.h1}" class="mx-1">Project</span>
 		</h1>
-		<div id="tw-content-title-actionbuttons" class="row">
-            <div class="col-md-3 mb-3">
-                <a class="btn btn-block btn-primary" role="button" th:href="@{/project/root/task/add}">
-                    <i class="fas fa-plus-square"></i>
-                    <span th:text="#{project.show.addTask}">Add a Task</span>
-                </a>
-            </div>
-            <div class="col-md-3 mb-3">
-                <a class="btn btn-block btn-secondary" role="button" th:href="@{/project/root/project/add}">
-                    <i class="fas fa-plus-square"></i>
-                    <span th:text="#{layout.page.addProject}">Add a Project</span>
-                </a>
-            </div>
+		<div id="tw-content-title-actionbuttons" class="d-grid col-2 mx-auto d-md-block">
+        <div class="col-md-3 mb-3">
+            <a class="btn btn-block btn-primary" role="button" th:href="@{/project/root/task/add}">
+                <i class="fas fa-plus-square"></i>
+                <span th:text="#{project.show.addTask}">Add a Task</span>
+            </a>
+        </div>
+        <div class="col-md-3 mb-3">
+            <a class="btn btn-block btn-secondary" role="button" th:href="@{/project/root/project/add}">
+                <i class="fas fa-plus-square"></i>
+                <span th:text="#{layout.page.addProject}">Add a Project</span>
+            </a>
+        </div>
 		</div>
 	</div>
 </div>

src/main/resources/templates/user/login/loginForm.html

@@ -25,13 +25,15 @@ <h2><span th:utext="#{user.loginForm.h2}">Your Todo-List for Getting Things Done
           <span th:text="#{user.loginForm.loginError}">Your login attempt was not successful, try again.</span>
         </div>
         <input type="hidden" th:name="${_csrf.parameterName}" th:value="${_csrf.token}"/>
-        <div class="m-2">
-            <label for="j_username" th:text="#{user.loginForm.email.label}" class="form-label">Email</label>
+        <label for="j_username" th:text="#{user.loginForm.email.label}" class="form-label">Email</label>
+        <div class="m-2 input-group">
+            <span class="input-group-text"><i class="fa-solid fa-user"></i></span>
             <input id="j_username" type="email" class="form-control" name="j_username"
                    th:placeholder="#{user.loginForm.email.placeholder}"/>
         </div>
-        <div class="m-2">
-            <label for="j_password" th:text="#{user.loginForm.password.label}" class="form-label">Password</label>
+        <label for="j_password" th:text="#{user.loginForm.password.label}" class="form-label">Password</label>
+        <div class="m-2 input-group">
+            <span class="input-group-text"><i class="fa-solid fa-lock"></i></span>
             <input id="j_password" type="password" class="form-control" name="j_password"
                      th:placeholder="#{user.loginForm.password.placeholder}"/>
         </div>