hugo-theme-stack
hugo-theme-stack copied to clipboard
Table of contents does not appear on mobile
Describe the bug
There is no way to see the table of contents on mobile.
Expected behavior
There is either a button or a section where I can see and navigate the table of contents, or something else that would make navigating large articles easier.
To Reproduce
Use toc: true
on any article and open the article on a mobile device or in a browser with a narrow window.
Screenshots
Table of contents appears as expected on large displays:
But on narrow ones, it does not appear at all:
Environment
- Hugo version [e.g: 0.80.0]: 0.89.3+extended
- Hugo extended?: Yes
Additional context
Add any other context about the problem here.
If it's a UI issue, fill the following information:
- OS: [e.g. iOS] Windows 11 (21H2 22000.346)
- Browser [e.g. chrome, safari] Edge Chromium Stable
- Version [e.g. 22] 96.0.1054.29
Content of config.yaml
I'd prefer not sharing mine, as I don't think it is related to the issue.
Link to the demo site and/or source repository
None, this is something I encountered while migrating my blog to use the ToC feature instead of manual lists of links to sections.
Now it's designed to behave like this because I didn't occur a nice way to put TOC on a mobile screen 😥.
@CaiJimmy
How about add a float menu buttom at the corner? Click it to show the TOC (pop window or a slide-in animation).
Now it's designed to behave like this because I didn't occur a nice way to put TOC on a mobile screen 😥.
https://xaoxuu.com可以试试这个
Last time, I've been thinking about including TOC at the top of the article. Something like this:
This is my early work, I am not so talented designer :D. But it might be a starting point. It's tablet size view because I do not like the narrow column where the article is positioned, so I am trying to figure out how to restore some space. I've implemented basic behaviour, and it seems to work very well. If this idea seems to be OK, then I can create a PR.
Pull request is Here: https://github.com/CaiJimmy/hugo-theme-stack/pull/615.
@CaiJimmy, since the PR mentioned above will not be added to the code-base, is there any plans to add a ToC to mobile?
why don't we try using a side bar for that to make it responsive