Wider support for Coveo on Mobile + Edge cases

[lamATnginx]

Proposed changes

Closes https://github.com/nginxinc/docs-platform/issues/424

Checklist

Before creating a PR, run through this checklist and mark each as complete.

• I have read the CONTRIBUTING document
• If applicable, I have added tests that prove my fix is effective or that my feature works
• If applicable, I have checked that any relevant tests pass after adding my changes
• I have updated any relevant documentation (README.md and CHANGELOG.md)

[nginx-jack]

This is working fine locally 👍 .

Few things to tweak:
It should be possible to do this with just CSS. The cases in the if statements, can all be inferred purely from the browser size. The exception being the search page, but since that's a different page in hugo, you could set a different class explicitly for that page maybe.

Refactoring to pure css aside, the resize event triggers every pixel change. It shouldn't impact performance when it's only changing classes, but a small debounce function to wrap it in might be no harm, like

function debounce(func, wait = 200) {
  let timeout;
  return function (...args) {
    clearTimeout(timeout);
    timeout = setTimeout(() => func.apply(this, args), wait);
  };
}

Then wrap what's in you current event listener closure in a function, and call it like window.addEventListener('resize', debounce(updateSearchBarVisibility, 200));

This is working as is, but I'd like to at least add the debounce in before merging. If we do end up adding more logic to resize, it'll start to chug when people resize.
We can come back to refactoring as CSS later, if that sounds alright?