From d35c9f32310038191eb7ee9975f91c7cdbb8fb45 Mon Sep 17 00:00:00 2001
From: Gareth Coles <gdude2002@gmail.com>
Date: Mon, 15 Apr 2019 15:32:02 +0100
Subject: Image upload and images sidebar form work

---
 pydis_site/templates/wiki/forms/fields/image.html  | 22 ++++++++-
 .../templates/wiki/plugins/images/sidebar.html     | 52 +++++++++-------------
 2 files changed, 42 insertions(+), 32 deletions(-)

(limited to 'pydis_site')

diff --git a/pydis_site/templates/wiki/forms/fields/image.html b/pydis_site/templates/wiki/forms/fields/image.html
index 8591f547..afef6889 100644
--- a/pydis_site/templates/wiki/forms/fields/image.html
+++ b/pydis_site/templates/wiki/forms/fields/image.html
@@ -18,7 +18,27 @@
   <div class="field-body">
     <div class="field">
       <div class="control">
-        {{ field }}
+        <div class="file has-name is-fullwidth">
+          <label class="file-label">
+            <input class="file-input"
+                   type="file"
+                   id="{{ field.auto_id }}"
+                   name="{{ field.name }}"
+                   accept="image/*"
+
+                   {% if field.required %}required{% endif %}
+            />
+          <span class="file-cta">
+            <span class="file-icon">
+              <i class="fas fa-image"></i>
+            </span>
+            <span class="file-label">
+              Upload
+            </span>
+          </span>
+          <span class="file-name"></span>
+          </label>
+        </div>
       </div>
 
     {% if field.errors %}
diff --git a/pydis_site/templates/wiki/plugins/images/sidebar.html b/pydis_site/templates/wiki/plugins/images/sidebar.html
index d25fe48e..d206cbaf 100644
--- a/pydis_site/templates/wiki/plugins/images/sidebar.html
+++ b/pydis_site/templates/wiki/plugins/images/sidebar.html
@@ -41,37 +41,27 @@ function add_image(form) {
   #image-list tr:first-child td {border:0;}
 </style>
 
-  <h4>Add image</h4>
-
-  {% if article|images_can_add:user %}
-    {% include "wiki/includes/formerrors.html" %}
-
-    {# Include the hidden fields #}
-    {% for hidden in form.hidden_fields %}
-      {{ hidden }}
-    {% endfor %}
-
-    <p>
-    {% for field in form.visible_fields %}
-      {% include "wiki/includes/formfield.html" with render_labels=False %}
-    {% endfor %}
-
-    <p>
-      <button type="button" onClick="add_image(this.form)" name="{{ plugin.slug }}_save" value="1" class="button is-primary">
-        <span class="icon">
-          <i class="fas fa-upload"></i>
-        </span>
-        <span>Upload</span>
-      </button>
-    </p>
-  {% else %}
-
-    {% if user.is_anonymous %}
-      {% include "wiki/includes/anonymous_blocked.html" %}
-    {% else %}
-      <p><em>{% trans "You do not have permissions to add images." %}</em></p>
-    {% endif %}
-  {% endif %}
+{% if article|images_can_add:user %}
+  {% include "wiki/includes/formerrors.html" %}
+
+  {# Include the hidden fields #}
+  {% for hidden in form.hidden_fields %}
+    {{ hidden }}
+  {% endfor %}
+
+  {% for field in form.visible_fields %}
+    {% include "wiki/includes/formfield.html" with render_labels=False %}
+  {% endfor %}
+
+  <button type="button" onClick="add_image(this.form)" name="{{ plugin.slug }}_save" value="1" class="button is-primary is-fullwidth">
+    <span class="icon">
+      <i class="fas fa-save"></i>
+    </span>
+    <span>Save</span>
+  </button>
+{% endif %}
+
+<div class="is-divider"></div>
 
 <div style="max-height: 300px; overflow: auto;">
   <table class="table table-responsive table-bordered" id="image-list">
-- 
cgit v1.2.3