3 files changed, 35 insertions, 18 deletions
diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css
index 283e89cb..256bec2c 100644
--- a/pydis_site/static/css/base/base.css
+++ b/pydis_site/static/css/base/base.css
@@ -71,10 +71,31 @@ div.card.has-equal-height {
     font-weight: bold;
 }
 
+
+/* Fix for logout form submit button in navbar */
+
 button.is-size-navbar-menu {
     font-size: 14px;
 }
 
-section.message-section {
-    padding: 1.5rem 1.5rem 0 1.5rem;
+/* On-page message styling */
+
+@keyframes message-slide-in {
+    0% {
+        transform: translateX(100%);
+    }
+
+    100% {
+        transform: translateX(0);
+    }
+}
+
+div.messages {
+    animation: 0.5s ease-out 0s 1 message-slide-in;
+    padding: 0.5rem;
+    position: fixed;
+    right: 0;
+    top: 76px;
+
+    z-index: 1000;  /* On top of everything else */
 }
diff --git a/pydis_site/templates/base/base.html b/pydis_site/templates/base/base.html
index a419521c..7b197be3 100644
--- a/pydis_site/templates/base/base.html
+++ b/pydis_site/templates/base/base.html
@@ -26,6 +26,18 @@
 <body class="site">
 
 <main class="site-content">
+  {% if messages %}
+    <div class="messages is-full-mobile">
+      {% for message in messages %}
+        <div class="notification is-full-mobile {% if message.tags %}is-{{ message.tags }}{% endif %}">
+          <button class="delete"></button>
+
+          {{ message }}
+        </div>
+      {% endfor %}
+    </div>
+  {% endif %}
+
   {% block content %}
     {{ block.super }}
   {% endblock %}
diff --git a/pydis_site/templates/home/index.html b/pydis_site/templates/home/index.html
index a367fe70..205e92ff 100644
--- a/pydis_site/templates/home/index.html
+++ b/pydis_site/templates/home/index.html
@@ -9,22 +9,6 @@
 {% block content %}
   {% include "base/navbar.html" %}
 
-  {% if messages %}
-    <section class="section message-section is-centered">
-      <div class="columns is-mobile is-centered">
-        <div class="column is-one-third-desktop is-full-tablet is-full-mobile">
-          {% for message in messages %}
-            <div class="notification {% if message.tags %}is-{{ message.tags }}{% endif %}">
-              <button class="delete"></button>
-
-              {{ message }}
-            </div>
-          {% endfor %}
-        </div>
-      </div>
-    </section>
-  {% endif %}
-
   <section class="section">
 
     {# Who are we? #}