diff --git a/app/scripts/components/common/banner/banner.scss b/app/scripts/components/common/banner/banner.scss
new file mode 100644
index 000000000..4cd04cc1d
--- /dev/null
+++ b/app/scripts/components/common/banner/banner.scss
@@ -0,0 +1,3 @@
+.usa-banner__button:after {
+    top: 3px;
+}
\ No newline at end of file
diff --git a/app/scripts/components/common/banner/index.tsx b/app/scripts/components/common/banner/index.tsx
index 6272bb57f..127d6b1fd 100644
--- a/app/scripts/components/common/banner/index.tsx
+++ b/app/scripts/components/common/banner/index.tsx
@@ -1,78 +1,136 @@
 import React, { useState } from 'react';
-import { Icon } from '@trussworks/react-uswds';
+import { decode } from 'he';
 import {
   USWDSBanner,
-  USWDSBannerContent
+  USWDSBannerContent,
+  USWDSBannerButton,
+  USWDSBannerFlag,
+  USWDSBannerHeader,
+  USWDSBannerIcon,
+  USWDSBannerGuidance,
+  USWDSMediaBlockBody
 } from '$components/common/uswds/banner';
 
-const BANNER_KEY = 'dismissedBannerUrl';
-
-function hasExpired(expiryDatetime) {
-  const expiryDate = new Date(expiryDatetime);
-  const currentDate = new Date();
-  return !!(currentDate > expiryDate);
+interface Guidance {
+  left?: GuidanceContent;
+  right?: GuidanceContent;
 }
 
-enum BannerType {
-  info = 'info',
-  warning = 'warning'
+interface GuidanceContent {
+  icon?: string;
+  iconAlt?: string;
+  title?: string;
+  text?: string;
 }
 
-const infoTypeFlag = BannerType.info;
 interface BannerProps {
-  appTitle: string;
-  expires: Date;
-  url: string;
-  text: string;
-  type?: BannerType;
+  headerText?: string;
+  headerActionText?: string;
+  ariaLabel?: string;
+  flagImgAlt?: string;
+  leftGuidance?: GuidanceContent;
+  rightGuidance?: GuidanceContent;
+  className?: string;
+  defaultIsOpen?: boolean;
+  contentId?: string;
 }
 
+const DEFAULT_HEADER_TEXT =
+  'An official website of the United States government';
+
+const DEFAULT_HEADER_ACTION_TEXT = "Here's how you know";
+
+const DEFAULT_GUIDANCE: Guidance = {
+  left: {
+    title: 'Official websites use .gov',
+    text: 'A .gov website belongs to an official government organization in the United States.',
+    iconAlt: 'Dot gov icon',
+    icon: '/img/icon-dot-gov.svg'
+  },
+  right: {
+    title: 'Secure .gov websites use HTTPS',
+    text: `
+        A <strong>lock</strong> or <strong>https://</strong> means you've safely
+        connected to the .gov website. Share sensitive information only on
+        official, secure websites.
+      `,
+    iconAlt: 'HTTPS icon',
+    icon: '/img/icon-https.svg'
+  }
+};
+
+const GuidanceBlock = ({
+  content,
+  className
+}: {
+  content: GuidanceContent;
+  className?: string;
+}) => (
+  <USWDSBannerGuidance className={className}>
+    <USWDSBannerIcon src={content.icon} alt={content.iconAlt ?? ''} />
+    <USWDSMediaBlockBody>
+      <p>
+        <strong>{content.title}</strong>
+        <br />
+        <span
+          dangerouslySetInnerHTML={{ __html: decode(content.text ?? '') }}
+        />
+      </p>
+    </USWDSMediaBlockBody>
+  </USWDSBannerGuidance>
+);
+
 export default function Banner({
-  appTitle,
-  expires,
-  url,
-  text,
-  type = infoTypeFlag
+  headerText,
+  headerActionText,
+  ariaLabel,
+  flagImgAlt = '',
+  leftGuidance,
+  rightGuidance,
+  className = '',
+  defaultIsOpen = false,
+  contentId = 'gov-banner-content'
 }: BannerProps) {
+  const [isOpen, setIsOpen] = useState(defaultIsOpen);
 
-  const showBanner = localStorage.getItem(BANNER_KEY) !== url;
-  const [isOpen, setIsOpen] = useState(showBanner && !hasExpired(expires));
+  const leftContent = {
+    ...DEFAULT_GUIDANCE.left,
+    ...leftGuidance
+  } as GuidanceContent;
 
-  function onClose() {
-    localStorage.setItem(BANNER_KEY, url);
-    setIsOpen(false);
-  }
+  const rightContent = {
+    ...DEFAULT_GUIDANCE.right,
+    ...rightGuidance
+  } as GuidanceContent;
 
   return (
-    <div>
-      {isOpen && (
-        <div className='position-relative'>
-          <USWDSBanner
-            aria-label={appTitle}
-            className={type !== infoTypeFlag ? 'bg-secondary-lighter' : ''}
-          >
-            <a href={url} target='_blank' rel='noreferrer'>
-              <USWDSBannerContent
-                className='padding-top-1 padding-bottom-1'
-                isOpen={true}
-              >
-                <div dangerouslySetInnerHTML={{ __html: text }} />
+    <USWDSBanner
+      aria-label={ariaLabel ?? DEFAULT_HEADER_TEXT}
+      className={className}
+    >
+      <USWDSBannerHeader
+        isOpen={isOpen}
+        flagImg={
+          <USWDSBannerFlag src='/img/us_flag_small.png' alt={flagImgAlt} />
+        }
+        headerText={headerText ?? DEFAULT_HEADER_TEXT}
+        headerActionText={headerActionText ?? DEFAULT_HEADER_ACTION_TEXT}
+      >
+        <USWDSBannerButton
+          isOpen={isOpen}
+          onClick={() => setIsOpen((prev) => !prev)}
+          aria-controls={contentId}
+        >
+          {headerActionText ?? DEFAULT_HEADER_ACTION_TEXT}
+        </USWDSBannerButton>
+      </USWDSBannerHeader>
 
-              </USWDSBannerContent>
-            </a>
-          </USWDSBanner>
-          <div className='position-absolute top-0 right-0 margin-right-3 height-full display-flex'>
-            <button
-              className='usa-button usa-button--unstyled'
-              type='button'
-              aria-label='Close Banner'
-              onClick={onClose}
-            >
-              <Icon.Close />
-            </button>
-          </div>
+      <USWDSBannerContent id={contentId} isOpen={isOpen}>
+        <div className='grid-row grid-gap-lg'>
+          <GuidanceBlock content={leftContent} className='tablet:grid-col-6' />
+          <GuidanceBlock content={rightContent} className='tablet:grid-col-6' />
         </div>
-      )}
-    </div>
+      </USWDSBannerContent>
+    </USWDSBanner>
   );
 }
diff --git a/app/scripts/components/common/layout-root/index.tsx b/app/scripts/components/common/layout-root/index.tsx
index 9f67192bb..f69bbd47b 100644
--- a/app/scripts/components/common/layout-root/index.tsx
+++ b/app/scripts/components/common/layout-root/index.tsx
@@ -10,10 +10,15 @@ import { useDeepCompareEffect } from 'use-deep-compare';
 import styled from 'styled-components';
 import { Outlet } from 'react-router';
 import { reveal } from '@devseed-ui/animation';
-import { getBannerFromVedaConfig, getCookieConsentFromVedaConfig } from 'veda';
+import {
+  getBannerFromVedaConfig,
+  getCookieConsentFromVedaConfig,
+  getSiteAlertFromVedaConfig
+} from 'veda';
 import MetaTags from '../meta-tags';
 import PageFooter from '../page-footer';
 const Banner = React.lazy(() => import('../banner'));
+const SiteAlert = React.lazy(() => import('../site-alert'));
 const CookieConsent = React.lazy(() => import('../cookie-consent'));
 
 import { LayoutRootContext } from './context';
@@ -50,6 +55,7 @@ const PageBody = styled.div`
 function LayoutRoot(props: { children?: ReactNode }) {
   const cookieConsentContent = getCookieConsentFromVedaConfig();
   const bannerContent = getBannerFromVedaConfig();
+  const siteAlertContent = getSiteAlertFromVedaConfig();
   const { children } = props;
   const [displayCookieConsentForm, setDisplayCookieConsentForm] =
     useState<boolean>(true);
@@ -74,8 +80,9 @@ function LayoutRoot(props: { children?: ReactNode }) {
         description={description || appDescription}
         thumbnail={thumbnail}
       />
-      {bannerContent && (
-        <Banner appTitle={bannerContent.title} {...bannerContent} />
+      {bannerContent && <Banner {...bannerContent} />}
+      {siteAlertContent && (
+        <SiteAlert appTitle={siteAlertContent.title} {...siteAlertContent} />
       )}
       <NavWrapper
         mainNavItems={mainNavItems}
diff --git a/app/scripts/components/common/site-alert/index.tsx b/app/scripts/components/common/site-alert/index.tsx
new file mode 100644
index 000000000..07b1ec63d
--- /dev/null
+++ b/app/scripts/components/common/site-alert/index.tsx
@@ -0,0 +1,81 @@
+import React, { useState } from 'react';
+import { Icon } from '@trussworks/react-uswds';
+import { decode } from 'he';
+import { USWDSSiteAlert } from '$components/common/uswds/site-alert';
+
+const ALERT_KEY = 'dismissedSiteAlertUrl';
+
+function hasExpired(expiryDatetime?: Date): boolean {
+  if (!expiryDatetime) return false;
+  const expiryDate = new Date(expiryDatetime);
+  const currentDate = new Date();
+  return !!(currentDate > expiryDate);
+}
+
+enum SiteAlertType {
+  info = 'info',
+  emergency = 'emergency'
+}
+
+const infoTypeFlag = SiteAlertType.info;
+
+interface SiteAlertProps {
+  appTitle: string;
+  expires?: Date;
+  content: string;
+  type?: SiteAlertType;
+  heading?: string;
+  showIcon?: boolean;
+  slim?: boolean;
+  className?: string;
+}
+
+export default function SiteAlert({
+  appTitle,
+  expires,
+  content,
+  type = infoTypeFlag,
+  heading,
+  showIcon = true,
+  slim = false,
+  className = ''
+}: SiteAlertProps) {
+  const showAlert = localStorage.getItem(ALERT_KEY) !== content;
+  const [isOpen, setIsOpen] = useState(showAlert && !hasExpired(expires));
+
+  function onClose() {
+    localStorage.setItem(ALERT_KEY, content);
+    setIsOpen(false);
+  }
+
+  return (
+    <div>
+      {isOpen && (
+        <div className='position-relative'>
+          <USWDSSiteAlert
+            aria-label={`${appTitle} site alert`}
+            variant={type}
+            heading={heading}
+            showIcon={showIcon}
+            slim={slim}
+            className={`${className} ${
+              type !== infoTypeFlag ? 'bg-secondary-lighter' : ''
+            }`}
+          >
+            <div dangerouslySetInnerHTML={{ __html: decode(content) }} />
+          </USWDSSiteAlert>
+          <div className='position-absolute top-0 right-0 margin-right-3 height-full display-flex'>
+            <button
+              className='usa-button usa-button--unstyled'
+              type='button'
+              aria-label={`Close ${appTitle} site alert`}
+              onClick={onClose}
+            >
+              <Icon.Close />
+            </button>
+          </div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/app/scripts/components/common/uswds/banner.tsx b/app/scripts/components/common/uswds/banner.tsx
deleted file mode 100644
index ed6cb535e..000000000
--- a/app/scripts/components/common/uswds/banner.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from "react";
-import { Banner, BannerContent } from "@trussworks/react-uswds";
-
-export function USWDSBanner (props) {
-  return <Banner {...props} />;
-}
-
-export function USWDSBannerContent (props) {
-  return <BannerContent {...props} />;
-}
\ No newline at end of file
diff --git a/app/scripts/components/common/uswds/banner/index.tsx b/app/scripts/components/common/uswds/banner/index.tsx
new file mode 100644
index 000000000..375470421
--- /dev/null
+++ b/app/scripts/components/common/uswds/banner/index.tsx
@@ -0,0 +1,42 @@
+import React from 'react';
+import {
+  Banner,
+  BannerContent,
+  BannerButton,
+  BannerFlag,
+  BannerHeader,
+  BannerIcon,
+  BannerGuidance, MediaBlockBody
+} from '@trussworks/react-uswds';
+
+export function USWDSBanner(props) {
+  return <Banner {...props} />;
+}
+
+export function USWDSBannerContent(props) {
+  return <BannerContent {...props} />;
+}
+
+export function USWDSBannerButton(props) {
+  return <BannerButton {...props} />;
+}
+
+export function USWDSBannerFlag(props) {
+  return <BannerFlag {...props} />;
+}
+
+export function USWDSBannerHeader(props) {
+  return <BannerHeader {...props} />;
+}
+
+export function USWDSBannerIcon(props) {
+  return <BannerIcon {...props} />;
+}
+
+export function USWDSBannerGuidance(props) {
+  return <BannerGuidance {...props} />;
+}
+
+export function USWDSMediaBlockBody(props) {
+  return <MediaBlockBody {...props} />;
+}
diff --git a/app/scripts/components/common/uswds/site-alert.tsx b/app/scripts/components/common/uswds/site-alert.tsx
new file mode 100644
index 000000000..926b30e66
--- /dev/null
+++ b/app/scripts/components/common/uswds/site-alert.tsx
@@ -0,0 +1,6 @@
+import React from 'react';
+import { SiteAlert } from '@trussworks/react-uswds';
+
+export function USWDSSiteAlert(props) {
+  return <SiteAlert {...props} />;
+}
diff --git a/app/scripts/components/home/index.tsx b/app/scripts/components/home/index.tsx
index a79767758..d32beaf59 100644
--- a/app/scripts/components/home/index.tsx
+++ b/app/scripts/components/home/index.tsx
@@ -5,7 +5,7 @@ import { Button } from '@devseed-ui/button';
 import { glsp, listReset, media, themeVal } from '@devseed-ui/theme-provider';
 import { Heading } from '@devseed-ui/typography';
 import { CollecticonChevronRightSmall } from '@devseed-ui/collecticons';
-import { getOverride, getBannerFromVedaConfig } from 'veda';
+import { getOverride, getSiteAlertFromVedaConfig } from 'veda';
 
 import rootCoverImage from '../../../graphics/layout/root-welcome--cover.jpg';
 
@@ -25,7 +25,6 @@ import {
   ContentOverride
 } from '$components/common/page-overrides';
 
-
 const homeContent = getOverride('homeContent');
 
 const Connections = styled(Hug)`
@@ -115,10 +114,10 @@ const getCoverProps = () => {
 
     return author
       ? {
-        ...coverProps,
-        attributionAuthor: author.name,
-        attributionUrl: author.url
-      }
+          ...coverProps,
+          attributionAuthor: author.name,
+          attributionUrl: author.url
+        }
       : coverProps;
   } else {
     return {
@@ -134,14 +133,14 @@ const getCoverProps = () => {
 function RootHome() {
   const { show: showFeedbackModal } = useFeedbackModal();
 
-  const banner = getBannerFromVedaConfig();
-  const renderBanner = !!banner && banner.text && banner.url && banner.expires;
+  const siteAlert = getSiteAlertFromVedaConfig();
+  const renderSiteAlert = !!siteAlert && siteAlert.content && siteAlert.expires;
 
   return (
     <PageMainContent>
       <LayoutProps
         title='Welcome'
-        banner={renderBanner ? { ...banner } : null}
+        siteAlert={renderSiteAlert ? { ...siteAlert } : null}
       />
       <ComponentOverride with='homeHero'>
         <PageHeroHome
@@ -173,7 +172,6 @@ function RootHome() {
       </ComponentOverride>
 
       <ContentOverride with='homeContent'>
-
         <Audience />
 
         <FeaturedStories />
diff --git a/app/scripts/styles/styles.scss b/app/scripts/styles/styles.scss
index 9e426c960..9d0b7f448 100644
--- a/app/scripts/styles/styles.scss
+++ b/app/scripts/styles/styles.scss
@@ -2,17 +2,19 @@
 
 @use 'uswds-utilities';
 @use 'usa-layout-grid';
-@use 'usa-banner';
 @use 'usa-button';
+@use 'usa-icon';
 @use 'usa-card';
-@use 'usa-alert';
 @use 'usa-button-group';
-@use 'usa-icon';
 @use 'usa-modal';
 @use 'usa-header';
+@use 'usa-alert';
+@use 'usa-site-alert';
+@use 'usa-banner';
 
 // Custom VEDA UI styles should be added here, so that they can be
 // picked up by Parcel and included in the final CSS bundle for the veda-ui library.
 @use "../components/common/page-header/page-header.scss";
+@use "../components/common/banner/banner.scss";
 @use "../components/common/page-header/logo-container/logo-container.scss";
 @use "../components/common/datepicker/datepicker.scss";
diff --git a/mock/veda.config.js b/mock/veda.config.js
index 5aadadc95..33c8d8a9c 100644
--- a/mock/veda.config.js
+++ b/mock/veda.config.js
@@ -71,6 +71,21 @@ let subNavItems = [
   }
 ];
 
+const defaultGuidance = {
+  left: {
+    title: 'Official websites use .gov',
+    text: 'A <strong>.gov</strong> website belongs to an official government organization in the United States.',
+    iconAlt: 'Dot gov icon',
+    icon: '/img/icon-dot-gov.svg'
+  },
+  right: {
+    title: 'Secure .gov websites use HTTPS',
+    text: `A <strong>lock icon</strong> or <strong>https://</strong> means you've safely connected to the .gov website. Share sensitive information only on official, secure websites.`,
+    iconAlt: 'HTTPS icon',
+    icon: '/img/icon-https.svg'
+  }
+};
+
 if (config.GOOGLE_FORM) {
   subNavItems = [
     ...subNavItems,
@@ -103,10 +118,26 @@ module.exports = {
     }
   },
   banner: {
-    text: 'Read the new data insight on using EMIT and AVIRIS-3 for monitoring large methane emission events.',
-    url: 'stories/emit-and-aviris-3',
-    expires: '2024-08-03T12:00:00-04:00',
-    type: 'info'
+    headerText: 'An official website of the United States government',
+    headerActionText: "Here's how you know",
+    ariaLabel: 'Banner for official government website',
+    flagImgSrc: '/img/us_flag_small.png',
+    flagImgAlt: 'US flag',
+    leftGuidance: defaultGuidance.left,
+    rightGuidance: defaultGuidance.right,
+    className: '',
+    defaultIsOpen: false,
+    contentId: 'gov-banner-content'
+  },
+  siteAlert: {
+    content: `<p class="usa-alert__text">
+        <a target="_blank" rel="noreferrer" href="stories/life-of-water">
+          Discover insights on how the COVID-19 pandemic
+      </a> impacted air quality worldwide, observed through NASA's satellite data.</p>`,
+    expires: '2026-08-03T12:00:00-04:00',
+    type: 'info',
+    slim: true,
+    showIcon: true
   },
   navItems: {
     mainNavItems,
diff --git a/package.json b/package.json
index 831ffd913..7b19318b0 100644
--- a/package.json
+++ b/package.json
@@ -160,6 +160,7 @@
     "@turf/simplify": "^6.5.0",
     "@turf/union": "^6.5.0",
     "@types/geojson": "^7946.0.10",
+    "@types/he": "^1.2.3",
     "@types/mdx": "^2.0.1",
     "@types/react": "18.0.32",
     "@types/react-dom": "18.0.11",
@@ -181,6 +182,7 @@
     "google-polyline": "^1.0.3",
     "gulp-postcss": "^10.0.0",
     "gulp-sass": "^6.0.0",
+    "he": "^1.2.0",
     "history": "^5.1.0",
     "intersection-observer": "^0.12.0",
     "jest-environment-jsdom": "^28.1.3",
diff --git a/parcel-resolver-veda/index.d.ts b/parcel-resolver-veda/index.d.ts
index a47e84c72..156df2c12 100644
--- a/parcel-resolver-veda/index.d.ts
+++ b/parcel-resolver-veda/index.d.ts
@@ -260,18 +260,37 @@ declare module 'veda' {
    * Since we are moving forward to ditching VEDA faux module
    */
 
-  enum BannerType {
+  enum SiteAlertType {
     info = 'info',
-    warning = 'warning'
+    emergency = 'emergency'
   }
 
-  const infoTypeFlag = BannerType.info;
-  interface BannerData {
+  const infoTypeFlag = SiteAlertType.info;
+  interface SiteAlertData {
     expires: Date;
     title: string;
-    url: string;
+    content: string;
+    type?: SiteAlertType;
+  }
+
+  interface BannerData {
+    headerText?: string;
+    headerActionText?: string;
+    ariaLabel?: string;
+    flagImgSrc: string;
+    flagImgAlt?: string;
+    leftGuidance?: GuidanceContent;
+    rightGuidance?: GuidanceContent;
+    className?: string;
+    defaultIsOpen?: boolean;
+    contentId?: string;
+  }
+
+  interface GuidanceContent {
+    icon: string;
+    iconAlt?: string;
+    title: string;
     text: string;
-    type?: BannerType;
   }
 
   interface CookieConsentData {
@@ -342,6 +361,7 @@ declare module 'veda' {
 
   export const getBoolean: (variable: string) => boolean;
 
+  export const getSiteAlertFromVedaConfig: () => SiteAlertData | undefined;
   export const getBannerFromVedaConfig: () => BannerData | undefined;
   export const getCookieConsentFromVedaConfig: () =>
     | CookieConsentData
@@ -349,12 +369,8 @@ declare module 'veda' {
 
   export const getNavItemsFromVedaConfig: () =>
     | {
-        mainNavItems:
-          | (NavLinkItem | DropdownNavLink)[]
-          | undefined;
-        subNavItems:
-          | (NavLinkItem | DropdownNavLink)[]
-          | undefined;
+        mainNavItems: (NavLinkItem | DropdownNavLink)[] | undefined;
+        subNavItems: (NavLinkItem | DropdownNavLink)[] | undefined;
       }
     | undefined;
 
diff --git a/parcel-resolver-veda/index.js b/parcel-resolver-veda/index.js
index f00ca4028..90b2a64ae 100644
--- a/parcel-resolver-veda/index.js
+++ b/parcel-resolver-veda/index.js
@@ -86,7 +86,6 @@ function generateMdxDataObject(data) {
 function getCookieConsentForm(result) {
   if (!result.cookieConsentForm) return undefined;
   else {
-
     const parsedCopy = md.render(result.cookieConsentForm.copy);
     const trimmedCopy = parsedCopy.replace(/(\r\n|\n|\r)/gm, '');
     return JSON.stringify({
@@ -97,19 +96,45 @@ function getCookieConsentForm(result) {
   }
 }
 
+function getSiteAlertContent(result) {
+  if (!result.siteAlert) return undefined;
+
+  const { title, content, expires, type, slim, showIcon, className } =
+    result.siteAlert;
+
+  const parsedText = content ? md.render(content) : '';
+  const trimmedText = parsedText.replace(/(\r\n|\n|\r)/gm, '');
+  return JSON.stringify({
+    title,
+    content: trimmedText,
+    expires,
+    type,
+    slim,
+    showIcon,
+    className
+  });
+}
+
 function getBannerContent(result) {
   if (!result.banner) return undefined;
-  else {
-    const parsedCopy = md.render(result.banner.text);
-    const trimmedCopy = parsedCopy.replace(/(\r\n|\n|\r)/gm, '');
-    return JSON.stringify({
-      title: result.banner.title,
-      text: trimmedCopy,
-      url: result.banner.url,
-      expires: result.banner.expires,
-      type: result.banner.type
-    });
-  }
+
+  const { title, text, leftGuidance, rightGuidance } = result.banner;
+
+  const parsedText = text ? md.render(text) : '';
+  const trimmedText = parsedText.replace(/(\r\n|\n|\r)/gm, '');
+
+  return JSON.stringify({
+    headerText: title,
+    headerActionText: "Here's how you know",
+    ariaLabel: trimmedText || title,
+    flagImgSrc: '/img/us_flag_small.png',
+    flagImgAlt: '',
+    leftGuidance,
+    rightGuidance,
+    className: '',
+    defaultIsOpen: false,
+    contentId: 'gov-banner-content'
+  });
 }
 
 // Using all the "key: path" combinations under config.pageOverrides, load the
@@ -228,6 +253,7 @@ module.exports = new Resolver({
           strings: ${JSON.stringify(withDefaultStrings(result.strings))},
           booleans: ${JSON.stringify(withDefaultStrings(result.booleans))},
           banner: ${getBannerContent(result)},
+          siteAlert: ${getSiteAlertContent(result)},
           navItems: ${JSON.stringify(result.navItems)},
           cookieConsentForm: ${getCookieConsentForm(result)}
         };
@@ -248,6 +274,7 @@ module.exports = new Resolver({
 
         export const getConfig = () => config;
         export const getBannerFromVedaConfig = () => config.banner;
+        export const getSiteAlertFromVedaConfig = () => config.siteAlert;
         export const getNavItemsFromVedaConfig = () => config.navItems;
         export const getCookieConsentFromVedaConfig = () => config.cookieConsentForm;
 
diff --git a/yarn.lock b/yarn.lock
index 480a48781..180b7d2b6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4641,6 +4641,11 @@
   dependencies:
     "@types/unist" "*"
 
+"@types/he@^1.2.3":
+  version "1.2.3"
+  resolved "http://verdaccio.ds.io:4873/@types%2fhe/-/he-1.2.3.tgz#c33ca3096f30cbd5d68d78211572de3f9adff75a"
+  integrity sha512-q67/qwlxblDzEDvzHhVkwc1gzVWxaNxeyHUBF4xElrvjL11O+Ytze+1fGpBHlr/H9myiBUaUXNnNPmBHxxfAcA==
+
 "@types/hoist-non-react-statics@*":
   version "3.3.1"
   resolved "http://verdaccio.ds.io:4873/@types%2fhoist-non-react-statics/-/hoist-non-react-statics-3.3.1.tgz#1124aafe5118cb591977aeb1ceaaed1070eb039f"
@@ -9417,6 +9422,11 @@ hat@0.0.3:
   resolved "http://verdaccio.ds.io:4873/hat/-/hat-0.0.3.tgz#bb014a9e64b3788aed8005917413d4ff3d502d8a"
   integrity sha1-uwFKnmSzeIrtgAWRdBPU/z1QLYo=
 
+he@^1.2.0:
+  version "1.2.0"
+  resolved "http://verdaccio.ds.io:4873/he/-/he-1.2.0.tgz#84ae65fa7eafb165fddb61566ae14baf05664f0f"
+  integrity sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==
+
 history@^5.1.0, history@^5.2.0:
   version "5.3.0"
   resolved "http://verdaccio.ds.io:4873/history/-/history-5.3.0.tgz#1548abaa245ba47992f063a0783db91ef201c73b"
@@ -11378,7 +11388,7 @@ macos-release@^3.1.0:
   resolved "http://verdaccio.ds.io:4873/macos-release/-/macos-release-3.3.0.tgz#92cb67bc66d67c3fde4a9e14f5f909afa418b072"
   integrity sha512-tPJQ1HeyiU2vRruNGhZ+VleWuMQRro8iFtJxYgnS4NQe+EukKF6aGiIT+7flZhISAt2iaXBCfFGvAyif7/f8nQ==
 
-make-dir@^3.0.0:
+make-dir@^3.0.0, make-dir@~3.1.0:
   version "3.1.0"
   resolved "http://verdaccio.ds.io:4873/make-dir/-/make-dir-3.1.0.tgz#415e967046b3a7f1d185277d84aa58203726a13f"
   integrity sha512-g3FeP20LNwhALb/6Cz6Dd4F2ngze0jz7tbzrD2wAV+o9FeNHe4rL+yK2md0J/fiSf1sa1ADhXqi5+oVwOM/eGw==
@@ -13400,10 +13410,10 @@ postcss-selector-parser@^6.0.6:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
 
-postcss-selector-parser@^6.1.2:
-  version "6.1.2"
-  resolved "http://verdaccio.ds.io:4873/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz#27ecb41fb0e3b6ba7a1ec84fff347f734c7929de"
-  integrity sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==
+postcss-selector-parser@^7.0.0:
+  version "7.0.0"
+  resolved "http://verdaccio.ds.io:4873/postcss-selector-parser/-/postcss-selector-parser-7.0.0.tgz#41bd8b56f177c093ca49435f65731befe25d6b9c"
+  integrity sha512-9RbEr1Y7FFfptd/1eEdntyjMwLeghW1bHX9GWjXo19vx4ytPQhANltvVxDggzJl7mnWM+dX28kb6cyS/4iQjlQ==
   dependencies:
     cssesc "^3.0.0"
     util-deprecate "^1.0.2"
@@ -16895,7 +16905,7 @@ yaml@^2.4.2:
   resolved "http://verdaccio.ds.io:4873/yaml/-/yaml-2.6.1.tgz#42f2b1ba89203f374609572d5349fb8686500773"
   integrity sha512-7r0XPzioN/Q9kXBro/XPnA6kznR73DHq+GXh5ON7ZozRO6aMjbmiBuKste2wslTFkC5d1dw0GooOCepZXJ2SAg==
 
-yargs-parser@>=5.0.0-security.0:
+yargs-parser@21.1.1, yargs-parser@>=5.0.0-security.0:
   version "21.1.1"
   resolved "http://verdaccio.ds.io:4873/yargs-parser/-/yargs-parser-21.1.1.tgz#9096bceebf990d21bb31fa9516e0ede294a77d35"
   integrity sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==