nodejs.org icon indicating copy to clipboard operation
nodejs.org copied to clipboard

Enhancement: Breadcrumb breakpoint

Open TenzDelek opened this issue 1 year ago • 2 comments

Enter your suggestions in details:

Issue

some of the breadcrumb that are long have a inconsistent layout. resulting in some layout shifting of the breadcrumb detail. image image

also in some case, the layout is breaking down like this below: image ref:

  1. https://nodejs.org/en/learn/getting-started/nodejs-the-difference-between-development-and-production

idea

Proposal: creating a breakpoint function of till 4 word (seems ideal when i tried)

Solution preview

  • only trigger the breakpoint when the word count excede 4 image image

TenzDelek avatar Jun 01 '24 16:06 TenzDelek

I believe we can set the width to 100% and simply add ellipsis in case the title is too long.

We also added a breakpoint that for small screens only the last node would show. But that seems to not be enough of course.

I don't think we should have line breaks, but have "..." when the text is too long 👀

ovflowd avatar Jun 02 '24 16:06 ovflowd

I believe we can set the width to 100% and simply add ellipsis in case the title is too long.

We also added a breakpoint that for small screens only the last node would show. But that seems to not be enough of course.

I don't think we should have line breaks, but have "..." when the text is too long 👀

definitely that sounds great. will implement that instead of the line break 👍

TenzDelek avatar Jun 02 '24 16:06 TenzDelek