diff --git a/website/package-lock.json b/website/package-lock.json index 9f75ef622..91031233d 100644 --- a/website/package-lock.json +++ b/website/package-lock.json @@ -3248,6 +3248,28 @@ "resolved": "https://registry.npmjs.org/@hashicorp/react-alert/-/react-alert-2.0.0.tgz", "integrity": "sha512-9CvkSJ2Onvy+1sXg0n0E3V4X0tl4u9wmp10ISQ4Wh55tstVeBBj/WhqBg8+MZlm9Ib9K903J2A3aDSWBo6k44w==" }, + "@hashicorp/react-alert-banner": { + "version": "3.0.11", + "resolved": "https://registry.npmjs.org/@hashicorp/react-alert-banner/-/react-alert-banner-3.0.11.tgz", + "integrity": "sha512-a81+GmqszYdgnKizChl/iaBcZl0JqvhnIszkicmRll9Tgp6aiQLpVQuiGS8HR/TIIvT2u7jA5FnKEQrTiAf8HQ==", + "requires": { + "@hashicorp/react-global-styles": "^4.0.10", + "js-cookie": "2.2.0", + "slugify": "1.3.4" + }, + "dependencies": { + "js-cookie": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/js-cookie/-/js-cookie-2.2.0.tgz", + "integrity": "sha1-Gywnmm7s44ChIWi5JIUmWzWx7/s=" + }, + "slugify": { + "version": "1.3.4", + "resolved": "https://registry.npmjs.org/slugify/-/slugify-1.3.4.tgz", + "integrity": "sha512-KP0ZYk5hJNBS8/eIjGkFDCzGQIoZ1mnfQRYS5WM3273z+fxGWXeN0fkwf2ebEweydv9tioZIHGZKoF21U07/nw==" + } + } + }, "@hashicorp/react-button": { "version": "2.1.6", "resolved": "https://registry.npmjs.org/@hashicorp/react-button/-/react-button-2.1.6.tgz", diff --git a/website/package.json b/website/package.json index 8fc07d7f5..879c1040d 100644 --- a/website/package.json +++ b/website/package.json @@ -8,6 +8,7 @@ "@bugsnag/plugin-react": "^6.5.0", "@hashicorp/nextjs-scripts": "^6.0.0-2", "@hashicorp/react-alert": "^2.0.0", + "@hashicorp/react-alert-banner": "^3.0.11", "@hashicorp/react-button": "^2.1.6", "@hashicorp/react-call-to-action": "^0.1.3", "@hashicorp/react-case-study-slider": "^2.0.10", diff --git a/website/pages/_app.js b/website/pages/_app.js index bc4e251b0..dc1d00714 100644 --- a/website/pages/_app.js +++ b/website/pages/_app.js @@ -5,6 +5,7 @@ import Router from 'next/router' import ProductSubnav from '../components/subnav' import MegaNav from '@hashicorp/react-mega-nav' import Footer from '@hashicorp/react-footer' +import AlertBanner from '@hashicorp/react-alert-banner' import { ConsentManager, open } from '@hashicorp/react-consent-manager' import consentManagerConfig from '../lib/consent-manager-config' import bugsnagClient from '../lib/bugsnag' @@ -71,6 +72,13 @@ class NextApp extends App { { href: '/fonts/dejavu/mono.woff2', as: 'font' }, ]} /> + diff --git a/website/pages/style.css b/website/pages/style.css index 61abbfbc0..b99b06177 100644 --- a/website/pages/style.css +++ b/website/pages/style.css @@ -5,6 +5,7 @@ @import '~@hashicorp/react-global-styles/custom-properties/font.css'; @import '~@hashicorp/react-global-styles/_temporary-to-remove/layout.css'; @import '~@hashicorp/react-global-styles/_temporary-to-remove/tables.css'; +@import '~@hashicorp/react-alert-banner/dist/style.css'; :root { --highlight-color: var(--nomad);