fix alert banner show / hide logic, hide apex banner

This commit is contained in:
akcodez
2024-06-17 15:29:33 -07:00
parent a3461dbed1
commit ff6ea9611e

View File

@@ -11,7 +11,7 @@ import { Search } from "@theme/components/Search/Search";
// @ts-ignore // @ts-ignore
const alertBanner = { const alertBanner = {
show: true, show: false,
message: "XRP Ledger Apex is back in Amsterdam", message: "XRP Ledger Apex is back in Amsterdam",
button: "Register Now", button: "Register Now",
link: "https://www.xrpledgerapex.com/?utm_source=email&utm_medium=email_marketing&utm_campaign=EVENTS_XRPL_Apex_2024_Q2&utm_term=events_page_cta_button", link: "https://www.xrpledgerapex.com/?utm_source=email&utm_medium=email_marketing&utm_campaign=EVENTS_XRPL_Apex_2024_Q2&utm_term=events_page_cta_button",
@@ -92,7 +92,7 @@ export function Navbar(props) {
button={alertBanner.button} button={alertBanner.button}
link={alertBanner.link} link={alertBanner.link}
/> />
<NavWrapper belowAlertBanner={true}> <NavWrapper belowAlertBanner={alertBanner.show}>
<LogoBlock to={href} img={logo} alt={altText} /> <LogoBlock to={href} img={logo} alt={altText} />
<NavControls> <NavControls>
<MobileMenuIcon /> <MobileMenuIcon />
@@ -121,21 +121,24 @@ const StyledColorModeSwitcher = styled(ColorModeSwitcher)`
`; `;
export function AlertBanner(props) { export function AlertBanner(props) {
const { message, button, link } = props; const { message, button, link, show } = props;
return ( if (show) {
<div className="top-banner fixed-top"> return (
<div className="inner-apex"> <div className="top-banner fixed-top">
<span> <div className="inner-apex">
<p className="mb-0 apex-banner-text">{message}</p> <span>
</span> <p className="mb-0 apex-banner-text">{message}</p>
<span> </span>
<Link to={link} target="_blank" className="apex-btn"> <span>
{button} <Link to={link} target="_blank" className="apex-btn">
</Link> {button}
</span> </Link>
</span>
</div>
</div> </div>
</div> );
); }
return null;
} }
export function TopNavCollapsible(props) { export function TopNavCollapsible(props) {
@@ -174,7 +177,9 @@ export function NavDropdown(props) {
return ( return (
<div key={index} className={clnm}> <div key={index} className={clnm}>
<h5 className="dropdown-item">{translate(item.labelTranslationKey, item.label)}</h5> <h5 className="dropdown-item">
{translate(item.labelTranslationKey, item.label)}
</h5>
{groupLinks} {groupLinks}
</div> </div>
); );
@@ -187,7 +192,7 @@ export function NavDropdown(props) {
hero_href = pathPrefix + hero_href; hero_href = pathPrefix + hero_href;
} }
const splitlabel = item.label.split(" || "); const splitlabel = item.label.split(" || ");
let splittranslationkey = ["",""] let splittranslationkey = ["", ""];
if (item.labelTranslationKey) { if (item.labelTranslationKey) {
splittranslationkey = item.labelTranslationKey.split(" || "); splittranslationkey = item.labelTranslationKey.split(" || ");
} }