add an announcement bar about the docs merge, and supporting styles

docusaurus.config.js

@@ -85,6 +85,10 @@ const config = {
   themeConfig:
     /** @type {import('@docusaurus/preset-classic').ThemeConfig} */
     ({
+      announcementBar: {
+        id: 'announcementBar-migration',
+        content: "🎉️ <strong>We're moving!!</strong> 🎉️ We're merging the Soroban documentation into the <a target='_blank' href='https://developers.stellar.org'>Stellar Developers</a> documentation. Please check <a target='_blank' href='https://github.com/stellar/soroban-docs/issues/740'>this GH issue</a> for progress and updates.",
+      },
       image: 'img/meta.png',
       docs: {
         sidebar: {

src/css/custom.scss

@@ -20,6 +20,7 @@
 
 /* You can override the default Infima variables here. */
 :root {
+  --site-primary-hue-saturation: 179 68%;
   --ifm-color-primary: #4daaa9;
   // --ifm-background-color: #ffffff;
   // --ifm-background-surface-color: #fafafa;
@@ -49,6 +50,7 @@
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 [data-theme="dark"] {
+  --site-primary-hue-saturation: 50 94%;
   --ifm-color-primary: #f9db4a;
   --ifm-color-secondary: #4daaa9;
   --ifm-navbar-background-color: #1b1b1d;
@@ -177,3 +179,24 @@ select[data-testid="example-pairing-select"] {
 .sidebar-category-items-hidden ul {
   display: none !important;
 }
+
+/* Announcement Bar(s) */
+
+div[class^='announcementBar_'] {
+  font-size: 18px;
+
+  --site-announcement-bar-stripe-color1: hsl(
+    var(--site-primary-hue-saturation) 85%
+  );
+  --site-announcement-bar-stripe-color2: hsl(
+    var(--site-primary-hue-saturation) 95%
+  );
+
+  background: repeating-linear-gradient(
+    35deg,
+    var(--site-announcement-bar-stripe-color1),
+    var(--site-announcement-bar-stripe-color1) 20px,
+    var(--site-announcement-bar-stripe-color2) 10px,
+    var(--site-announcement-bar-stripe-color2) 40px
+  );
+}