Skip to content
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

NG: Switch to modern responsive 3-column layout theme sphinx-basic-ng #390

Merged
merged 85 commits into from
Aug 7, 2024

Conversation

amotl
Copy link
Member

@amotl amotl commented Jul 22, 2023

About

The foundation of the current page design is based on Sphinx' original basic/layout.html, Copyright 2007-2014 by the Sphinx team, so it is already 16 years old, and deserves a modernization.

Following up on GH-378, this patch starts deriving from sphinx-basic-ng, in order to bring in more thorough modernizations, also on the page layout level.

Preview

https://crate-docs-theme--390.org.readthedocs.build/en/390/

Details

It starts with an empty scaffolded canvas. -- 62f971d

image

/cc @surister, @simonprickett

@amotl
Copy link
Member Author

amotl commented Jul 22, 2023

Progress

With header and footer

Now also uses CSS directive position: sticky instead of position: fixed. -- 9fb507e, e135bd4

image

With content

Content, page tools, and version chooser have been migrated. -- 8f63c8e

image

With primary sidebar

For demonstration purposes, it displays an automatically generated navigation tree, as well as the custom semi-static menu provided by the theme. -- 261e5d2, 7d6f812, fb67ada

image

The navigation tree is generated using Furo's compute_navigation_tree, and rendered by partially vendoring a few of Furo's SASS and SCSS styles. It was needed, because Furo's color system currently interferes with the colors defined by the theme. It will be addressed in a future iteration, hopefully being able to get rid of even more legacy styles.

With secondary sidebar

Display the page's toc within the secondary sidebar / right navigation, and make sure the sidebar toggles work. -- 1664079

image
image image image

@amotl amotl force-pushed the amo/basic-ng branch 2 times, most recently from abe6c12 to 1664079 Compare July 23, 2023 01:10
Comment on lines 33 to 37
/* Attempt to fix jumping border */
/*
details.sd-dropdown:not([open]).sd-card
border: 1px solid transparent
*/
Copy link
Member Author

@amotl amotl Jul 23, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This suggestion by @msbt improves the border jumping, but introduces other wobbles, slightly worse, so it has not been used yet.

Base automatically changed from amo/improve-ci to main July 27, 2023 15:30
@amotl amotl force-pushed the amo/basic-ng branch 2 times, most recently from 34bba3b to 6bc6edc Compare July 1, 2024 15:32
@amotl amotl changed the title Switch to modern responsive 3-column layout theme sphinx-basic-ng NG: Switch to modern responsive 3-column layout theme sphinx-basic-ng Jul 8, 2024
@amotl
Copy link
Member Author

amotl commented Jul 18, 2024

Hi again. @msbt contributed significantly to this patch. Thank you very much!

We will integrate those improvements here, and run a devX release, in order to be able to slap the new theme on a few downstream projects in preview mode.

This theme derives from [sphinx-basic-ng], but needs a few components
from [Furo]. For example, the menu builder from Furo's `navigation.py`
is made available to the HTML context via `ng_navigation_tree`.

Therefore, it needs to vendorize a few styles. It can not take the whole
thing, because Furo's colors currently interfere with the colors
provided by the theme's styles.

[Furo]: https://github.com/pradyunsg/furo
[sphinx-basic-ng]: https://github.com/pradyunsg/sphinx-basic-ng
For demonstration purposes, it displays an automatically generated
navigation tree, as well as the custom semi-static menu provided by the
theme.

The navigation tree is generated using Furo's `compute_navigation_tree`.
@amotl amotl requested a review from matkuliak August 7, 2024 15:23
@amotl amotl marked this pull request as ready for review August 7, 2024 15:23
@amotl
Copy link
Member Author

amotl commented Aug 7, 2024

Originally submitted on Jul 22, 2023, more than a year ago, this was quite a long-running patch once again, traveling through marvellous journeys in exciting times. Thank you so much for your support to make it converge well.

We hope all relevant/important teething issues have been resolved so far. If you can spot any other rendering flaws or other misbehaviours, or if you want to share suggestions for further improval, please tell us on a ticket here, or on company Slack. Thank you.

@amotl amotl merged commit a750f88 into main Aug 7, 2024
8 checks passed
@amotl amotl deleted the amo/basic-ng branch August 7, 2024 15:30
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants