Vertically center descriptions of various input fields

dtekcth · May 4, 2024 · ab904d1 · ab904d1
1 parent 39da46a
commit ab904d1
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 13 deletions.
diff --git a/src/static/style.css b/src/static/style.css
@@ -1,4 +1,9 @@
-body{
+body {
   --header-back-color: #fa6601;
   --header-fore-color: #ffffff;
 }
+
+.center-row {
+    display: flex;
+    align-items: center;
+}
diff --git a/src/templates/admin.html b/src/templates/admin.html
@@ -45,7 +45,7 @@
 <form method="post" enctype="multipart/form-data">
   {{ form.hidden_tag() }}
 
-  <div class="row responsive-label">
+  <div class="center-row row responsive-label">
     <div class="col-sm-12 col-md-2">
       {{ form.file.label}}
 
@@ -78,7 +78,7 @@ <h3 class="section">File</h3>
   </div>
 
 
-  <div class="row responsive-label">
+  <div class="center-row row responsive-label">
     <div class="col-sm-12 col-md-2">
       {{ form.desc.label }}
     </div>
@@ -90,7 +90,7 @@ <h3 class="section">File</h3>
     </div>
   </div>
 
-  <div class="row responsive-label">
+  <div class="center-row row responsive-label">
     <div class="col-sm-12 col-md-2">
       {{ form.start_date.label }}
     </div>
@@ -102,7 +102,7 @@ <h3 class="section">File</h3>
     </div>
   </div>
 
-  <div class="row responsive-label">
+  <div class="center-row row responsive-label">
     <div class="col-sm-12 col-md-2">
       {{ form.end_date.label }}
     </div>
@@ -114,7 +114,7 @@ <h3 class="section">File</h3>
     </div>
   </div>
 
-  <div class="row responsive-label">
+  <div class="center-row row responsive-label">
     <div class="col-sm-12 col-md-2">
       {{ form.priority.label }} 
     </div>

diff --git a/src/templates/users.html b/src/templates/users.html
@@ -40,7 +40,7 @@
   <form method="post" enctype="multipart/form-data">
     {{ form.hidden_tag() }}
 
-    <div class="row responsive-label">
+    <div class="center-row row responsive-label">
       <div class="col-sm-12 col-md-2">
         {{ form.username.label }}
       </div>
@@ -52,8 +52,7 @@
       </div>
     </div>
 
-
-    <div class="row responsive-label">
+    <div class="center-row row responsive-label">
       <div class="col-sm-12 col-md-2">
         {{ form.password.label }}
       </div>
@@ -65,7 +64,7 @@
       </div>
     </div>
 
-    <div class="row responsive-label">
+    <div class="center-row row responsive-label">
       <div class="col-sm-12 col-md-2">
         {{ form.password2.label }}
       </div>
@@ -77,7 +76,7 @@
       </div>
     </div>
 
-    <div class="row responsive-label">
+    <div class="center-row row responsive-label">
       <div class="col-sm-12 col-md-2">
         {{ form.role.label }}
       </div>
@@ -89,11 +88,11 @@
       </div>
     </div>
 
-    <div class="row responsive-label">
+    <div class="center-row row responsive-label">
       <div class="col-sm-3 col-md-2">
         {{ form.submit }}
       </div>
     </div>
   </form>
 </fieldset>
-{% endblock %}
+{% endblock %}