Professional Business: Fix the cover headings alignment

This commit is contained in:
Danny Dudzic 2019-08-06 23:31:35 +02:00
parent 87bec6eb6d
commit 9239f3d8fb
5 changed files with 73 additions and 8 deletions

View file

@ -568,6 +568,20 @@
}
}
h2 {
&.has-text-align-left {
text-align: left;
}
&.has-text-align-center {
text-align: center;
}
&.has-text-align-right {
text-align: right;
}
}
h3 {
font-size: $font__size-md;

View file

@ -1203,7 +1203,7 @@ figcaption,
font-size: 1.6875em;
max-width: 100%;
padding: 0;
text-align: left;
text-align: inherit;
}
@media only screen and (min-width: 768px) {
@ -1213,6 +1213,21 @@ figcaption,
}
}
.wp-block-cover .wp-block-cover__inner-container h2.has-text-align-left,
.wp-block-cover .wp-block-cover-text h2.has-text-align-left {
text-align: left;
}
.wp-block-cover .wp-block-cover__inner-container h2.has-text-align-center,
.wp-block-cover .wp-block-cover-text h2.has-text-align-center {
text-align: center;
}
.wp-block-cover .wp-block-cover__inner-container h2.has-text-align-right,
.wp-block-cover .wp-block-cover-text h2.has-text-align-right {
text-align: right;
}
.wp-block-cover .wp-block-cover__inner-container h3,
.wp-block-cover .wp-block-cover-text h3 {
font-size: 1.125em;
@ -1309,18 +1324,14 @@ figcaption,
}
@media only screen and (min-width: 768px) {
.wp-block[data-type="core/cover"][data-align="wide"] h2,
.wp-block[data-type="core/cover"][data-align="wide"] .wp-block-cover-text,
.wp-block[data-type="core/cover"][data-align="full"] h2,
.wp-block[data-type="core/cover"][data-align="full"] .wp-block-cover-text {
max-width: calc(8 * (100vw / 12) - 43px);
}
}
@media only screen and (min-width: 1168px) {
.wp-block[data-type="core/cover"][data-align="wide"] h2,
.wp-block[data-type="core/cover"][data-align="wide"] .wp-block-cover-text,
.wp-block[data-type="core/cover"][data-align="full"] h2,
.wp-block[data-type="core/cover"][data-align="full"] .wp-block-cover-text {
max-width: calc(6 * (100vw / 12) - 43px);
}

View file

@ -329,11 +329,23 @@ figcaption,
font-size: $font__size-lg;
max-width: 100%;
padding: 0;
text-align: left;
text-align: inherit;
@include media(tablet) {
font-size: $font__size-xl;
}
&.has-text-align-left {
text-align: left;
}
&.has-text-align-center {
text-align: center;
}
&.has-text-align-right {
text-align: right;
}
}
h3 {
@ -419,7 +431,6 @@ figcaption,
@include media(tablet) {
h2,
.wp-block-cover-text {
max-width: calc(8 * (100vw / 12) - 43px); // 43px is the 28px + 15px -- half of the padding on blocks like paragraph
}
@ -427,7 +438,6 @@ figcaption,
@include media(desktop) {
h2,
.wp-block-cover-text {
max-width: calc(6 * (100vw / 12) - 43px); // 43px is the 28px + 15px -- half of the padding on blocks like paragraph
}

View file

@ -4023,6 +4023,21 @@ body.page .main-navigation {
}
}
.entry .entry-content .wp-block-cover-image h2.has-text-align-left,
.entry .entry-content .wp-block-cover h2.has-text-align-left {
text-align: right;
}
.entry .entry-content .wp-block-cover-image h2.has-text-align-center,
.entry .entry-content .wp-block-cover h2.has-text-align-center {
text-align: center;
}
.entry .entry-content .wp-block-cover-image h2.has-text-align-right,
.entry .entry-content .wp-block-cover h2.has-text-align-right {
text-align: left;
}
.entry .entry-content .wp-block-cover-image h3,
.entry .entry-content .wp-block-cover h3 {
font-size: 1.125em;

View file

@ -4035,6 +4035,21 @@ body.page .main-navigation {
}
}
.entry .entry-content .wp-block-cover-image h2.has-text-align-left,
.entry .entry-content .wp-block-cover h2.has-text-align-left {
text-align: left;
}
.entry .entry-content .wp-block-cover-image h2.has-text-align-center,
.entry .entry-content .wp-block-cover h2.has-text-align-center {
text-align: center;
}
.entry .entry-content .wp-block-cover-image h2.has-text-align-right,
.entry .entry-content .wp-block-cover h2.has-text-align-right {
text-align: right;
}
.entry .entry-content .wp-block-cover-image h3,
.entry .entry-content .wp-block-cover h3 {
font-size: 1.125em;