diff --git a/src/components/LandingPage/GlobalStyles/index.jsx b/src/components/LandingPage/GlobalStyles/index.jsx index 4d8ee6de..67034dfc 100644 --- a/src/components/LandingPage/GlobalStyles/index.jsx +++ b/src/components/LandingPage/GlobalStyles/index.jsx @@ -279,13 +279,13 @@ ul li:last-child { .header__announcement { position: relative; - background: var(--light-blue); + background: #8a77ff; z-index: 101; } @media only screen and (max-width: 1024px) { .header__announcement { - background: rgba(94, 0, 255, 0.9); + background: #8a77ff; } } @@ -298,18 +298,21 @@ ul li:last-child { } .header__announcement__wrapper p { - font-size: 1.4rem; + font-size: 1.6rem; margin-bottom: 0; font-weight: 700; } .header__announcement__wrapper p a { - display: none; text-decoration: underline; } @media only screen and (max-width: 1023px) { - .header__announcement__wrapper p a { + .header__announcement__wrapper p { + font-size: 1.4rem; + } + + .header__announcement__wrapper a { display: inline-block; } } diff --git a/src/components/LandingPage/Header/index.jsx b/src/components/LandingPage/Header/index.jsx index 1dad28ef..429d3039 100644 --- a/src/components/LandingPage/Header/index.jsx +++ b/src/components/LandingPage/Header/index.jsx @@ -9,6 +9,9 @@ const Header = () => { const [showMobileMenu, setShowMobileMenu] = useState(false); const [isVisible, setIsVisible] = useState(true); const [lastScrollY, setLastScrollY] = useState(0); + const announcement = { + show: true, + }; useEffect(() => { const controlNavbar = () => { @@ -41,6 +44,20 @@ const Header = () => { className={`header ${isVisible ? '' : 'header--hidden'}`} id="header" > + {announcement.show && ( +
+ 🚀Just in: PillarX Algorithmic Insights! Trade smarter with + PillarX.{' '} + + Start your FREE 7-day trial + +
++ 🚀Just in: PillarX Algorithmic Insights! Trade smarter with PillarX. + + + Start your FREE 7-day trial + +
+