Repository navigation
Conversation
hwhsu1231
commented
Sep 1, 2026
hwhsu1231
commented
- Turn prev/next links into bordered, rounded card-style buttons
- Show "Previous"/"Next" label above the page title
- Use accent-a9 for the hover border color
- Keep single prev/next card at half width (prev left, next right)
- Stack the cards vertically via a container query on page width
- Wrap long titles instead of overflowing on narrow widths
- Turn prev/next links into bordered, rounded card-style buttons - Show "Previous"/"Next" label above the page title - Use accent-a9 for the hover border color - Keep single prev/next card at half width (prev left, next right) - Stack the cards vertically via a container query on page width - Wrap long titles instead of overflowing on narrow widths
Preview of the Modification
|
|
Why using a card style? The card style is not pretty. |
In fact, whether it was the previous PR #148 for restyling the globaltoc/localtoc or this PR for restyling the prev/next navigation, both share a common goal: to expand and clarify the clickable button area. In addition, using a card style allows the layout to stack vertically on narrower screens, such as mobile devices. This helps avoid excessive line breaks in the prev/next text as much as possible. For example: 
|
|
Below are a few examples of displaying prev/next navigation using a card style: Zed Documentation (customized mdBook)
Asto Website
Docusaurus Website
MySTMD Website
|
|
Furthermore, the "clickable button area" of the original prev/next navigation style depended on the length of the target page's title:
In contrast, using a card-style prev/next navigation ensures that the "clickable button area" remains equal, at least in terms of width. |
|
@lepture I think this PR can be put on hold for now—no rush to decide on it right away. |
