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

Tiled layout w/ images for front page #123

Closed
wants to merge 6 commits into from

Conversation

rossbar
Copy link
Collaborator

@rossbar rossbar commented Jan 29, 2022

I had the idea to try to replicate a gallery-like layout on the landing page, similar to what you would get from e.g. sphinx-gallery. I think this is a really effective way to showcase the tutorials as the thumbnail helps summarize the tutorial and hopefully pique the readers' interest.

I couldn't find a tool that would create the gallery in the way I wanted with the necessary flexibility, so I created this manually by combining sphinx-panels for the thumbnail layout and the glue feature from myst_nb for creating the thumbnail content. The downside is that it takes a little extra effort to add a thumbnail (I will have to add the procedure to the contributing doc).

Since this is based on sphinx-panels I also added a couple examples of adding "badges" to the thumbnails as discussed in #7. Currently the badges are purely decorative, but we can (and should) make them linkable to indices of tutorials that share badges, though I'm not planning on pushing on that idea too much in this PR.

Anyways, feedback on the layout idea and the approach used to implement would be appreciated!

@rossbar rossbar added the enhancement New feature or request label Jan 29, 2022
Copy link
Member

@melissawm melissawm left a comment

Choose a reason for hiding this comment

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

This looks really good, thanks @rossbar ! The only comment I have is about the alignment for the thumbnails in the panels - for example, for the fractal tutorial the image is at the top of the panel:

Screen Shot 2022-01-29 at 11 38 47 PM

Is this something that could be configured easily? Not a blocker but just a nice thing to have. Other than that, +1 on merging!

In a follow-up we should definitely come up with a list of tags that don't grow indefinitely. Do you know if there's a way to filter the documents by those tags using sphinx? I've seen some discussion around using page metadata to generate indices but I've never personally done it before. Something for the future perhaps...

@rossbar
Copy link
Collaborator Author

rossbar commented Feb 1, 2022

af82e8e includes some very rudimentary instructions on creating the thumbnail with sphinx-panels. I only added it to the contributing.md so it's not in the readme, but I'd like to deduplicate all of that content in a followup PR.

@melissawm
Copy link
Member

@rossbar I'd love to merge this, is there anything else you'd like to do before we put it in?

@rossbar
Copy link
Collaborator Author

rossbar commented Mar 24, 2022

One drawback of glue is that it does not currently support alt-text, which means some of the thumbnails on the front page wouldn't have alt-text. I'm not sure whether that's a blocker, but it'd be nice to have. The feature seems to be on myst-nb's radar and will hopefully be incorporated soon. It'd also be nice to fix the thumbnail size, but I haven't looked at that yet - again, whether that's a blocker or a follow-up 🤷 .

Aside from those issues, nothing else comes to mind.

@rossbar
Copy link
Collaborator Author

rossbar commented Jan 16, 2023

I'm going to go ahead and close this one, as it's now pretty out of date due to inaction on my end (e.g. sphinx-panels has been replaced with sphinx-design). I still think this is a worthwhile endeavor but so much has changed in the underlying tooling that it's probably worth a fresh start.

Thanks for the feedback!

@rossbar rossbar closed this Jan 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants