Full height layouts in WordPress block themes

layout.css

/*
Global WordPress Layout

Ensures that the footer is always at the bottom of
the page even if the page doesn't have enough content.
*/

.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100svh;

	.site-footer {
		margin-top: auto;
	}
}

.admin-bar .wp-site-blocks {
	min-height: calc(100svh - var(--wp-admin--admin-bar--height));
}