Hello,
I will start by saying it is a great theme. Now, to the problem:
I notice that theme will hide part of the teaser image ( if it is in a grid layout) if its aspect ratio is not 3 by 2. Same with a header image of a post - depending on how wide a monitor is, the top and the bottom of the image can be cut. Or the opposite - if the monitor is super wide, the header can take half screen of the monitor.
Is there a setting in yaml that can prevent me from this by forcing an image to be full size? Or a way to set max width or height of an image and filling the empty spice with color? There surely must be a better way then cutting images to custom aspect ration.
Thanks.
Header images shouldn’t be hidden, see these example posts.
If you’re using a header with overlay the image is applied as a background, and can get cut. Overlay headers are dependent on the height of the content placed on top of it. Have a short title… It’s going to cause the parent container to have a reduced height.
Thanks for fast reply.
And what about teaser images?
For teaser images in the grid layout, they have a max-height
set via CSS to keep everything uniform.
If that’s not to your taste you can remove these lines in /_sass/minimal-mistakes/_archive.scss
.
.archive {
.archive__item-teaser {
@include breakpoint($small) {
max-height: 200px;
}
@include breakpoint($medium) {
max-height: 120px;
}
}
}