Header and Tabs UI Improvements

[dvjn]

Some improvements to the Page Header and Tab UI.

Original	New

What?

• Create a new Scaffold component, which includes the header and tabs required for a page.
• Use this component to wrap all the views that have a header.

Why?

• Ensures consistency in headers between different pages.
• (Opinion) Looks better than the current headers.

TODO:

• [ ] Add support to use custom html/component in place of title (for repo page, pipeline page, etc)
• [ ] Add support of right icon buttons (for repo page, pipeline page, etc)
• [ ] Refactor tabs handling using compositions (useTabsProvider, useTabsClient)

[dvjn]

@6543 @qwerty287 @anbraten (or any other maintainer) could you review the visual changes / code changes, while I implement the rest of the changes?

My first time using vue :)

[qwerty287]

For me, this looks good.

[dvjn]

Can anyone please review this?

Thanks!

[dvjn]

Any updates?

[lafriks]

New search looks a bit too unreadable (background/foreground contrast)

[dvjn]

New search looks a bit too unreadable (background/foreground contrast)

Are you talking about the placeholder text? If yes, I'll just set it to a darker color.

[dvjn]

@lafriks done :)

Before:

After:

[6543]

I'll trust you so I'll merge

[6543]

;)