Move search bar into header

[IanMayo]

The full-text-search is an amazing capability that my users are really looking forward to.

But, it is expensive in its use of screen-estate:

I'd like us to move it into the header bar, please. So, the header will contain an input-box and search button, and positioned between "Field Manual V4 Feb 2022" and "WELCOME"

When the width of the screen is reduced, the search box should always remain visible - even after the right-hand links have disappeared. (if possible).

This task should be completed by amending the templates in the template\F13ldMan folder in the LegacyMan repository.

The outcome of the task will be a Pull Request containing the new publishing template, plus one or more screenshots of the new layout.

[frank-zimmermann]

When moving the search bar into the header, we need to discuss how the search bar should react when the browser window width is smaller.

So you need any behavior? Disabling the search button when the window is too small? Or always show the search text field and button?

[frank-zimmermann]

Here, the width of the search needs to expand to 100%.

I'm not that expert in CSS.

[IanMayo]

Hello Frank, in oxygen.css we already have some logic that is screen-width dependent. We may be able to re-use that pattern to solve this issue.

Aaah, but first we need to decide the requirement. I think that the search box should always be visible - since it's such a quick way to navigate to almost anywhere in the document set. When on a wide screen, I guess it could greedily consume the horizontal whitespace.

I'm not that expert in CSS.

That's completely fine. When we've got as far as we can, I'll zip up a copy of target/oxygen and get one of my web devs to modify the oxygen.css to give us what we need.

Aah, I also see we don't really want to have to split the header across two lines. I'm working with the document authors to sort out the top-level links. Once that is done we can reproduce it in our content,, and come up with a layout config that avoids a line-break.

[frank-zimmermann]

@IanMayo , I suggest that you can now send the target folder to the devs. He/she could then modify the index.html and move the search to the correct position. When I know how the structure and CSS changed, then I can modify the transformation. What do you think?

[IanMayo]

Sure, I'm happy to do that. But, I'd also like to start considering the useability of the search in the header, in case I can give some direction to the HTML dev - oh and some feedback from the clients.

Would you be able to produce a draft PR that gives us an early version of search-bar-in-header ? It may be that we drop the PR, but it will allow us to learn about the feature.

[IanMayo]

This is now done.