change header height on 2017 theme for logged in users

Question

When a guest sees the homepage they see the (almost) full height picture which is quite nice I think.

However, when a user logs in I'd like them to be redirected to the home page but with a much shorter picture (as the picture appears on the internal pages of the site).

I know I could redirect logged in users to a faux front page, but is there a way of changing the height of the main header picture depending if the user is a guest or logged in?

Answer 1

WordPress will automatically add a body class to the body tag if a user is logged in. You could potentially use this to adjust the height.

For example..

.logged-in #myElement {
    ...Your CSS
}

Something like this should work.

.logged-in.twentyseventeen-front-page.has-header-image .custom-header-media {
    height: calc(70vh);
}

Note the calc 70vh is 70% of viewport height, so adjust to what you need.