@openstack_dev/gatsby-theme-marketing-oif-core 1.0.28 → 1.0.30

package/.prettierrc

@@ -0,0 +1,10 @@
+{
+  "singleQuote": false,
+  "jsxSingleQuote": false,
+  "semi": true,
+  "tabWidth": 2,
+  "bracketSpacing": true,
+  "jsxBracketSameLine": false,
+  "arrowParens": "always",
+  "trailingComma": "none"
+}

package/netlify.toml

@@ -3,263 +3,11 @@
       # Define which paths this specific [[headers]] block will cover.
       for = "/*"
         [headers.values]
-          Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI"
+          Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXIh"
 
     [[redirects]]
-      from = "/marketplace/*"
-      to = "https://devbranch.openstack.org/marketplace/:splat"
+      from = "/community/supporting-organizations/profile/*"
+      to = "https://legacy.openstack.org/community/supporting-organizations/profile/:splat"
       status = 200
       force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/themes/*"
-      to = "https://devbranch.openstack.org/themes/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/navbar/*"
-      to = "https://devbranch.openstack.org/navbar/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/framework/*"
-      to = "https://devbranch.openstack.org/framework/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/googlemaps/*"
-      to = "https://devbranch.openstack.org/googlemaps/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/node_modules/*"
-      to = "https://devbranch.openstack.org/node_modules/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/maps_images/*"
-      to = "https://devbranch.openstack.org/maps_images/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/use-cases/*"
-      to = "https://devbranch.openstack.org/use-cases/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/software/*"
-      to = "https://devbranch.openstack.org/software/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/openstack-map/*"
-      to = "https://devbranch.openstack.org/openstack-map/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/surveys/*"
-      to = "https://devbranch.openstack.org/surveys/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/user-survey/*"
-      to = "https://devbranch.openstack.org/user-survey/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/blog/*"
-      to = "https://devbranch.openstack.org/blog/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/marketing/*"
-      to = "https://devbranch.openstack.org/marketing/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/summit/*"
-      to = "https://devbranch.openstack.org/summit/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/brand/*"
-      to = "https://devbranch.openstack.org/brand/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/community/*"
-      to = "https://devbranch.openstack.org/community/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/events/*"
-      to = "https://devbranch.openstack.org/events/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/ptg/*"
-      to = "https://devbranch.openstack.org/ptg/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/videos/*"
-      to = "https://devbranch.openstack.org/videos/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/summit-video-app/*"
-      to = "https://devbranch.openstack.org/summit-video-app/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/news/*"
-      to = "https://devbranch.openstack.org/summit-video-app/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/favicon/*"
-      to = "https://devbranch.openstack.org/favicon/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/errors_pages/*"
-      to = "https://devbranch.openstack.org/errors_pages/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/speaker_bureau/*"
-      to = "https://devbranch.openstack.org/speaker_bureau/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/coa/*"
-      to = "https://devbranch.openstack.org/coa/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/learn/*"
-      to = "https://devbranch.openstack.org/learn/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/Security/*"
-      to = "https://devbranch.openstack.org/Security/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/OpenStackIdAuthenticator/*"
-      to = "https://devbranch.openstack.org/OpenStackIdAuthenticator/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/profile/*"
-      to = "https://devbranch.openstack.org/profile/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/userprofile/*"
-      to = "https://devbranch.openstack.org/userprofile/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/registration/*"
-      to = "https://devbranch.openstack.org/registration/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/legal/*"
-      to = "https://devbranch.openstack.org/legal/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/ICLA/*"
-      to = "https://devbranch.openstack.org/ICLA/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/marketplaceadmin/*"
-      to = "https://devbranch.openstack.org/marketplaceadmin/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/api/*"
-      to = "https://devbranch.openstack.org/api/:splat"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
-
-    [[redirects]]
-      from = "/community"
-      to = "https://devbranch.openstack.org/community"
-      status = 200
-      force = true
-      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXI", X-From = "netlify", X-Forwarded-Host = "main--oif-marketing-site-dev.netlify.app"}
+      headers = {Authorization = "Basic b3BlbnN0YWNrOlF1YWNrZXIh", X-From = "netlify", X-Forwarded-Host = "www.openstack.org"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@openstack_dev/gatsby-theme-marketing-oif-core",
-  "version": "1.0.28",
+  "version": "1.0.30",
   "description": "Base theme for Marketing Sites",
   "author": "smarcet",
   "keywords": [
@@ -15,7 +15,7 @@
     "format": "prettier --trailing-comma es5 --no-semi --single-quote --write \"{gatsby-*.js,src/**/*.js}\"",
     "prepare": "husky",
     "lint": "eslint src",
-    "precommit": "npx lint-staged --diff=origin/main --verbose",
+    "precommit": "yarn lint-staged --verbose",
     "rewrite_rules": "NODE_ENV=development node redirection-rules.js"
   },
   "lint-staged": {
@@ -23,7 +23,9 @@
     "**/*": "prettier --write --ignore-unknown"
   },
   "dependencies": {
-    "@babel/core": "^7.12.3",
+    "@babel/core": "^7.26.10",
+    "@babel/preset-env": "^7.26.9",
+    "@babel/preset-react": "^7.26.3",
     "@emotion/cache": "^11.11.0",
     "@emotion/react": "^11.11.4",
     "@emotion/server": "^11.11.0",
@@ -152,13 +154,17 @@
     "yup": "^0.32.11"
   },
   "devDependencies": {
+    "@babel/eslint-parser": "^7.27.0",
+    "babel-preset-gatsby": "^3.14.0",
     "eslint": "^7.32.0 || ^8.2.0",
     "eslint-config-airbnb": "^19.0.4",
+    "eslint-config-prettier": "^9.1.0",
     "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-jsx-a11y": "^6.5.1",
     "eslint-plugin-only-warn": "^1.1.0",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
+    "eslint-plugin-unused-imports": "^4.1.4",
     "husky": "^9.0.11",
     "lint-staged": "^15.1.0",
     "prettier": "^2.0.5"

package/src/cms/config/collections/configurationsCollection/index.js

@@ -4,13 +4,14 @@ import siteSettings from "./siteSettings";
 import navbar from "./navbar";
 import footer from "./footer";
 import announcementBanner from "./announcementBanner";
+import siteBanner from "./siteBanner";
 
 const configurationsCollection = {
   ...collectionDefaults({
     label: "Configurations",
-    name: "configurations",
+    name: "configurations"
   }),
-  files: [siteSettings, navbar, footer, announcementBanner],
+  files: [siteSettings, navbar, footer, announcementBanner, siteBanner]
 };
 
 export default configurationsCollection;

package/src/cms/config/collections/configurationsCollection/siteBanner/index.js

@@ -0,0 +1,32 @@
+import { SITE_BANNER_FILE_PATH } from "@utils/filePath";
+import { stringField, textField, booleanField } from "../../../fields";
+
+const siteBanner = {
+  label: "Site Banner",
+  name: "site-banner",
+  file: SITE_BANNER_FILE_PATH,
+  fields: [
+    textField({
+      label: "Text",
+      name: "text",
+      required: true
+    }),
+    stringField({
+      label: "CTA Title",
+      name: "cta_title",
+      required: true
+    }),
+    stringField({
+      label: "CTA Link",
+      name: "cta_link",
+      required: true
+    }),
+    booleanField({
+      label: "Display",
+      name: "display",
+      required: false
+    })
+  ]
+};
+
+export default siteBanner;

package/src/cms/config/collections/configurationsCollection/siteBanner/typeDefs.js

@@ -0,0 +1,7 @@
+module.exports = `
+  type SiteBannerJson implements Node {    
+    text: String
+    cta_title: String
+    cta_link: String
+  }
+`;

package/src/cms/config/collections/configurationsCollection/typeDefs.js

@@ -1,9 +1,11 @@
 const siteSettingsTypeDefs = require("./siteSettings/typeDefs");
 const footerTypeDefs = require("./footer/typeDefs");
 const announcementBannerTypeDefs = require("./announcementBanner/typeDefs");
+const siteBannerTypeDefs = require("./siteBanner/typeDefs");
 
 module.exports = [
   siteSettingsTypeDefs,
   footerTypeDefs,
-  announcementBannerTypeDefs
+  announcementBannerTypeDefs,
+  siteBannerTypeDefs
 ].join("");

package/src/cms/config/index.js

@@ -1,11 +1,9 @@
 import configurationsCollection from "./collections/configurationsCollection";
 
 const CMS_BACKEND_REPO = process.env.GATSBY_CMS_BACKEND_REPO;
-const CMS_BACKEND_BRANCH = process.env.GATSBY_CMS_BACKEND_BRANCH ||  "main";
+const CMS_BACKEND_BRANCH = process.env.GATSBY_CMS_BACKEND_BRANCH || "main";
 
-export const collections = [
-  configurationsCollection,
-];
+export const collections = [configurationsCollection];
 
 const config = {
   backend: {
@@ -17,7 +15,7 @@ const config = {
       update: "Update {{collection}} “{{slug}}”",
       delete: "Delete {{collection}} “{{slug}}”",
       uploadMedia: "[skip ci] Upload “{{path}}”",
-      deleteMedia: "[skip ci] Delete “{{path}}”",
+      deleteMedia: "[skip ci] Delete “{{path}}”"
     }
   },
   // It is not required to set `load_config_file` if the `config.yml` file is
@@ -25,7 +23,7 @@ const config = {
   load_config_file: false,
   media_folder: "static/img",
   public_folder: "/img",
-  collections: collections
+  collections
 };
 
 if (!CMS_BACKEND_REPO || !CMS_BACKEND_BRANCH) {

package/src/components/AnnouncementBanner/index.module.scss

@@ -3,7 +3,7 @@
   color: #ffffff;
   font-size: 12px;
   font-family: "Open Sans", Helvetica, Arial, sans-serif !important;
-  padding: 30px 40px;
+  padding: 30px;
   max-width: 1500px;
   border-radius: 4px;
   justify-content: space-evenly;
@@ -20,42 +20,46 @@
 
   .header {
     text-align: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin-bottom: 10px;
 
     @media (min-width: 900px) {
       text-align: left;
+      justify-content: flex-start;
     }
 
     .title {
-      font-size: 35px;
-      display: inline-block;
-      bottom: 6px;
-      position: relative;
+      font-size: 18px;
+      line-height: 1.3;
       font-family: "Jura", "Helvetica", sans-serif;
       font-weight: 700;
-      vertical-align: middle;
-      margin-bottom: 10px;
-      margin-top: 20px;
+      margin: 0;
+      display: flex;
+      align-items: center;
+      @media (max-width: 900px) {
+        text-align: left;
+        justify-content: flex-start;
+      }
     }
 
     .logo {
-      position: relative;
       height: 50px;
       width: 50px;
+      margin: 0 20px 0 0;
       display: block;
-      margin: 0 auto 10px;
 
       @media (min-width: 1024px) {
-        top: 20px;
-        margin: 0 20px 0 0;
-        display: inline;
+        top: 0;
       }
     }
   }
 
   .text {
     padding-top: 15px;
-    font-size: 18px;
-    line-height: 25px;
+    font-size: 15px;
+    line-height: normal;
     font-family: "Roboto", "Helvetica", sans-serif;
     font-style: normal;
     font-weight: normal;
@@ -65,29 +69,45 @@
   .ctaTitle {
     font-family: "Roboto", "Helvetica", sans-serif;
     font-style: normal;
-    font-size: 18px;
-    line-height: 25px;
+    font-size: 15px;
+    line-height: normal;
     text-align: center;
-    margin-bottom: 15px;
+    margin-bottom: 5px;
     font-weight: bold;
     margin-top: 10%;
+
+    // if ctaTitle is empty, hide the element completely
+    &:empty {
+      display: none;
+      margin: 0;
+    }
+  }
+
+  :global(.MuiGrid-root) {
+    &:has(.cta) {
+      display: flex;
+      align-items: center;
+      height: 100%;
+    }
   }
 
   .cta {
     background-color: #39ae4a;
-    width: 250px;
-    font-size: 20px;
-    min-width: 155px;
-    padding: 1rem;
+    width: 215px;
+    font-size: 15px;
+    min-width: 150px;
+    padding: 10px;
     border-radius: 50px;
-    margin-left: auto;
-    margin-right: auto;
+    margin: auto;
     text-align: center;
     white-space: nowrap;
     display: block;
     color: white;
     text-decoration: none;
-
+    // when ctaTitle is empty, adjust margin
+    .ctaTitle:empty + & {
+      margin: auto;
+    }
     &:hover {
       background-color: white;
       color: black;
@@ -102,6 +122,9 @@
     .img {
       margin-left: 10px;
     }
+    @media (max-width: 900px) {
+      margin-top: 10px;
+    }
   }
 
   .bottomBar {

package/src/components/SiteBanner/index.js

@@ -0,0 +1,22 @@
+import React from "react";
+import { useStaticQuery, graphql } from "gatsby";
+import SiteBannerTemplate from "./template";
+
+const siteBannerQuery = graphql`
+  query {
+    siteBannerJson {
+      text
+      cta_title
+      cta_link
+      display
+    }
+  }
+`;
+
+function SiteBanner() {
+  const { siteBannerJson: siteBannerContent } = useStaticQuery(siteBannerQuery);
+
+  return <SiteBannerTemplate data={siteBannerContent} />;
+}
+
+export default SiteBanner;

package/src/components/SiteBanner/index.module.scss

@@ -0,0 +1,69 @@
+.siteBannerWrapper {
+  display: flex;
+  min-height: 40px;
+  position: relative;
+  left: 0;
+  z-index: 20;
+  background-color: #4d96c7;
+  color: #f0f9fe;
+  font-size: 14px;
+  line-height: 20px;
+  .siteBannerContainer {
+    display: flex;
+    flex-direction: row;
+    text-align: left;
+    align-items: center;
+  }
+  .bannerText {
+    display: inline;
+    font-size: 16px;
+    line-height: 22px;
+    letter-spacing: normal;
+    max-width: 734px;
+    color: white;
+    font-size: 12px;
+    font-family: "Open Sans", Helvetica, Arial, sans-serif;
+    -webkit-font-smoothing: none;
+    -moz-osx-font-smoothing: none;
+    text-rendering: auto;
+    @media (min-width: 991px) {
+      font-size: 16px;
+    }
+  }
+  .bannerButton {
+    margin-left: 20px;
+    border-radius: 5px;
+    border: 1px solid #2f729c;
+    padding: 2px 10px 3px;
+    background-color: #2f729c;
+    display: inline-block;
+    text-transform: uppercase;
+    font-family: "Open Sans", Helvetica, Arial, sans-serif;
+    font-size: 14px;
+    line-height: 20px;
+    letter-spacing: normal;
+    @media (max-width: 574px) {
+      width: 100px;
+      margin: 5px;
+    }
+    &:hover {
+      text-decoration: none;
+      background-color: #f0f9fe;
+      a {
+        color: #2f729c;
+        -webkit-font-smoothing: none;
+        -moz-osx-font-smoothing: none;
+        text-rendering: auto;
+      }
+    }
+    a {
+      color: white;
+      font-size: 90%;
+      line-height: 20px;
+      letter-spacing: normal;
+      -webkit-font-smoothing: none;
+      -moz-osx-font-smoothing: none;
+      text-rendering: auto;
+    }
+  }
+}

package/src/components/SiteBanner/template.js

@@ -0,0 +1,26 @@
+import React from "react";
+import { Container, Typography, Button } from "@mui/material";
+import Link from "../Link";
+
+import styles from "./index.module.scss";
+
+function SiteBannerTemplate({ data }) {
+  const { text, cta_title, cta_link, display } = data || {};
+  if (!display) return null;
+
+  return (
+    <div className={styles.siteBannerWrapper}>
+      <Container maxWidth="xl" className={styles.siteBannerContainer}>
+        <Typography
+          dangerouslySetInnerHTML={{ __html: text }}
+          className={styles.bannerText}
+        />
+        <Button className={styles.bannerButton}>
+          <Link to={cta_link}>{cta_title}</Link>
+        </Button>
+      </Container>
+    </div>
+  );
+}
+
+export default SiteBannerTemplate;

package/src/components/SiteBannerLayout.js

@@ -0,0 +1,36 @@
+import React from "react";
+import PropTypes from "prop-types";
+import loadable from "@loadable/component";
+import Footer from "./Footer";
+import SponsoredProjectsNav from "./SponsoredProjectsNav";
+import SubscribeForm from "./SubscribeForm";
+import NavBarPlaceholder from "./Navbar/placeholder";
+import SiteBanner from "./SiteBanner";
+
+const Navbar = loadable(() => import("./Navbar"), {
+  ssr: false,
+  fallback: <NavBarPlaceholder />
+});
+
+function SiteBannerLayout({ children }) {
+  return (
+    <div>
+      <SponsoredProjectsNav />
+      <SiteBanner />
+      <Navbar />
+      <div>
+        <main id="content-wrapper">
+          {children}
+          <SubscribeForm />
+        </main>
+        <Footer />
+      </div>
+    </div>
+  );
+}
+
+SiteBannerLayout.propTypes = {
+  children: PropTypes.node.isRequired
+};
+
+export default SiteBannerLayout;

package/src/content/site-banner/index.json

@@ -0,0 +1,6 @@
+{
+  "text": "Join the OpenInfra Summit Europe in Paris, Oct 17-19! Registration, CFP & Sponsorships are Open!",
+  "cta_title": "Join Us!",
+  "cta_link": "https://summit2025.openinfra.org/",
+  "display": true
+}

package/src/utils/filePath.js

@@ -10,6 +10,8 @@ const COLORS_SASS_FILE_PATH = `${STYLES_DIR_PATH}/colors.scss`;
 const FONTS_SCSS_FILE_PATH = `${STYLES_DIR_PATH}/fonts.scss`;
 const SITE_SETTINGS_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/site-settings`;
 const SITE_SETTINGS_FILE_PATH = `${SITE_SETTINGS_DIR_PATH}/index.json`;
+const SITE_BANNER_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/site-banner`;
+const SITE_BANNER_FILE_PATH = `${SITE_BANNER_DIR_PATH}/index.json`;
 const MARKETING_PAGE_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/marketing-page`;
 const MARKETING_PAGE_FILE_PATH = `${MARKETING_PAGE_DIR_PATH}/index.json`;
 const LOBBY_PAGE_DIR_PATH = `${STATIC_CONTENT_DIR_PATH}/lobby-page`;
@@ -43,7 +45,8 @@ const SPONSORS_FILE_PATH = `${STATIC_CONTENT_DIR_PATH}/${SPONSORS_FILE_NAME}`;
 const CMS_FONT_FILE_PATH = "/static/fonts/";
 const PAYMENTS_FILE_PATH = `${STATIC_CONTENT_DIR_PATH}/payments.json`;
 const APPLE_PAY_DOMAIN_FILE_PATH = "/static/.well-known/";
-const APPLE_PAY_DOMAIN_FILE_NAME = "apple-developer-merchantid-domain-association";
+const APPLE_PAY_DOMAIN_FILE_NAME =
+  "apple-developer-merchantid-domain-association";
 
 exports.REQUIRED_DIR_PATHS = [
   DATA_DIR_PATH,
@@ -52,7 +55,7 @@ exports.REQUIRED_DIR_PATHS = [
   STYLES_DIR_PATH,
   SITE_SETTINGS_DIR_PATH,
   NAVBAR_DIR_PATH,
-  FOOTER_DIR_PATH,
+  FOOTER_DIR_PATH
 ];
 
 exports.DATA_DIR_PATH = DATA_DIR_PATH;
@@ -63,6 +66,7 @@ exports.COLORS_SASS_FILE_PATH = COLORS_SASS_FILE_PATH;
 exports.FONTS_SCSS_FILE_PATH = FONTS_SCSS_FILE_PATH;
 exports.SITE_SETTINGS_DIR_PATH = SITE_SETTINGS_DIR_PATH;
 exports.SITE_SETTINGS_FILE_PATH = SITE_SETTINGS_FILE_PATH;
+exports.SITE_BANNER_FILE_PATH = SITE_BANNER_FILE_PATH;
 exports.CONTENT_PAGES_DIR_PATH = CONTENT_PAGES_DIR_PATH;
 exports.MARKETING_PAGE_FILE_PATH = MARKETING_PAGE_FILE_PATH;
 exports.LOBBY_PAGE_FILE_PATH = LOBBY_PAGE_FILE_PATH;