Add some text and styling

[txt.house] / txt_house / templates / edit.html

diff --git a/txt_house/templates/edit.html b/txt_house/templates/edit.html
index ba59df2..7e22641 100644 (file)
--- a/txt_house/templates/edit.html
+++ b/txt_house/templates/edit.html
@@ -2,16 +2,13 @@
 
 {% block body %}
 
-<nav>
-  <a href='{% url "index" %}' title='Home'>Home</a>
-  <a href='{{ text_file.get_view_url }}' title='View'>View</a>
-</nav>
-
 <style>
   .copy-area {
     display: flex;
     flex-direction: row;
     align-items: center;
+    flex-wrap: wrap;
+    justify-content: center;
 
     margin-top: 1.5rem;
   }
@@ -32,28 +29,33 @@
   }
 </style>
 
-{% if edit_key %}
-  <span class='copy-area'>
-    <label for='edit-key-display'>Edit key:</label>
-    <span id='edit-key-display'>{{ edit_key }}</span>
-  </span>
-  <small>Save this key in order to edit this file in the future.</small>
-{% endif %}
+<nav>
+  <a href='{% url "index" %}' title='Home'>Home</a>
+  <a href='{{ text_file.get_view_url }}' title='View'>View</a>
+</nav>
 
 <form class='editor' action='{{ text_file.get_edit_url }}' method='post'>
   {% csrf_token %}
-  {% if edit_key %}
-    <input id='edit_key' name='edit_key' type='hidden' value='{{ edit_key }}'></input>
-  {% else %}
-    <span>
-      <label for='edit_key'>Edit key:</label>
-      <input id='edit_key' name='edit_key' type='text'></input>
-    </span>
-
-    {% if incorrect_key %}
-    <span class='error'>You must enter the correct edit key to save your changes.</span>
+  <div class='edit-key-area'>
+    {% if edit_key %}
+      <span class='copy-area'>
+        <label for='edit-key-display'>Edit key:</label>
+        <span id='edit-key-display'>{{ edit_key }}</span>
+      </span>
+      <small>Save this key in order to edit this file in the future.</small>
+      <input id='edit_key' name='edit_key' type='hidden' value='{{ edit_key }}'></input>
+    {% else %}
+      <span class='field'>
+        <label for='edit_key'>Edit key:</label>
+        <input id='edit_key' name='edit_key' type='text'></input>
+      </span>
+
+      {% if incorrect_key %}
+      <span class='error'>You must enter the correct edit key to save your changes.</span>
+      {% endif %}
     {% endif %}
-  {% endif %}
+  </div>
+
   <textarea name='text'>{{ text }}</textarea>
   <input type='submit'></input>
 </form>