PyData Sphinx Theme searchbox design and accessibiity improvements

[agriyakhetarpal]

Hi there! I see that my earlier request (#14) was merged and a new release with the theme is out (thanks! 🎉), but I wanted to highlight some potential areas of improvement and some workarounds that I have been using to add them:

1. Keyboard buttons are not correctly displayed

2. Not available on smaller-width (mobile) devices (because of "navbar_persistent" I guess)

Some CSS fixes can be adopted for this:

/* Do not add custom padding for keyboard buttons */

kbd:not(.compound) {
  padding: 0rem 0rem;
}

kbd.DocSearch-Commands-Key {
  border: 0;
  box-shadow: var(--docsearch-key-shadow);
  margin: 1px 5px 1px 0px;
  padding: inherit;
}

and some other improvements based on the styling for individual search results: https://github.com/pybamm-team/PyBaMM/blob/develop/docs/_static/pybamm.css#L107-L196. Not all of these are needed anymore, though, and this doesn't fix point 2, however...

[agriyakhetarpal]

These styles change on every minor update to the PyData Sphinx Theme, say, between 0.15.X and 0.16.Y, so there's not a lot that can be done unless the theme provides first-class support for configuring search boxes (pydata/pydata-sphinx-theme#795)

[kai687]

I split off issue #35 for the second issue. If you have any idea how to address it, I'd be happy about any help.

I added your extra CSS for the keys in PR #34.