Use calc-size in .active > .nav-child

[stevenjoezhang]

PR Checklist

• The changes have been tested (for bug fixes / features).
• Docs in NexT website have been added / updated (for features).

PR Type

• Bugfix.
• Feature.
• Improvement.
• Code style update (e.g. formatting, linting).
• Refactoring (no changes to functionality and APIs).
• Documentation.
• Translation.
• Other... Please describe:

What is the current behavior?

#323 introduced a transition animation for TOC, and due to the need to calculate heights, the author @PaperStrike wrote the algorithm in JavaScript. However, it is not accurate when encountering collapsed rows (#772) and no better solution has been found. I noticed that this issue might be resolved using the newly introduced calc-size in CSS, but it is currently only supported by Chrome and Edge versions 129 and above. We may need to wait until it is supported by other mainstream browsers (such as Safari and Firefox) before merging. You are welcome to test the TOC animation effects on the latest versions of Chrome and Edge.

Issue resolved:

What is the new behavior?

• Link to demo site with this changes:
• Screenshots with this changes:

How to use?

In NexT _config.yml:

[coveralls]

Pull Request Test Coverage Report for Build 11959817132

Details

• 0 of 0 changed or added relevant lines in 0 files are covered.
• No unchanged relevant lines lost coverage.
• Overall coverage remained the same at 97.451%

---

Totals
Change from base Build 11946755901:	0.0%
Covered Lines:	400
Relevant Lines:	405

---

💛 - Coveralls