-
-
Notifications
You must be signed in to change notification settings - Fork 361
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Minor issue for highlighting the active topic links #1241
Comments
This issue occurs also when I run the locale server with npm run dev Your provided example page do not show such issues, but that page has not much content. From the links at the top of the page, we might get the feeling that names with spaces or hyphens has this issue. But comparing with the similar issue of the link section on the right, some links with space work, and some not. So no idea from my side. |
Links at the right of your page https://getdoks.org/docs/reference/markdown-extended-syntax/ has issue too: First entry "Table" gets highlighted. Second entry "Fenced code block" gets not highlighted when clicked, but third entry instead! For all following links, there is an offset of one. Similar issues for the right menu in https://getdoks.org/docs/reference/markdown-basic-syntax/ |
There are some options for that in # Doks (@hyas/doks-core)
[doks]
# Color mode
colorMode = "dark" # auto (default), light or dark
colorModeToggler = false # true (default) or false (this setting is only relevant when colorMode = auto)
|
So setting the initial default to dark, and still showing the colorModeToggler, is not possible? What I would like best is having dark mode as default (when the page is visited for the first time) but giving the user the option to switch to light. Well, maybe that is technically not possible -- no problem, most users should be smart enough to discover the color toggler. Perhaps "auto" is indeed the best default. The actual "issue for highlighting the active topic links" is still present. I have done some more testing, and have no idea what is actually going on, but it works not always correctly. |
That's correct. This is how it works currently:
We could extend the logic for your use case I think, but I'm not 100% sure yet — I have to give it some more thought (how would it work with the system-wide setting — which one wins so to speak). |
The links in the Table of Contents get highlighted using Scrollspy. Settings are via data attributes in <body class="{{ delimit (.Scratch.Get "class") " " }}"{{ if eq site.Params.doks.scrollSpy true }} data-bs-spy="scroll" data-bs-target="#toc" data-bs-root-margin="0px 0px -60%" data-bs-smooth-scroll="true" tabindex="0"{{ end }}> If you'd like to customize |
I noticed that when you add and remove content, the active class on main navbar items do not always get updated. What I find is that when I clean Hugo's build directories (and run the So, try with running something like: npx shx rm -rf public resources .hugo_build.lock |
npx shx rm -rf public resources .hugo_build.lock When I run that, I get a warning:
But it might fix the issue, I will further investigate. But note that your own page has a similar issue as well, as I wrote before: |
OK, no warning with a copy of my own page:
But still issues with the link menu on the right! Well this is for firefox-126.0, I have currently no other browser available. If you can not reproduce this issue, I could test later with Chromium browser, but that one takes a few hours to build from source on my Gentoo box. |
Not sure if (and how) this can be fixed properly — it's a Bootstrap thing (to be taken upstream). See also for example this Bootstrap documentation link (expected to highlight Methods, but highlighting Events instead — when clicking Methods in the ToC): https://getbootstrap.com/docs/5.3/components/scrollspy/#methods |
There are no ideal Options that fit all use cases (unfortunately), so you could tinker with them to support your setup (or accept the current situation — for now) |
Well it is not a too important issue, only careful users might notice it. Your advice "npx shx rm -rf public resources .hugo_build.lock" seems to have fixed the link menu at the top, which is more important. My sides look really good now, and work well. So I made a $20 donation to the Doks projects yesterday. Not much, but the two pages are nothing I get any profit from. I sold only two pieces of the Nim book in the last 12 months, so before updating the pages to Doks 1.x, I even considered fully removing them from Internet. |
Thanks for your financial contribution and for raising your questions and sharing your thoughts. It helps to improve Doks! Are you ok with me adding the Nim Programming Book site to the Doks showcase? It will get you some traffic and hopefully more book sales 😉 |
Yes of course, you can use both pages as showcase. I think the general Nim info page created with help of GPT-4 is more interesting: The book page https://nimprogrammingbook.com/ is more boring. And I have no hope to selling more Nim books -- while the Nim language is really a fine language, it seems to be in trouble now, many old users left, and no new users are coming. A good languages makes not that much sense, when the number of users and developers drops nearly to zero. I have to admit that I have done no Nim work in the last 12 months any more, mostly for personal differences with the core Nim dev. I am learning Rust now. Python, Go, Rust, Julia, Mojo, Kotlin seems to be the more attractive candidates for most people now. |
I added the Nim Programming site: https://getdoks.org/showcase/ Good luck and all the best! |
It is a bit difficult to explain this tiny issue. At least I think it is an issue, as I have no idea what I might have done wrong.
My two pages
https://nimprogramming.com/ and https://nimprogrammingbook.com/ have no been updated to latest Hyas/Doks, and are mostly fine.
One observation is, that the highlight of selected links does sometimes not work. For example, for https://nimprogramming.com/ we have at the top the menu bar with "Nim About-Nim Tutorials ...". When I click on "Tutorials" that link is drawn blue and bold. But when I click on "About-Nim" there is no blue and bold, just plain display. The same for the other links in the menu, sometimes highlight works, sometimes not. The same for https://nimprogrammingbook.com/ -- for "Blog" highlight works, for "Imprint & Contact" not.
That is with Firefox on Linux.
Similar problems for right side links of https://nimprogramming.com/docs/about-nim/
For some links highlight works, for others not. And sometimes I click on one link, and another one is highlighted.
Here is the source-code of that page, should be OK:
Paste the information here as shown by
npm run info
Two other remarks: A feature to hide the links at the bottom of content pages world be fine. You told me already a way to remove them, but I have let then visible for now.
I like the dark mode for my pages. Is it possible to make dark theme the default, or have each user select dark on its own? Some users might not know that they can switch to the dark theme.
The text was updated successfully, but these errors were encountered: