WebDev
/
mind-overflow-website-ghost-theme
1
0
Fork 0
Code Issues 2 Pull Requests Releases Wiki Activity

Make feature image have a max height when showed in a post

This commit is contained in:
Bea 2021-03-17 16:06:16 +01:00
parent 9418dce69f
commit 1a5be0c2c6
1 changed files with 22 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
assets/css/screen.css
View File

@ -699,7 +699,9 @@ instead of pages ".mind-page*".
}
img.mind-post_feature-image {
max-height: 400px;
width: 100%;
object-fit: cover;
/*
TODO: see .mind-post_content-header.
@ -1211,6 +1213,10 @@ Media queries are used to make the website responsive and cool on mobile.
font-size: 17px;
}
img.mind-post_feature-image {
max-height: 350px;
}
.kg-gallery-image {
margin: 10px 10px;
}
@ -1287,6 +1293,10 @@ Media queries are used to make the website responsive and cool on mobile.
padding: 0 20px;
}
img.mind-post_feature-image {
max-height: 500px;
}
.kg-gallery-image {
margin: 10px 5px;
}
@ -1329,6 +1339,10 @@ Media queries are used to make the website responsive and cool on mobile.
.mind-tag-content_main {
grid-template-columns: 1fr 1fr 1fr;
}
img.mind-post_feature-image {
max-height: 350px;
}
}
@media only screen and (max-width: 650px) {
@ -1385,6 +1399,10 @@ Media queries are used to make the website responsive and cool on mobile.
font-size: 15px;
}
img.mind-post_feature-image {
max-height: 300px;
}
.mind-post_info {
font-size: 13px;
}
@ -1460,6 +1478,10 @@ Media queries are used to make the website responsive and cool on mobile.
font-size: 14px;
}
img.mind-post_feature-image {
max-height: 250px;
}
.mind-site-footer_main {
font-size: 16px;
}