From 56b75ad9fb5f6848db32c183c76304836c976ffa Mon Sep 17 00:00:00 2001
From: Gaetan Craig-Riou <gaetan.riou@gmail.com>
Date: Thu, 23 Nov 2023 16:24:30 +1100
Subject: [PATCH] Per review, stream line the css

Reuse existing css when possible, and use variable for z-index so its
easier to track usage of z-index
---
 app/views/admin/_terms_of_service_banner.html.haml    |  4 ++--
 app/webpacker/css/admin/globals/variables.scss        |  4 ++++
 app/webpacker/css/admin/terms_of_service_banner.scss  |  4 ++--
 app/webpacker/css/admin_v3/globals/variables.scss     |  4 ++++
 .../css/admin_v3/terms_of_service_banner.scss         | 11 +++--------
 5 files changed, 15 insertions(+), 12 deletions(-)

diff --git a/app/views/admin/_terms_of_service_banner.html.haml b/app/views/admin/_terms_of_service_banner.html.haml
index 409d1ccf7d..30d252467c 100644
--- a/app/views/admin/_terms_of_service_banner.html.haml
+++ b/app/views/admin/_terms_of_service_banner.html.haml
@@ -1,5 +1,5 @@
-.banner-container#banner-container
-  .terms-of-service-banner
+#banner-container
+  .terms-of-service-banner.form-actions
     .column-left
       %p= t("admin.terms_of_service_have_been_updated_html", tos_link: link_to(t("admin.terms_of_service"), TermsOfServiceFile.current_url, target: "_blank"))
     .column-right
diff --git a/app/webpacker/css/admin/globals/variables.scss b/app/webpacker/css/admin/globals/variables.scss
index 7ea08bbc7d..ef335f5492 100644
--- a/app/webpacker/css/admin/globals/variables.scss
+++ b/app/webpacker/css/admin/globals/variables.scss
@@ -149,3 +149,7 @@ $border-radius:                  3px !default;
 
 $font-weight-bold:               600 !default;
 $font-weight-normal:             400 !default;
+
+// z-index
+//--------------------------------------------------------------
+$tos-banner-z-index: 102;
diff --git a/app/webpacker/css/admin/terms_of_service_banner.scss b/app/webpacker/css/admin/terms_of_service_banner.scss
index ec46c268e0..5d86332018 100644
--- a/app/webpacker/css/admin/terms_of_service_banner.scss
+++ b/app/webpacker/css/admin/terms_of_service_banner.scss
@@ -1,9 +1,9 @@
-.banner-container {
+#banner-container {
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
-  z-index: 1000;
+  z-index: $tos-banner-z-index;
 
   .terms-of-service-banner {
     padding: 18px;
diff --git a/app/webpacker/css/admin_v3/globals/variables.scss b/app/webpacker/css/admin_v3/globals/variables.scss
index e41f2a9597..48dc0ab62d 100644
--- a/app/webpacker/css/admin_v3/globals/variables.scss
+++ b/app/webpacker/css/admin_v3/globals/variables.scss
@@ -176,3 +176,7 @@ $font-weight-normal:             400 !default;
 $btn-relaxed-height:             40px !default;
 $btn-regular-height:             32px !default;
 $btn-condensed-height:           26px !default;
+
+// z-index
+//--------------------------------------------------------------
+$tos-banner-z-index: 102;
diff --git a/app/webpacker/css/admin_v3/terms_of_service_banner.scss b/app/webpacker/css/admin_v3/terms_of_service_banner.scss
index 32f3855571..0d2b4f3f6f 100644
--- a/app/webpacker/css/admin_v3/terms_of_service_banner.scss
+++ b/app/webpacker/css/admin_v3/terms_of_service_banner.scss
@@ -1,18 +1,13 @@
-.banner-container {
+#banner-container {
   position: fixed;
   bottom: 0;
   left: 0;
   width: 100%;
-  z-index: 1000;
+  z-index: $tos-banner-z-index;
   padding: 0 1.5%;
+  min-height: 50px;
 
   .terms-of-service-banner {
-    background-color: $fair-pink;
-    border: none;
-    border-left: 4px solid $red;
-    border-radius: 4px;
-    margin: 0.5em 0;
-    padding: 0;
     display: flex;
 
     .column-left {