Move messages to the top right

1 files changed, 23 insertions, 2 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 */
 }