0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2026-01-05 12:22:44 +00:00

Add styling to page links

This commit is contained in:
G.Ambatte
2024-07-22 19:07:58 +12:00
parent c269d32247
commit effeffd906
2 changed files with 13 additions and 7 deletions

View File

@@ -26,9 +26,10 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
elements.forEach((el)=>{ elements.forEach((el)=>{
if(el.className.match(/\bpage\b/)) { if(el.className.match(/\bpage\b/)) {
navList.push({ navList.push({
depth : 0, depth : 0,
text : `Page ${el.id.slice(1)}`, text : `Page ${el.id.slice(1)}`,
link : el.id link : el.id,
className : 'pageLink'
}); });
return; return;
} }
@@ -48,7 +49,7 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
}); });
return _.map(navList, (navItem, index)=>{ return _.map(navList, (navItem, index)=>{
return <HeaderNavItem text={navItem.text} link={navItem.link} depth={navItem.depth} index={index} />; return <HeaderNavItem {...navItem} key={index} />;
}); });
}; };
@@ -64,9 +65,11 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
} }
); );
const HeaderNavItem = ({ index, link, text, depth })=>{ const HeaderNavItem = ({ link, text, depth, className })=>{
return <p key={index}> return <p>
<a href={`#${link}`} target='_self'>{`${'-'.repeat(depth)}${text}`}</a> <a href={`#${link}`} target='_self' className={className}>
{`${'-'.repeat(depth)}${text}`}
</a>
</p>; </p>;
}; };

View File

@@ -25,6 +25,9 @@
&:hover { &:hover {
text-decoration: underline; text-decoration: underline;
} }
&.pageLink {
font-weight: 900;
}
} }
} }
} }