Change button text contrast to comply with WCAG AA

[mfisher87]

Currently contrast of white-on-yellow is 1.34:1, but WCAG AA requires 4.5:1!

This is also more consistent with the JupyterLite logo which is black-on-yellow.

---

Separately, I expected the CSS for styling the button to be included with this extension, but the CSS seems to only be present in the docs of this extension. Is that intended, or should the CSS be bundled?

I got my docs page looking nice by copying the CSS over to my Sphinx custom CSS file.

[steppi]

Thanks @mfisher87. The buttons in the docs look much better now.

Separately, I expected the CSS for styling the button to be included with this extension, but the CSS seems to only be present in the docs of this extension. Is that intended, or should the CSS be bundled?

Currently users are expected to add CSS to style the buttons themselves. That's what's documented here, https://jupyterlite-sphinx.readthedocs.io/en/stable/directives/try_examples.html#configuration. I didn't have much web development experience when I first wrote the try_examples directive, and basically just punted on trying to come up with a good default style. At this point, it does seem like a good idea to have a reasonable default though.

[mfisher87]

Currently users are expected to add CSS to style the buttons themselves. That's what's documented here, jupyterlite-sphinx.readthedocs.io/en/stable/directives/try_examples.html#configuration.

Ahh, I had read this documentation but ignored it because I didn't think it also applied to the jupyterlite directive! Thanks for clarifying ❤️