added donate banner

Stefterv · Stefterv · commit 7ec2e6acc988 · 2024-11-30T16:59:28.000+01:00
diff --git a/public/images/p5-wallpaper-desktop.png b/public/images/p5-wallpaper-desktop.png
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
@@ -84,6 +84,12 @@ const headerTopic = topic
       const htmlElement = document.documentElement;
       htmlElement.className = `${storedSettings.join(" ")} ${htmlElement.className}`;
     </script>
+    <link
+      rel="stylesheet"
+      href="https://foundation-donate-banner.netlify.app/static/css/main.css"
+    />
+    <script src="https://foundation-donate-banner.netlify.app/static/js/main.js"
+    ></script>
   </head>
   <body>
     <div class="top-layout-grid">
@@ -111,12 +117,15 @@ const headerTopic = topic
         }
       </header>
       <main id="main-content" class="relative">
-        {HeaderContent && (
-          <div class="px-5 md:px-lg pt-sm pb-lg">
-            <div class="rendered-markdown">
-              <HeaderContent />
+        <div id="processing-banner" style="margin-left: var(--nav-offset-x);">
+        </div>
+        {
+          HeaderContent && (
+            <div class="px-5 md:px-lg pt-sm pb-lg">
+              <div class="rendered-markdown">
+                <HeaderContent />
+              </div>
             </div>
-          </div>
         )}
         <div class={mainContentParentClass}>
           <slot />
diff --git a/styles/global.scss b/styles/global.scss
@@ -535,3 +535,9 @@ input[type="search"]::-webkit-search-results-decoration {
   padding: 10px;
   border: 2px solid #000;
 }
+
+// Donate banner custom properties
+body {
+  --donate-banner-dark: #c01c4c;
+  --donate-banner-background: url('/images/p5-wallpaper-desktop.png');
+}
