Try changing <a> to <Link> in topnav

This commit is contained in:
mDuo13
2024-05-17 15:22:52 -07:00
parent 52233899b5
commit 9973e0d77c

View File

@@ -129,9 +129,9 @@ export function AlertBanner(props) {
<p className="mb-0 apex-banner-text">{message}</p> <p className="mb-0 apex-banner-text">{message}</p>
</span> </span>
<span> <span>
<a href={link} target="_blank" className="apex-btn"> <Link to={link} target="_blank" className="apex-btn">
{button} {button}
</a> </Link>
</span> </span>
</div> </div>
</div> </div>
@@ -164,9 +164,9 @@ export function NavDropdown(props) {
item2_href = pathPrefix + item2_href; item2_href = pathPrefix + item2_href;
} }
return ( return (
<a key={index2} className={cls2} href={item2_href}> <Link key={index2} className={cls2} to={item2_href}>
{translate(item2.labelTranslationKey, item2.label)} {translate(item2.labelTranslationKey, item2.label)}
</a> </Link>
); );
}); });
@@ -195,18 +195,18 @@ export function NavDropdown(props) {
const description = translate(splittranslationkey[1], splitlabel[1]); // splitlabel[1] might be undefined, that's ok const description = translate(splittranslationkey[1], splitlabel[1]); // splitlabel[1] might be undefined, that's ok
return ( return (
<a <Link
key={index} key={index}
className="dropdown-item dropdown-hero" className="dropdown-item dropdown-hero"
id={hero_id} id={hero_id}
href={hero_href} to={hero_href}
> >
<img id={item.hero} alt={img_alt} src={item.icon} /> <img id={item.hero} alt={img_alt} src={item.icon} />
<div className="dropdown-hero-text"> <div className="dropdown-hero-text">
<h4>{newlabel}</h4> <h4>{newlabel}</h4>
<p>{description}</p> <p>{description}</p>
</div> </div>
</a> </Link>
); );
} else { } else {
const cls = item.external const cls = item.external
@@ -217,9 +217,9 @@ export function NavDropdown(props) {
item_href = pathPrefix + item_href; item_href = pathPrefix + item_href;
} }
return ( return (
<a key={index} className={cls} href={item_href}> <Link key={index} className={cls} to={item_href}>
{translate(item.labelTranslationKey, item.label)} {translate(item.labelTranslationKey, item.label)}
</a> </Link>
); );
} }
}); });
@@ -231,7 +231,7 @@ export function NavDropdown(props) {
<li className="nav-item dropdown"> <li className="nav-item dropdown">
<a <a
className="nav-link dropdown-toggle" className="nav-link dropdown-toggle"
href="#" to="#"
id={toggler_id} id={toggler_id}
role="button" role="button"
data-toggle="dropdown" data-toggle="dropdown"
@@ -286,13 +286,13 @@ export function GetStartedButton() {
const { translate } = useTranslate(); const { translate } = useTranslate();
return ( return (
<a <Link
className="btn btn-primary" className="btn btn-primary"
href={"/docs/tutorials"} to={"/docs/tutorials"}
style={{ height: "38px", paddingTop: "11px" }} style={{ height: "38px", paddingTop: "11px" }}
> >
{translate("Get Started")} {translate("Get Started")}
</a> </Link>
); );
} }
@@ -311,9 +311,9 @@ export function NavItem(props) {
export function LogoBlock(props) { export function LogoBlock(props) {
const { to, img, altText } = props; const { to, img, altText } = props;
return ( return (
<a className="navbar-brand" href="/"> <Link className="navbar-brand" to="/">
<img className="logo" alt={"XRP LEDGER"} height="40" src="data:," /> <img className="logo" alt={"XRP LEDGER"} height="40" src="data:," />
</a> </Link>
); );
} }