From 44187658be8d0ed8a239e5d2d64d0f34f315fe6c Mon Sep 17 00:00:00 2001
From: David Cook <david@redcliffs.net>
Date: Thu, 30 Nov 2023 16:13:45 +1100
Subject: [PATCH] Copy messages styles for admin_v3

---
 app/webpacker/css/admin_v3/all.scss           |  2 +-
 .../css/admin_v3/components/messages.scss     | 72 +++++++++++++++++++
 2 files changed, 73 insertions(+), 1 deletion(-)
 create mode 100644 app/webpacker/css/admin_v3/components/messages.scss

diff --git a/app/webpacker/css/admin_v3/all.scss b/app/webpacker/css/admin_v3/all.scss
index 3ee85908f9..6e4fe6b7bb 100644
--- a/app/webpacker/css/admin_v3/all.scss
+++ b/app/webpacker/css/admin_v3/all.scss
@@ -56,7 +56,7 @@
 @import "../admin/components/dialogs";
 @import "../admin/components/input";
 @import "../admin/components/jquery_dialog";
-@import "../admin/components/messages";
+@import "components/messages"; // admin_v3
 @import "components/navigation"; // admin_v3
 @import "../admin/components/ng-cloak";
 @import "../admin/components/page_actions";
diff --git a/app/webpacker/css/admin_v3/components/messages.scss b/app/webpacker/css/admin_v3/components/messages.scss
new file mode 100644
index 0000000000..61dd751a55
--- /dev/null
+++ b/app/webpacker/css/admin_v3/components/messages.scss
@@ -0,0 +1,72 @@
+.errorExplanation {
+  padding: 10px;
+  border: 1px solid very-light($color-error, 12);
+  background-color: very-light($color-error, 6);
+  border-radius: 3px;
+  color: $color-error;
+  margin-bottom: 15px;
+
+  h2 {
+    font-size: 140%;
+    color: $color-error;
+    margin-bottom: 5px;
+  }
+
+  p {
+    padding: 10px 0;
+  }
+
+  ul {
+    list-style-position: inside;
+
+    li {
+      font-weight: $font-weight-bold;
+    }
+  }
+}
+
+.flash-container {
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  z-index: 1000;
+
+  .flash {
+    padding: 18px;
+    text-align: center;
+    font-size: 120%;
+    color: $color-1;
+    font-weight: 600;
+    margin-top: 0;
+
+    &.notice {
+      background-color: rgba($color-notice, 0.8);
+    }
+    &.success {
+      background-color: rgba($color-success, 0.8);
+    }
+    &.error {
+      background-color: rgba($color-error, 0.8);
+    }
+
+    // Adjust heights to fit main layout dimension (header, navbar...)
+    &:nth-child(2) {
+      padding: 24px;
+    }
+    &:nth-child(3) {
+      padding: 20px;
+    }
+  }
+}
+
+.notice:not(.flash) {
+  padding: 1rem;
+  margin-bottom: 1.5rem;
+  background-color: $spree-light-blue;
+  border-radius: $border-radius;
+
+  a {
+    font-weight: bold;
+  }
+}