Delete/Error/Move/Permission Denied pages

5 files changed, 190 insertions, 133 deletions

diff --git a/pydis_site/apps/home/templatetags/wiki_extra.py b/pydis_site/apps/home/templatetags/wiki_extra.py
index e0a27973..63d9bade 100644
--- a/pydis_site/apps/home/templatetags/wiki_extra.py
+++ b/pydis_site/apps/home/templatetags/wiki_extra.py
@@ -1,3 +1,5 @@
+from typing import Union
+
 from django import template
 from django.forms import (
     BooleanField, BoundField, CharField, ChoiceField, ComboField, DateField, DateTimeField, DecimalField, DurationField,
@@ -97,5 +99,8 @@ def get_field_options(context, field: BoundField):
 
 
 @register.filter
-def render_urlpath(value: URLPath):
+def render_urlpath(value: Union[URLPath, str]):
+    if isinstance(value, str):
+        return value or "/"
+
     return value.path or "/"
diff --git a/pydis_site/templates/wiki/delete.html b/pydis_site/templates/wiki/delete.html
index afb4140d..1be82fa9 100644
--- a/pydis_site/templates/wiki/delete.html
+++ b/pydis_site/templates/wiki/delete.html
@@ -1,67 +1,96 @@
 {% extends "wiki/base.html" %}
-{% load wiki_tags i18n sekizai_tags %}
+{% load wiki_tags sekizai_tags %}
 
 
-{% block wiki_pagetitle %}{% trans "Delete article" %}{% endblock %}
+{% block wiki_pagetitle %}Delete Article{% endblock %}
 
 {% block wiki_contents %}
-  <h1 class="page-header">{% trans "Delete" %} "{{ article.current_revision.title }}"</h1>
+  <h1 class="title is-1">Delete "{{ article.current_revision.title }}"</h1>
 
   {% if cannot_delete_root %}
-    <p class="lead">{% trans "You cannot delete a root article." %}</p>
-    <p><a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}">{% trans "Go back" %}</a></p>
+    <div class="message is-warning">
+      <div class="message-body">
+        <p>
+          You cannot delete the root article.
+        </p>
+
+        <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="button is-primary">
+          <span class="icon">
+            <i class="fas fa-arrow-left"></i>
+          </span>
+          <span>Go back</span>
+        </a>
+      </div>
+    </div>
   {% else %}
-
     {% if cannot_delete_children %}
-
-      <p class="alert alert-danger"><strong>{% trans "You cannot delete this article because you do not have permission to delete articles with children. Try to remove the children manually one-by-one." %}</strong></p>
-
+      <div class="message is-warning">
+        <div class="message-body">
+          <p>
+            You do not have permission to delete articles that have children.
+          </p>
+
+          <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="button is-primary">
+            <span class="icon">
+              <i class="fas fa-arrow-left"></i>
+            </span>
+            <span>Go back</span>
+          </a>
+        </div>
+      </div>
     {% endif %}
 
     {% if delete_children %}
+      <div class="message">
+        <div class="message-body">
+          <p>
+            You are deleting an article with children. If you delete this article, then its children will also be deleted.
+          </p>
+          <p>
+            If you choose to purge this article, note that its children will also be purged.
+          </p>
+        </div>
+      </div>
 
-      <p class="lead">{% trans "You are deleting an article. This means that its children will be deleted as well. If you choose to purge, children will also be purged!" %}</p>
-
-      <h2>{% trans "Articles that will be deleted" %}</h2>
+      <h2 class="title is-2">Child articles</h2>
 
       <ul>
         {% for child in delete_children %}
-        <li><a href="{% url 'wiki:get' article_id=child.article.id %}" target="_blank">{{ child.article }}</a></li>
+          <li><a href="{% url 'wiki:get' article_id=child.article.id %}" target="_blank">{{ child.article }}</a></li>
+        {% endfor %}
+
         {% if delete_children_more %}
-        <li><em>{% trans "...and more!" %}</em></li>
+          <li><em>"...and more!"</em></li>
         {% endif %}
-        {% endfor %}
       </ul>
 
     {% endif %}
 
     {% if not cannot_delete_children %}
-    <p class="lead">{% trans "You are deleting an article. Please confirm." %}</p>
-
-    <form method="POST" class="form-horizontal">
-      {% wiki_form delete_form %}
-      <div class="form-group form-actions">
-        <div class="col-lg-2"></div>
-        <div class="col-lg-10">
-          <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="btn btn-default">
-            <span class="fa fa-arrow-left"></span>
-            {% trans "Go back" %}
-          </a>
-          <button type="submit" name="save_changes" class="btn btn-danger">
-            <span class="fa fa-trash-o"></span>
-            {% trans "Delete article" %}
-          </button>
-        </div>
-      </div>
-    </form>
+      <p>Please confirm that you would like to delete this article.</p>
+
+      <form method="POST">
+        {% wiki_form delete_form %}
+
+      <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="button is-white">
+        <span class="icon">
+          <i class="fas fa-arrow-left"></i>
+        </span>
+        <span>Go back</span>
+      </a>
+      <button type="submit" name="save_changes" class="button is-danger">
+        <span class="icon">
+          <i class="fas fa-trash"></i>
+        </span>
+        <span>Delete Article</span>
+      </button>
+      </form>
     {% endif %}
-
   {% endif %}
 
-{% addtoblock "js" %}
-<script type="text/javascript">
-  $('#id_revision').val('{{ article.current_revision.id }}');
-</script>
-{% endaddtoblock %}
-
+  {% addtoblock "js" %}
+  <script type="text/javascript">
+    $('#id_revision').val('{{ article.current_revision.id }}');
+  </script>
+  {% endaddtoblock %}
 {% endblock %}
diff --git a/pydis_site/templates/wiki/error.html b/pydis_site/templates/wiki/error.html
index b54c8cff..04e6948a 100644
--- a/pydis_site/templates/wiki/error.html
+++ b/pydis_site/templates/wiki/error.html
@@ -9,37 +9,44 @@
 {% endblock %}
 
 {% block wiki_contents %}
-
-{% if error_type == "ancestors_missing" %}
-
-  <h1 class="page-header">{% trans "Not found" %}</h1>
-
-  <div class="missing">
-    <p>{% trans "This article was not found, and neither was its parent article." %}</p>
-    <p>
-      <a href="{% url 'wiki:get' path='' %}" class="btn btn-default"><i class="fa fa-arrow-left"></i> {% trans "Start page" %}</a>
-    </p>
-  </div>
-
-{% else %}
-
-  <h1 class="page-header">{% trans "Error" %}</h1>
-
-  <div class="error">
-    {% if not error_msg %}
-    <p>{% trans "There was some sort of error accessing this page. Sorry!" %}</p>
-    {% else %}
-    <p>{{ error_msg }}</p>
-    {% endif %}
-  </div>
-
-  {% if article %}
-  <p>
-    <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="btn btn-default"><i class="fa fa-arrow-left"></i> {% trans "Back to" %} {{ article.current_revision.title }}</a>
-  </p>
+  {% if error_type == "ancestors_missing" %}
+    <h1 class="title">Not Found</h1>
+
+    <div class="message is-primary">
+      <div class="message-body">
+        <p>
+          We were unable to find that page. If you think this was in error, please let us know!
+        </p>
+        <a href="{% url 'wiki:get' path='' %}" class="button is-primary">
+          <span class="icon">
+            <i class="fas fa-arrow-left"></i>
+          </span>
+          <span>Back to homepage</span>
+        </a>
+      </div>
+    </div>
+  {% else %}
+    <h1 class="title">Error</h1>
+
+    <div class="message is-danger">
+      <div class="message-body">
+        <p>
+          {% if not error_msg %}
+            Unfortunately, an error occurred while retrieving that page. Please let us know!
+          {% else %}
+            {{ error_msg }}
+          {% endif %}
+        </p>
+
+        {% if article %}
+          <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="button is-primary">
+            <span class="icon">
+              <i class="fas fa-arrow-left"></i>
+            </span>
+            <span>Back to {{ article.current_revision.title }}</span>
+          </a>
+        {% endif %}
+      </div>
+    </div>
   {% endif %}
-
-
-{% endif %}
-
 {% endblock %}
diff --git a/pydis_site/templates/wiki/move.html b/pydis_site/templates/wiki/move.html
index d93a3675..f2c83485 100644
--- a/pydis_site/templates/wiki/move.html
+++ b/pydis_site/templates/wiki/move.html
@@ -5,46 +5,58 @@
 
 {% block wiki_contents_tab %}
 
-<div class="row">
-  <div class="col-lg-10">
-    <form method="POST" class="form-horizontal" id="article_move_form">
-      {% wiki_form form %}
-
-      <div class="btn-group" id="dest_selector">
-        <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
-          <span class="dest_selector_title"></span>
-          <span class="caret"></span>
-        </a>
-        <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
-            {% with current_path=root_path %}{% include "wiki/includes/move_tree.html" %}{% endwith %}
-        </ul>
-      </div>
-      <p class="col-lg-offset-2">
+  <div class="message is-warning">
+    <div class="message-body">
+      {% if urlpath.get_descendants %}
         {% blocktrans count cnt=urlpath.get_descendants.count trimmed %}
-          {{ cnt }} nested article will also be moved.<br>
-          Be careful, links to this article and {{ cnt }} article nested
-          in this hierarchy will not be updated.
+          <p>
+            Please note that this article has {{ cnt }} child article. If you
+            decide to move this article, then links to any child articles will
+            not be updated.
+          </p>
           {% plural %}
-          {{ cnt }} nested articles will also be moved.<br>
-          Be careful, links to this article and {{ cnt }} articles nested
-          in this hierarchy will not be updated.
+          <p>
+            Please note that this article has {{ cnt }} child articles. If you
+            decide to move this article, then links to any child articles will
+            not be updated.
+          </p>
         {% endblocktrans %}
+      {% endif %}
+      <p>
+        Remember: Any links to this article will not be automatically updated. You
+        may leave behind a redirect page by specifying that option below, but these
+        are temporary - so it's better to update the links directly.
       </p>
-      <div class="form-group form-actions">
-        <div class="col-lg-12 col-lg-offset-2">
-          <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="btn btn-default">
-            <span class="fa fa-arrow-left"></span>
-            {% trans "Go back" %}
-          </a>
-          <button class="btn btn-large btn-primary" type="submit" name="move" id="id_move">
-            <span class="fa fa-random"></span>
-            {% trans "Move article" %}
-          </button>
-        </div>
-      </div>
-    </form>
+    </div>
   </div>
-</div>
+
+<form method="POST" class="form-horizontal" id="article_move_form">
+  {% wiki_form form %}
+
+  {# Not gonna lie, I have no idea what this is or what it's for #}
+  <div class="btn-group" id="dest_selector">
+    <a class="btn btn-default dropdown-toggle" data-toggle="dropdown" href="#">
+      <span class="dest_selector_title"></span>
+      <span class="caret"></span>
+    </a>
+    <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
+        {% with current_path=root_path %}{% include "wiki/includes/move_tree.html" %}{% endwith %}
+    </ul>
+  </div>
+
+  <a href="{% url 'wiki:get' path=urlpath.path article_id=article.id %}" class="button is-white">
+    <span class="icon">
+      <i class="fas fa-arrow-left"></i>
+    </span>
+    <span>Go back</span>
+  </a>
+  <button class="button is-warning" type="submit" name="move" id="id_move">
+    <span class="icon">
+      <i class="fas fa-random"></i>
+    </span>
+    <span>Move article</span>
+  </button>
+</form>
 
 {% addtoblock "js" %}
 
diff --git a/pydis_site/templates/wiki/permission_denied.html b/pydis_site/templates/wiki/permission_denied.html
index 06afbbda..3314a79d 100644
--- a/pydis_site/templates/wiki/permission_denied.html
+++ b/pydis_site/templates/wiki/permission_denied.html
@@ -1,32 +1,36 @@
 {% extends "wiki/base.html" %}
-{% load wiki_tags i18n %}
-
+{% load wiki_tags %}
 
 {% block wiki_pagetitle %}Permission Denied{% endblock %}
 
 {% block wiki_contents %}
-  <h1 class="page-header">{% trans "Permission Denied" %}</h1>
-  <p class="alert denied alert-danger">
-    <i class="fa fa-minus-circle"></i>
-    {% trans "Sorry, you don't have permission to access this page." %}
-  </p>
-  {% if article.current_revision.locked %}
-  <p class="alert alert-warning">
-    <i class="fa fa-lock"></i>
-    {% trans "This article is locked for editing." %}
-  </p>
-  {% endif %}
-
-  <p>
-  {% if not read_denied %}
-    <a href="{% url 'wiki:get' article_id=article.id path=urlpath.path %}" class="btn btn-default">
-      {% trans "Back to article" %}
-    </a>
-  {% elif urlpath.parent %}
-    <a href="{% url 'wiki:get' path=urlpath.parent.path %}" class="btn btn-default">
-      {% trans "Back to article" %}
-    </a>
-  {% endif %}
-  </p>
+  <div class="message is-danger">
+    <div class="message-header">
+      <p>Permission Denied</p>
+    </div>
 
+    <div class="message-body">
+      <p>
+        Sorry, you don't have permission to access this page.
+      </p>
+      {% if article.current_revision.locked %}
+        <p>This article is locked for editing.</p>
+      {% endif %}
+      {% if not read_denied %}
+        <a href="{% url 'wiki:get' article_id=article.id path=urlpath.path %}" class="button is-primary">
+          <span class="icon">
+            <i class="fas fa-arrow-left"></i>
+          </span>
+          <span>Back to article</span>
+        </a>
+      {% elif urlpath.parent %}
+        <a href="{% url 'wiki:get' path=urlpath.parent.path %}" class="button is-primary">
+          <span class="icon">
+            <i class="fas fa-arrow-left"></i>
+          </span>
+          <span>Back to article</span>
+        </a>
+      {% endif %}
+    </div>
+  </div>
 {% endblock %}