docsify-themeable icon indicating copy to clipboard operation
docsify-themeable copied to clipboard

expand/collapse icons in the sidebar not working when external link present

Open mengqiy opened this issue 3 years ago • 2 comments

We want to use a sidebar like https://github.com/GoogleContainerTools/kpt-functions-catalog/pull/605/files#diff-b8dd38f16c2e1d175b940404cbb1e048a3dfb79e423890a2aa94dd188ae4647b which is generated from https://raw.githubusercontent.com/GoogleContainerTools/kpt/main/site/sidebar.md.

The issue is when external links present, the expand/collapse icons won't show and the inactive part are not collapsed due to misting class=inactive.

Please let me know if you need more information. I'm not an expert in front-end stuff, if I misunderstood something, please let me know. Thanks!

mengqiy avatar Sep 29 '21 00:09 mengqiy

Hi @mengqiy.

Happy to help. There are three important things to consider:

  1. The HTML structure and class name assignments are handled by docsify, not docsify-themeable. Docsify-themeable does include a few fixes via plugins (see here) that modify the HTML structure generated by docsify, but ideally this wouldn't be necessary since docsify-themeable is intended to be a theme and not a way to alter docsify's output.
  2. There needs to be a way to programmatically determine which external links should display an expand/collapse toggle. Is it all links in the sidebar, only the links that reference https://kpt.dev/, or some other pattern? Are there exceptions to consider?
  3. The good news is that there are many ways to address your issue. If we determine a fix that may be helpful for other docsify/docsify-themeable users, we can add the fix to a new version. If your needs are unique, we can explore writing a plugin (it's easy), adding custom CSS, or discuss modifying your sidebar auto-generating script to output HTML instead of markdown as a last resort. Point is, we'll figure it out. :)

jhildenbiddle avatar Oct 02 '21 20:10 jhildenbiddle

Sorry for the late reply.

The behavior I expect: Whenever an item in the sidebar hierarchy has children items, it should display an expand/collapse toggle. It should NOT treat it differently depending on if it links to a local path or a external link.

# for kpt.dev
- [foo](foo/)                  # <========= should display an expand/collapse toggle here
  - [foo child](foo/child/)
- [bar](https://catalog.kpt.dev/bar/ ":target=_self") # <========= should display an expand/collapse toggle here
  - [bar child](https://catalog.kpt.dev/bar/child/ ":target=_self")
- [baz](baz/)
# for catalog.kpt.dev
- [foo](https://kpt.dev/foo/ ":crossorgin :target=_self")  # <========= should display an expand/collapse toggle here
  - [foo child](https://kpt.dev/foo/child/ ":crossorgin :target=_self")
- [bar](bar/ ":target=_self")               # <========= should display an expand/collapse toggle here
  - [bar child](bar/child/ ":target=_self")
- [baz](https://kpt.dev/baz/ ":crossorgin :target=_self")

cc: @etefera

mengqiy avatar Oct 13 '21 18:10 mengqiy

Hi @mengqiy --

Been quite a while on this one. :)

I checked out https://kpt.dev and it looks like you've worked your way around this issue. Closing this issue for now, but happy to work through this if you're still interested. Thx!

jhildenbiddle avatar Dec 06 '23 19:12 jhildenbiddle