diff --git a/src/Components/RedirectBanner/RedirectBanner.jsx b/src/Components/RedirectBanner/RedirectBanner.jsx
new file mode 100644
index 000000000..ddfca474f
--- /dev/null
+++ b/src/Components/RedirectBanner/RedirectBanner.jsx
@@ -0,0 +1,56 @@
+import React, { useEffect, useState } from "react";
+import styles from "./RedirectBanner.module.css";
+
+const REDIRECT_PARAM = "from";
+const REDIRECT_VALUE = "anthology-redirect";
+const DISMISS_KEY = "anthology-redirect-banner-dismissed";
+
+const RedirectBanner = () => {
+ const [visible, setVisible] = useState(false);
+
+ useEffect(() => {
+ const params = new URLSearchParams(window.location.search);
+ const wasRedirected = params.get(REDIRECT_PARAM) === REDIRECT_VALUE;
+
+ if (wasRedirected && !window.localStorage.getItem(DISMISS_KEY)) {
+ setVisible(true);
+ }
+
+ if (params.has(REDIRECT_PARAM)) {
+ params.delete(REDIRECT_PARAM);
+ const newSearch = params.toString();
+ const newUrl =
+ window.location.pathname +
+ (newSearch ? `?${newSearch}` : "") +
+ window.location.hash;
+ window.history.replaceState({}, "", newUrl);
+ }
+ }, []);
+
+ const dismiss = () => {
+ setVisible(false);
+ window.localStorage.setItem(DISMISS_KEY, "1");
+ };
+
+ if (!visible) {
+ return null;
+ }
+
+ return (
+
+
+
+ Did you notice? our url is now docs.blackboard.com!
+
+
+ );
+};
+
+export default RedirectBanner;
diff --git a/src/Components/RedirectBanner/RedirectBanner.module.css b/src/Components/RedirectBanner/RedirectBanner.module.css
new file mode 100644
index 000000000..d90b7bf49
--- /dev/null
+++ b/src/Components/RedirectBanner/RedirectBanner.module.css
@@ -0,0 +1,36 @@
+.redirect-banner {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ gap: 1rem;
+ width: 100%;
+ padding: 0.6rem 1rem;
+ /* Blackboard brand green (#0dac14), darkened for AA contrast with white text */
+ background-color: #0a8a10;
+ border-bottom: 3px solid #0dac14;
+ color: #fff;
+ font-size: 0.95rem;
+ font-weight: 500;
+ text-align: center;
+}
+
+/* Dark mode gets the lighter/true brand green, matching this repo's existing
+ convention of brighter accent colors in dark mode (see custom.css) */
+:global(html[data-theme="dark"]) .redirect-banner {
+ background-color: #0dac14;
+ border-bottom-color: #7ee383;
+}
+
+.dismiss-button {
+ background: none;
+ border: none;
+ color: #fff;
+ font-size: 1.3rem;
+ line-height: 1;
+ cursor: pointer;
+ padding: 0;
+}
+
+.dismiss-button:hover {
+ opacity: 0.8;
+}
diff --git a/src/theme/Root.js b/src/theme/Root.js
new file mode 100644
index 000000000..885de569b
--- /dev/null
+++ b/src/theme/Root.js
@@ -0,0 +1,11 @@
+import React from "react";
+import RedirectBanner from "../Components/RedirectBanner/RedirectBanner";
+
+export default function Root({ children }) {
+ return (
+ <>
+
+ {children}
+ >
+ );
+}