Varia: Make sure elements inside cover block is always visible
This commit is contained in:
parent
31b1f6acf2
commit
04536c0e3b
5 changed files with 57 additions and 6 deletions
|
@ -9,13 +9,23 @@
|
|||
.wp-block-cover-image-text,
|
||||
.wp-block-cover-text,
|
||||
.block-editor-block-list__block {
|
||||
color: #{map-deep-get($config-cover, "color", "foreground")};
|
||||
color: currentColor; // uses text color specified with background-color options in /blocks/utilities/_style.scss
|
||||
|
||||
a {
|
||||
color: currentColor;
|
||||
}
|
||||
}
|
||||
|
||||
/* default & custom background-color */
|
||||
&:not([class*='background-color']){
|
||||
.wp-block-cover__inner-container,
|
||||
.wp-block-cover-image-text,
|
||||
.wp-block-cover-text,
|
||||
.block-editor-block-list__block {
|
||||
color: #{map-deep-get($config-cover, "color", "foreground")};
|
||||
}
|
||||
}
|
||||
|
||||
/* Treating H2 separately to account for legacy /core styles */
|
||||
h2 {
|
||||
font-size: (strip-unit(map-deep-get($config-heading, "font", "size", "h2")) + 0em);
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
.wp-block-cover__inner-container,
|
||||
.wp-block-cover-image-text,
|
||||
.wp-block-cover-text {
|
||||
color: #{map-deep-get($config-cover, "color", "foreground")};
|
||||
color: currentColor; // uses text color specified with background-color options in /blocks/utilities/_style.scss
|
||||
margin-top: #{map-deep-get($config-global, "spacing", "vertical")};
|
||||
margin-bottom: #{map-deep-get($config-global, "spacing", "vertical")};
|
||||
|
||||
|
@ -17,6 +17,15 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* default & custom background-color */
|
||||
&:not([class*='background-color']){
|
||||
.wp-block-cover__inner-container,
|
||||
.wp-block-cover-image-text,
|
||||
.wp-block-cover-text {
|
||||
color: #{map-deep-get($config-cover, "color", "foreground")};
|
||||
}
|
||||
}
|
||||
|
||||
/* Treating H2 separately to account for legacy /core styles */
|
||||
h2 {
|
||||
font-size: #{map-deep-get($config-heading, "font", "size", "h2")};
|
||||
|
@ -41,7 +50,7 @@
|
|||
|
||||
.wp-block-cover__inner-container {
|
||||
|
||||
width: calc(100% - #{ 2 * map-deep-get($config-global, "spacing", "vertical") };
|
||||
width: calc(100% - #{ 2 * map-deep-get($config-global, "spacing", "vertical") });
|
||||
|
||||
& > * {
|
||||
margin-top: #{ 0.666 * map-deep-get($config-global, "spacing", "vertical") };
|
||||
|
|
|
@ -287,6 +287,7 @@ object {
|
|||
background-color: black;
|
||||
color: white;
|
||||
min-height: 480px;
|
||||
/* default & custom background-color */
|
||||
/* Treating H2 separately to account for legacy /core styles */
|
||||
}
|
||||
|
||||
|
@ -298,7 +299,7 @@ object {
|
|||
.wp-block-cover-image .wp-block-cover-image-text,
|
||||
.wp-block-cover-image .wp-block-cover-text,
|
||||
.wp-block-cover-image .block-editor-block-list__block {
|
||||
color: white;
|
||||
color: currentColor;
|
||||
}
|
||||
|
||||
.wp-block-cover .wp-block-cover__inner-container a,
|
||||
|
@ -312,6 +313,17 @@ object {
|
|||
color: currentColor;
|
||||
}
|
||||
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover__inner-container,
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover-image-text,
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover-text,
|
||||
.wp-block-cover:not([class*='background-color']) .block-editor-block-list__block,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover__inner-container,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover-image-text,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover-text,
|
||||
.wp-block-cover-image:not([class*='background-color']) .block-editor-block-list__block {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.wp-block-cover h2,
|
||||
.wp-block-cover-image h2 {
|
||||
font-size: 2.48832em;
|
||||
|
|
|
@ -1189,6 +1189,7 @@ input.has-focus[type="submit"],
|
|||
background-color: black;
|
||||
min-height: 480px;
|
||||
margin: inherit;
|
||||
/* default & custom background-color */
|
||||
/* Treating H2 separately to account for legacy /core styles */
|
||||
/**
|
||||
* Block Options
|
||||
|
@ -1201,7 +1202,7 @@ input.has-focus[type="submit"],
|
|||
.wp-block-cover-image .wp-block-cover__inner-container,
|
||||
.wp-block-cover-image .wp-block-cover-image-text,
|
||||
.wp-block-cover-image .wp-block-cover-text {
|
||||
color: white;
|
||||
color: currentColor;
|
||||
margin-top: 32px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
@ -1215,6 +1216,15 @@ input.has-focus[type="submit"],
|
|||
color: currentColor;
|
||||
}
|
||||
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover__inner-container,
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover-image-text,
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover-text,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover__inner-container,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover-image-text,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover-text {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.wp-block-cover h2,
|
||||
.wp-block-cover-image h2 {
|
||||
font-size: 2.48832rem;
|
||||
|
|
|
@ -1189,6 +1189,7 @@ input.has-focus[type="submit"],
|
|||
background-color: black;
|
||||
min-height: 480px;
|
||||
margin: inherit;
|
||||
/* default & custom background-color */
|
||||
/* Treating H2 separately to account for legacy /core styles */
|
||||
/**
|
||||
* Block Options
|
||||
|
@ -1201,7 +1202,7 @@ input.has-focus[type="submit"],
|
|||
.wp-block-cover-image .wp-block-cover__inner-container,
|
||||
.wp-block-cover-image .wp-block-cover-image-text,
|
||||
.wp-block-cover-image .wp-block-cover-text {
|
||||
color: white;
|
||||
color: currentColor;
|
||||
margin-top: 32px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
@ -1215,6 +1216,15 @@ input.has-focus[type="submit"],
|
|||
color: currentColor;
|
||||
}
|
||||
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover__inner-container,
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover-image-text,
|
||||
.wp-block-cover:not([class*='background-color']) .wp-block-cover-text,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover__inner-container,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover-image-text,
|
||||
.wp-block-cover-image:not([class*='background-color']) .wp-block-cover-text {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.wp-block-cover h2,
|
||||
.wp-block-cover-image h2 {
|
||||
font-size: 2.48832rem;
|
||||
|
|
Loading…
Reference in a new issue