From 56327d29e6805990590296d844ed1ec9c733c931 Mon Sep 17 00:00:00 2001
From: Sage Vaillancourt <sagev9000@tutanota.com>
Date: Sun, 2 Oct 2022 02:54:59 -0400
Subject: [PATCH] Add titles to modal.

---
 undercover/static/styles.css             | 5 +++++
 undercover/templates/_formhelpers.jinja2 | 1 +
 undercover/templates/base.jinja2         | 7 ++++---
 3 files changed, 10 insertions(+), 3 deletions(-)

diff --git a/undercover/static/styles.css b/undercover/static/styles.css
index 682d9cc..26c774d 100644
--- a/undercover/static/styles.css
+++ b/undercover/static/styles.css
@@ -294,6 +294,11 @@ textarea {
   margin-bottom: 2em;
 }
 
+.modal-content h2 {
+  font-size: 200%;
+  margin-bottom: 2em;
+}
+
 .modal-close-button {
   position: absolute;
   background: none;
diff --git a/undercover/templates/_formhelpers.jinja2 b/undercover/templates/_formhelpers.jinja2
index 642d6b2..72dcbf0 100644
--- a/undercover/templates/_formhelpers.jinja2
+++ b/undercover/templates/_formhelpers.jinja2
@@ -27,6 +27,7 @@
   <div id='modal' class='modal modal-background transparent' onclick="event.target.id === 'modal' && closeModal()">
     <div class='modal modal-content'>
       <button class='modal-close-button' onclick="closeModal()">X</button>
+      <h2 id='modal-title'>Login Now</h2>
       <form action="/login" method="post" id="create-account-form">
         <div>
           <label for="login">Email: </label>
diff --git a/undercover/templates/base.jinja2 b/undercover/templates/base.jinja2
index 67aa312..a6cb32f 100644
--- a/undercover/templates/base.jinja2
+++ b/undercover/templates/base.jinja2
@@ -10,8 +10,9 @@
       function closeModal() {
         document.getElementById('modal').classList.add('transparent')
       }
-      function showModal(login) {
+      function showModal(login, text) {
         document.getElementById('modal').classList.remove('transparent')
+        document.getElementById('modal-title').innerText = text
         const createAccountElements = [
           'confirm-password',
           'confirm-password-label',
@@ -42,8 +43,8 @@
 {% else %}
   <div class="user logged-out">
     <form action="/create_account">
-        <div class="black-white-button" style="margin-right: 1em; padding: 0.4em;" onclick="showModal(false)">Create account</div>
-        <div class="white-black-button" style="margin: 0; padding: 0.4em;" onclick="showModal(true)">Log in</div>
+      <div class="black-white-button" style="margin-right: 1em; padding: 0.4em;" onclick="showModal(false, 'Create your account')">Create account</div>
+      <div class="white-black-button" style="margin: 0; padding: 0.4em;" onclick="showModal(true, 'Login now')">Log in</div>
     </form>
   </div>
 {% endif %}