refactor: standalone message block for better customization

app/templates/layout/inner_header.html

@@ -1,6 +1,5 @@
 {% macro inner_header(title) %}
 <div class="row">
-  {% include 'message.html' %}
   <div class="col-2 inner-header-logo">
   </div>
   <div class="col-10 gx-md-4 gx-0">

app/templates/message.html

@@ -1,6 +1,6 @@
 {% with messages = get_flashed_messages() %}
 {% if messages %}
-  <div class="alert alert-{{messages[0].alertType}} mb-4" role="alert">
+  <div class="alert alert-{{messages[0].alertType}} mb-3" role="alert">
       <p class="mb-0">{{ messages[0].message }}</p>
   </div>
 {% endif %}

app/templates/users/login.html

@@ -13,6 +13,9 @@
     <div class="col-12 my-3">
       {{ inner_header("Login") }}
     </div>
+    <div class="col-12 px-2">
+      {% include 'message.html' %}
+    </div>
     <form class="col-12 needs-validation h-100" method="post" novalidate>
       <div class="mb-3">
         <label for="email" class="form-label">Email</label>

app/templates/users/register.html

@@ -10,9 +10,12 @@
 {% block content %}
 <div class="container">
   <div class="register mx-auto">
-    <div class="my-3 my-md-5">
+    <div class="my-3">
       {{ inner_header("Register") }}
     </div>
+    <div class="row px-2">
+      {% include 'message.html' %}
+    </div>
     <form class="row g-3 needs-validation" method="post" novalidate>
       <div class="col-12">
         <label class="form-label" for="name">Name</label>