restyle 'Give feedback' button

canonical / sphinx-docs-starter-pack

A documentation starter-pack

https://canonical-starter-pack.readthedocs-hosted.com/

10 stars 30 forks source link

restyle 'Give feedback' button #219

Closed akcano closed 1 month ago

akcano commented 2 months ago

This addresses canonical/sphinx-docs-starter-pack#63.

akcano commented 2 months ago

@s-makin Done!

ru-fu commented 2 months ago

@danielmutis - Any feedback regarding the "Give feedback" button placed in the header vs. on the page?

s-makin commented 2 months ago

@s-makin Done!

I'm not sure why, but the font seems to have been made bold in this iteration - was that intended?

In the current live implementation, the feedback button is located on the body of the page, which means it remains visible on the page when resized on smaller devices.

One problem I've spotted when playing about with this on different screen sizes is that the header gets quite messed up, and the "give feedback" feature gets removed completely. I'm not sure what the solution is, but we ideally we want the button to be available and easy to find, even if someone is reading the docs on a phone or tablet. We could perhaps experiment with putting it at the top of the right-hand sidebar/in-page TOC rather than the page header on non-default page dimensions?

danielmutis commented 2 months ago

@ru-fu I think on the page makes more sense to me. I would reserve space in the navigation for links that navigate to other pages of the documentation set. If the link that we are giving is somewhat specific to that page, I also think that it makes more sense for it to be on the page.

akcano commented 2 months ago

@ru-fu, @s-makin: Moving the button to the floating ToC may remove it on mobile devices. Currently, I have two options to suggest:

Moving the button to the bottom of the left sidebar, approx. above the version reference snippet
Dropping it altogether, as it essentially duplicates the GitHub links below, which are way less intrusive and more consistently looking; this can be done optionally:
https://canonical-workshop.readthedocs-hosted.com/en/latest/
https://github.com/akcano/workshop/commit/ead63364647bae27214a1747ef0bcb9313f0cdcf

What do you think?

ru-fu commented 2 months ago

Moving the button to the bottom of the left sidebar, approx. above the version reference snippet

This has the same problem as moving it to the right sidebar - on really small devices, both sidebars are hidden.

Dropping it altogether, as it essentially duplicates the GitHub links below, which are way less intrusive and more consistently looking; this can be done optionally:

A bit torn about this - I like having all links at the bottom, and we currently have way too many different places where we link to GitHub (either to edit or to open an issue), so reducing this would surely be a good thing. But then, the feedback button is way more visible than the small links. :(

What are your links about? Not sure what to look out for in the first one, and I can't access the second.

akcano commented 2 months ago

@ru-fu Got it; I'll play around with a flexbox option to see if I can make the titlebar feedback button behave nicely. The links I offered above suggest decoupling the github switch into two separate options, i.e.:

    # Change to an empty value to suppress the 'Give feedback' button on top.
    "github_issues": "",
    # This toggles the 'Open a GitHub issue for this page' link in the footer.
    "github_issues_footer": "enabled",

ru-fu commented 2 months ago

The links I offered above suggest decoupling the github switch into two separate options, i.e.:

Not a fan of that, because the starter pack is supposed to give a common appearance - not pass the choice of how it should look to every team.