center sign in and sign up forms

views/audiovisuals/index.ejs

@@ -1,6 +1,6 @@
 <% layout('layouts/boilerplate') %>
 
-    <h1>Meerkat Audiovisuals</h1>
+    <h2>Meerkat Audiovisuals</h2>
     <% if(currentUser){ %>
 
         <div class="d-flex flex-row justify-content-end">

views/reviews/userReviews.ejs

@@ -1,6 +1,6 @@
 <% layout('layouts/boilerplate') %>
 
-    <h1>Meerkat Reviews</h1>
+    <h2>Meerkat Reviews</h2>
     <hr>
     <% for(let review of user_reviews) { %>
         <div class="card mb-3">

views/users/signin.ejs

@@ -1,13 +1,17 @@
 <% layout('layouts/boilerplate') %>
     <h2>Sign in</h2>
-    <form action="signin" method="POST" class="validate-form" novalidate>
-        <div class="mb-2">
-            <label class="form-label" for="username">Username</label>
-            <input class="form-control" type="text" id="username" name="[username]" required>
-        </div>
-        <div class="mb-2">
-            <label class="form-label" for="password">Password</label>
-            <input class="form-control" type="password" id="password" name="[password]" required>
-        </div>
-        <button class="btn btn-success">Sign in</button>
-    </form>
+    <div class="container d-flex justify-content-center">
+        <form action="signin" method="POST" class="validate-form" novalidate>
+            <div class="mb-2">
+                <label class="form-label" for="username">Username</label>
+                <input class="form-control" type="text" id="username" name="[username]" autofocus required>
+            </div>
+            <div class="mb-2">
+                <label class="form-label" for="password">Password</label>
+                <input class="form-control" type="password" id="password" name="[password]" required>
+            </div>
+            <div class="d-grid gap-2 mt-3">
+                <button class="btn btn-success">Sign in</button>
+            </div>
+        </form>
+    </div>

views/users/signup.ejs

@@ -1,17 +1,21 @@
 <% layout('layouts/boilerplate') %>
     <h2>Sign up</h2>
-    <form action="signup" method="POST" class="validate-form" novalidate>
-        <div class="mb-2">
-            <label class="form-label" for="username">Username</label>
-            <input class="form-control" type="text" id="username" name="[username]" required>
-        </div>
-        <div class="mb-2">
-            <label class="form-label" for="email">Email</label>
-            <input class="form-control" type="email" id="email" name="[email]" required>
-        </div>
-        <div class="mb-2">
-            <label class="form-label" for="password">Password</label>
-            <input class="form-control" type="password" id="password" name="[password]" required>
-        </div>
-        <button class="btn btn-success">Sign up</button>
-    </form>
+    <div class="container d-flex justify-content-center">
+        <form action="signup" method="POST" class="validate-form" novalidate>
+            <div class="mb-2">
+                <label class="form-label" for="username">Username</label>
+                <input class="form-control" type="text" id="username" name="[username]" autofocus required>
+            </div>
+            <div class="mb-2">
+                <label class="form-label" for="email">Email</label>
+                <input class="form-control" type="email" id="email" name="[email]" required>
+            </div>
+            <div class="mb-2">
+                <label class="form-label" for="password">Password</label>
+                <input class="form-control" type="password" id="password" name="[password]" required>
+            </div>
+            <div class="d-grid gap-2 mt-3">
+                <button class="btn btn-success d-grid gap-2">Sign up</button>
+            </div>
+        </form>
+    </div>