0
0
mirror of https://github.com/naturalcrit/homebrewery.git synced 2025-12-29 13:22:40 +00:00

Add maximum length, use span for spacing

This commit is contained in:
G.Ambatte
2025-01-03 13:34:52 +13:00
parent bbf6c3589a
commit a95eef0545
2 changed files with 25 additions and 15 deletions

View File

@@ -4,6 +4,8 @@ import * as React from 'react';
import * as _ from 'lodash';
const MAX_TEXT_LENGTH = 40;
const HeaderNav = React.forwardRef(({}, pagesRef)=>{
const [state, setState] = React.useState({
@@ -66,11 +68,20 @@ const HeaderNav = React.forwardRef(({}, pagesRef)=>{
);
const HeaderNavItem = ({ link, text, depth, className })=>{
return <li>
const trimString = (text, prefixLength = 0)=>{
const maxLength = MAX_TEXT_LENGTH - prefixLength;
if(text.trim().length > maxLength){
return `${text.trim().slice(0, maxLength)}...`;
}
return text.trim();
};
return <p>
<a href={`#${link}`} target='_self' className={className}>
{`${'-'.repeat(depth)}${text}`}
<span style={{ display: 'inline-block', width: `${depth * 0.5}em` }}></span>{trimString(text, depth)}
</a>
</li>;
</p>;
};
export default HeaderNav;