Launchpad itself

Merge ~petermakowski/launchpad:feat-vanilla-tabs-style into launchpad:master

Proposed by Peter Makowski on 2023-06-06

Status:	Merged
Approved by:	Ines Almeida on 2023-06-06
Approved revision:	e1a43ac139cc813742ebd5a078cc205ed0b8bcff
Merge reported by:	Otto Co-Pilot
Merged at revision:	not available
Proposed branch:	~petermakowski/launchpad:feat-vanilla-tabs-style
Merge into:	launchpad:master
Diff against target:	100 lines (+48/-11) 2 files modified lib/canonical/launchpad/icing/css/base.scss (+2/-2) lib/canonical/launchpad/icing/css/layout.scss (+46/-9)
Related bugs:	Link a bug report

Reviewer	Review Type	Date Requested	Status
Ines Almeida		2023-06-06	Approve on 2023-06-06
Review via email: mp+444157@code.staging.launchpad.net

Commit message

feat: vanilla tabs style
- increase base font-size

Description of the change

- set main navigation to use vanilla framework tabs style https://vanillaframework.io/docs/patterns/tabs
- increase the base font-size by .8px - update base font-size to 0.8rem (12.8px)

## before
https://share.cleanshot.com/1GbXJYtd
## after
https://share.cleanshot.com/DjVjJWQz

The overall goal is for launchpad to use the sabe base font-size that vanilla framework uses - 1rem (16px). This merge proposal is a small step in this direction.

Revision history for this message

Guruprasad (lgp171188) wrote on 2023-06-06:

Thanks for the useful contribution! This looks significantly better and nicer! 👍

> ## after
> https://share.cleanshot.com/DjVjJWQz

Is there a reason that the first tab, 'Overview', is not aligned on the left side to the left side of the project logo above it? This looks a bit noticeably odd to me.

Revision history for this message

Ines Almeida (ines-almeida) wrote on 2023-06-06:

> Is there a reason that the first tab, 'Overview', is not aligned on the left
> side to the left side of the project logo above it? This looks a bit
> noticeably odd to me.

The button as a whole is aligned, i.e., if you select it and get the grey box around it, you see it's aligned. IMO that looks OK

Revision history for this message

Ines Almeida (ines-almeida) wrote on 2023-06-06:

It looks good to me, looks much nicer IMO!

The only question I had is regarding the `flex` property support in very old browsers (is that something we should strive to support?), but actually trying it out without the `display: flex` still looks good regardless :)

review: Approve

Revision history for this message

Peter Makowski (petermakowski) wrote on 2023-06-06:

Just to follow up on your question: "overview" alignment is the same as in the vanilla framework Tabs component linked in the description.

There was an error fetching revisions from git servers. Please try again in a few minutes. If the problem persists, contact Launchpad support.