Only apply cover image text shadow if there's a background image.

This commit is contained in:
Kjell Reigstad 2020-04-29 13:04:26 -04:00
parent c7b4c3b3ac
commit 7a16c1f943
5 changed files with 61 additions and 27 deletions

View file

@ -223,13 +223,20 @@ b, strong {
// Cover
.wp-block-cover,
.wp-block-cover-image {
p {
text-shadow: 0 0 6px map-deep-get($config-global, "color", "black");
}
h1,h2,h3,h4,h5,h6 {
font-weight: 300;
text-shadow: 0 0 10px map-deep-get($config-global, "color", "black");
}
// Only use a text shadow if there's a background image.
&[style*="background-image"] {
p {
text-shadow: 0 0 6px map-deep-get($config-global, "color", "black");
}
h1,h2,h3,h4,h5,h6 {
text-shadow: 0 0 10px map-deep-get($config-global, "color", "black");
}
}
@include media(desktop) {

View file

@ -64,13 +64,21 @@ b, strong {
.wp-block-cover,
.wp-block-cover-image {
p {
text-shadow: 0 0 6px #000;
}
h1,h2,h3,h4,h5,h6 {
font-weight: 300;
text-shadow: 0 0 12px #000;
}
// Only use a text shadow if there's a background image.
&[style*="background-image"] {
p {
text-shadow: 0 0 6px #000
}
h1,h2,h3,h4,h5,h6 {
font-weight: 300;
text-shadow: 0 0 12px #000;
}
}
@include media(desktop) {

View file

@ -1296,11 +1296,6 @@ b, strong {
}
}
.wp-block-cover p,
.wp-block-cover-image p {
text-shadow: 0 0 6px #000;
}
.wp-block-cover h1, .wp-block-cover h2, .wp-block-cover h3, .wp-block-cover h4, .wp-block-cover h5, .wp-block-cover h6,
.wp-block-cover-image h1,
.wp-block-cover-image h2,
@ -1309,6 +1304,21 @@ b, strong {
.wp-block-cover-image h5,
.wp-block-cover-image h6 {
font-weight: 300;
}
.wp-block-cover[style*="background-image"] p,
.wp-block-cover-image[style*="background-image"] p {
text-shadow: 0 0 6px #000;
}
.wp-block-cover[style*="background-image"] h1, .wp-block-cover[style*="background-image"] h2, .wp-block-cover[style*="background-image"] h3, .wp-block-cover[style*="background-image"] h4, .wp-block-cover[style*="background-image"] h5, .wp-block-cover[style*="background-image"] h6,
.wp-block-cover-image[style*="background-image"] h1,
.wp-block-cover-image[style*="background-image"] h2,
.wp-block-cover-image[style*="background-image"] h3,
.wp-block-cover-image[style*="background-image"] h4,
.wp-block-cover-image[style*="background-image"] h5,
.wp-block-cover-image[style*="background-image"] h6 {
font-weight: 300;
text-shadow: 0 0 12px #000;
}

View file

@ -4175,18 +4175,18 @@ strong {
text-align: right;
}
.wp-block-cover p,
.wp-block-cover-image p {
.wp-block-cover[style*="background-image"] p,
.wp-block-cover-image[style*="background-image"] p {
text-shadow: 0 0 6px black;
}
.wp-block-cover h1, .wp-block-cover h2, .wp-block-cover h3, .wp-block-cover h4, .wp-block-cover h5, .wp-block-cover h6,
.wp-block-cover-image h1,
.wp-block-cover-image h2,
.wp-block-cover-image h3,
.wp-block-cover-image h4,
.wp-block-cover-image h5,
.wp-block-cover-image h6 {
.wp-block-cover[style*="background-image"] h1, .wp-block-cover[style*="background-image"] h2, .wp-block-cover[style*="background-image"] h3, .wp-block-cover[style*="background-image"] h4, .wp-block-cover[style*="background-image"] h5, .wp-block-cover[style*="background-image"] h6,
.wp-block-cover-image[style*="background-image"] h1,
.wp-block-cover-image[style*="background-image"] h2,
.wp-block-cover-image[style*="background-image"] h3,
.wp-block-cover-image[style*="background-image"] h4,
.wp-block-cover-image[style*="background-image"] h5,
.wp-block-cover-image[style*="background-image"] h6 {
font-weight: 300;
text-shadow: 0 0 10px black;
}

View file

@ -4204,11 +4204,6 @@ strong {
text-align: left;
}
.wp-block-cover p,
.wp-block-cover-image p {
text-shadow: 0 0 6px black;
}
.wp-block-cover h1, .wp-block-cover h2, .wp-block-cover h3, .wp-block-cover h4, .wp-block-cover h5, .wp-block-cover h6,
.wp-block-cover-image h1,
.wp-block-cover-image h2,
@ -4217,6 +4212,20 @@ strong {
.wp-block-cover-image h5,
.wp-block-cover-image h6 {
font-weight: 300;
}
.wp-block-cover[style*="background-image"] p,
.wp-block-cover-image[style*="background-image"] p {
text-shadow: 0 0 6px black;
}
.wp-block-cover[style*="background-image"] h1, .wp-block-cover[style*="background-image"] h2, .wp-block-cover[style*="background-image"] h3, .wp-block-cover[style*="background-image"] h4, .wp-block-cover[style*="background-image"] h5, .wp-block-cover[style*="background-image"] h6,
.wp-block-cover-image[style*="background-image"] h1,
.wp-block-cover-image[style*="background-image"] h2,
.wp-block-cover-image[style*="background-image"] h3,
.wp-block-cover-image[style*="background-image"] h4,
.wp-block-cover-image[style*="background-image"] h5,
.wp-block-cover-image[style*="background-image"] h6 {
text-shadow: 0 0 10px black;
}