Modern Business: Fix overflowing centred image
This commit is contained in:
parent
a7c8a3b5c4
commit
164a54b704
4 changed files with 2 additions and 97 deletions
|
@ -637,32 +637,6 @@
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
@include media(tablet) {
|
|
||||||
max-width: calc(6 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
|
|
||||||
.aligncenter {
|
|
||||||
|
|
||||||
@include postContentMaxWidth();
|
|
||||||
|
|
||||||
@include media(tablet) {
|
|
||||||
margin: 0;
|
|
||||||
width: $size__site-tablet-content;
|
|
||||||
|
|
||||||
img {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@include media(desktop) {
|
|
||||||
width: $size__site-desktop-content;
|
|
||||||
|
|
||||||
img {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&.alignfull img {
|
&.alignfull img {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
max-width: calc( 100% + (2 * #{$size__spacing-unit}));
|
max-width: calc( 100% + (2 * #{$size__spacing-unit}));
|
||||||
|
|
|
@ -77,7 +77,6 @@
|
||||||
/**
|
/**
|
||||||
* Blocks
|
* Blocks
|
||||||
*/
|
*/
|
||||||
|
|
||||||
/* Mailchimp Block - Temp Fix */
|
/* Mailchimp Block - Temp Fix */
|
||||||
.wp-block-jetpack-mailchimp input[type="email"] {
|
.wp-block-jetpack-mailchimp input[type="email"] {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
|
@ -4010,37 +4010,6 @@ body.page .main-navigation {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (min-width: 768px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
max-width: calc(8 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 1168px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
max-width: calc(6 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 768px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
margin: 0;
|
|
||||||
width: calc(8 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter img {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 1168px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
width: calc(6 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter img {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.entry .entry-content .wp-block-image.alignfull img {
|
.entry .entry-content .wp-block-image.alignfull img {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
max-width: calc( 100% + (2 * 1rem));
|
max-width: calc( 100% + (2 * 1rem));
|
||||||
|
@ -4057,7 +4026,7 @@ body.page .main-navigation {
|
||||||
.entry .entry-content .wp-block-cover-image,
|
.entry .entry-content .wp-block-cover-image,
|
||||||
.entry .entry-content .wp-block-cover {
|
.entry .entry-content .wp-block-cover {
|
||||||
position: relative;
|
position: relative;
|
||||||
min-height: 510px;
|
min-height: 430px;
|
||||||
padding: 1rem;
|
padding: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -4075,7 +4044,7 @@ body.page .main-navigation {
|
||||||
.entry .entry-content .wp-block-cover .wp-block-cover-text {
|
.entry .entry-content .wp-block-cover .wp-block-cover-text {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
font-family: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||||
font-size: 2.25em;
|
font-size: 1.6875em;
|
||||||
font-weight: 300;
|
font-weight: 300;
|
||||||
line-height: 1.25;
|
line-height: 1.25;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
|
|
@ -4016,43 +4016,6 @@ body.page .main-navigation {
|
||||||
display: block;
|
display: block;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media only screen and (min-width: 768px) {
|
|
||||||
.entry .entry-content .wp-block-image {
|
|
||||||
max-width: calc(6 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 768px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
max-width: calc(8 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 1168px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
max-width: calc(6 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 768px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
margin: 0;
|
|
||||||
width: calc(8 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter img {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media only screen and (min-width: 1168px) {
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter {
|
|
||||||
width: calc(6 * (100vw / 12) - 28px);
|
|
||||||
}
|
|
||||||
.entry .entry-content .wp-block-image .aligncenter img {
|
|
||||||
margin: 0 auto;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.entry .entry-content .wp-block-image.alignfull img {
|
.entry .entry-content .wp-block-image.alignfull img {
|
||||||
width: 100vw;
|
width: 100vw;
|
||||||
max-width: calc( 100% + (2 * 1rem));
|
max-width: calc( 100% + (2 * 1rem));
|
||||||
|
|
Loading…
Add table
Reference in a new issue