Docs: disable Read the Docs flyout without using CSS

[humitos]

Describe the bug

I found that you are hiding the Read the Docs flyout shown at the bottom right by using CSS in this line: https://github.com/pypi/warehouse/blob/main/docs/user/stylesheets/extra.css#L13 and there is no need to do it via CSS. You can simple disable it from the Read the Docs dashboard with a checkbox.

Expected behavior

The flyout can be disabled from the dashboard without requiring any coding. Just:

1. Go to the https://beta.readthedocs.org/dashboard/docspypiorg/edit/
2. Click on "Addons (Beta)" from the left bar
3. Uncheck "Flyout enabled"
4. Done 👍🏼

To Reproduce

1. Go to https://docs.pypi.org/
2. Inspect the DOM and see that readthedocs-flyout element has the property display: none;

Additional context

Note that Read the Docs is free for Open Source projects. The flyout, besides providing extra features to the readers, was our[^1] way to tell users the site was hosted by Read the Docs and promote our platform more broadly. Since we added the ability to hide the flyout on projects, we may eventually ask users to show some support here communicating the hosting provider in some way. Similar to what CPython's theme is doing by showing "Hosted on Read the Docs" at the bottom right (see https://github.com/python/python-docs-theme/pull/165). This is not required, but it would be pretty much appreciated 🙏🏼

[^1]: I work at Read the Docs 😃

[ewdurbin]

FWIW it was hidden only because of the misleading version picker since all our docs are versionless. I’ll take a closer look at this configuration

[humitos]

Ah, OK. That issue should be already fixed. By removing the CSS line, it should look like this:

Note there are is "Versions" section in the flyout generated.

You may want to style it little bit to increase the font, since you are using Material for MkDocs, tho. I've done this in my testing project at https://test-builds.readthedocs.io/en/mkdocs-material/ that you can take a look if you want.

This is the CSS I've used there is:

:root {
    /* Reduce Read the Docs' flyout font a little bit */
    --readthedocs-flyout-font-size: 0.7rem;

    /* Reduce Read the Docs' notification font a little bit */
    --readthedocs-notification-font-size: 0.8rem;

    /* This customization is not yet perfect because we can't change the `line-height` yet. */
    /* See https://github.com/readthedocs/addons/issues/197 */
    --readthedocs-search-font-size: 0.7rem;
}

Let me know if that helps 👍🏼