UCDavisLibrary/ucdlib-theme-wp

Search Widget: Style and Width Adjustments

Closed this issue · 2 comments

There are a few adjustments that should be made to the search widget.

  1. The search field currently becomes narrower on larger screens. This is strange and undesirable behavior, it should either maintain its width or become larger when a screen grows (whichever looks/feels nicer).
  2. On mobile (iphone/ipad, I haven't checked android), the checkbox text is regular weight (and also not left aligned to the search field) and the adv. search link is heavier weight font. We want them to be matching weights like on desktop.
  3. Related to number 2: Let's make both of these items bold across all devices as it's easier to read over the background image.
  4. The checkbox is difficult to see. Change the border color to match the border on the search box to help it be more visible.

@wrenaria So I took a look and, the search field actually does not become narrower at larger screens, it's just that the font size is rem based, so it just looks smaller. The element itself maxes out at a width of 550px and stays there at larger screens. So, I can either:

  1. Set the max-width to also be in rem. 33rem seems to be okay? or
  2. Set the input font size to be px. 16px?

Personally, I think the first option is preferable, but wanted your input.

@spelkey-ucd First option sounds fine!