Site title and tagline and menu placement

[paaljoachim]

Hey Ari

Here is the new default 3.0 placement of header elements:

Most sites have the layout like this:

It would be best to show the default placement that most sites use. It would be great to have the centered code available. So a user can adjust it.

Btw this is a new local site using the Gridd 3 from about a week or so ago. With almost no content.

[aristath]

On one hand you're right.
However, if you have a few menu items then the new defaults look like this:

whereas the old defaults look like this:

Trying to find the right balance here, if you have any ideas on how to accommodate these cases I'm all ears :)

[paaljoachim]

Default looks like this (really nice btw).

The test to move the site title + tagline to the left. With menu to the right.

Adjusting placement through the customizer -> Header Grid.

This does not look good.

Changed auto to 250px (Branding column size)
Changed auto to 100% (Nav column size)

Clicked the pencil by the menu and it went to Site Identity. ---NB! Should this go to Site Identity?

Adjusted the Site Title Font-Size and the Tagline font size.
Adjusted the Spacing between elements. ---- NB. Should the b and e be in capital letters like so: Spacing Between Elements
Adjusted the Horizontal Alignment to Left.

Result:

I am now going to hunt for lessening the space between the site title and the menu.
As the menu could go a little further to the left and come closer to the site title.
I am not seeing any setting for customizing the menu. Colors and placement as in padding/margin/font size etc.

[aristath]

Clicked the pencil by the menu and it went to Site Identity. ---NB! Should this go to Site Identity?

It does. But there are a bunch of pencil icons there: alignment, site-name, site-description, nav and more.

Should the b and e be in capital letters like so: Spacing Between Elements

Fixed.

I am now going to hunt for lessening the space between the site title and the menu.

Fixed the options a bit for this one, allowing negative values 'cause CSS can sometimes be quirky.

[aristath]

I am not seeing any setting for customizing the menu. Colors and placement as in padding/margin/font size etc.

Most of these options are not used in most cases so they were removed (though as far as I recall they existed in Plus, so if that is the case they're still there)
By enabling the inherit/override switch you can override the background-color which also tweaks the text-colors and link-colors for a11y.
The "justify items" control in most cases performs a similar role to padding/margin etc, determining how items are distributed to fill the whitespace.

[paaljoachim]

Can you share some CSS menu example code for links, underline, visited, current etc?
I can add a wiki doc with styling the menu. Nice for me and for whomever else comes across it.
I can then close this issue.