Varia: Make sure quote border is visible with background

varia/sass/blocks/quote/_editor.scss

@@ -22,4 +22,20 @@
 			line-height: #{map-deep-get($config-heading, "font", "line-height", "h3")};
 		}
 	}
+
+	.has-background:not(.has-background-background-color) &,
+	[class*=background-color]:not(.has-background-background-color) & {
+			border-color: currentColor;
+	}
+
+	.wp-block-quote__citation {
+		color: #{map-deep-get($config-global, "color", "foreground", "light")};
+		font-size: (strip-unit(map-deep-get($config-global, "font", "size", "sm")) + 0em);
+		letter-spacing: #{map-deep-get($config-global, "font", "letter-spacing", "sm")};
+
+		.has-background:not(.has-background-background-color) &,
+		[class*=background-color]:not(.has-background-background-color) & {
+			color: currentColor;
+		}
+	}
 }

varia/sass/blocks/quote/_style.scss

@@ -31,7 +31,8 @@
 		font-size: #{map-deep-get($config-global, "font", "size", "sm")};
 		letter-spacing: #{map-deep-get($config-global, "font", "letter-spacing", "sm")};
 
-		.has-background & {
+		.has-background:not(.has-background-background-color) &,
+		[class*=background-color]:not(.has-background-background-color) & {
 			color: currentColor;
 		}
 	}
@@ -64,4 +65,9 @@
 			letter-spacing: #{map-deep-get($config-global, "font", "letter-spacing", "sm")};
 		}
 	}
+
+	.has-background:not(.has-background-background-color) &,
+	[class*=background-color]:not(.has-background-background-color) & {
+		border-color: currentColor;
+	}
 }

varia/sass/blocks/utilities/_editor.scss

@@ -50,8 +50,7 @@
 // Gutenberg background-color options
 .has-background {
 	&:not(.has-background-background-color) a,
-	p, h1, h2, h3, h4, h5, h6,
-	.wp-block-quote__citation {
+	p, h1, h2, h3, h4, h5, h6 {
 		color: currentColor;
 	}
 }

varia/sass/blocks/utilities/_style.scss

@@ -138,10 +138,8 @@
 
 // Gutenberg background-color options
 .has-background {
-
 	&:not(.has-background-background-color) a,
-	p, h1, h2, h3, h4, h5, h6,
-	.wp-block-quote__citation {
+	p, h1, h2, h3, h4, h5, h6 {
 		color: currentColor;
 	}
 }

varia/style-editor.css

@@ -555,6 +555,22 @@ p.has-background:not(.has-background-background-color) a {
 	line-height: 1.125;
 }
 
+.has-background:not(.has-background-background-color) .wp-block-quote,
+[class*=background-color]:not(.has-background-background-color) .wp-block-quote {
+	border-color: currentColor;
+}
+
+.wp-block-quote .wp-block-quote__citation {
+	color: #767676;
+	font-size: 0.83333em;
+	letter-spacing: normal;
+}
+
+.has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
+[class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation {
+	color: currentColor;
+}
+
 .wp-block-separator,
 hr {
 	border-bottom: 2px solid #DDDDDD;
@@ -640,8 +656,7 @@ table th,
 }
 
 .has-background:not(.has-background-background-color) a,
-.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
-.has-background .wp-block-quote__citation {
+.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
 	color: currentColor;
 }
 

varia/style-rtl.css

@@ -1830,8 +1830,13 @@ p.has-background {
 	letter-spacing: normal;
 }
 
-.has-background .wp-block-quote .wp-block-quote__citation, .has-background
-.wp-block-quote cite, .has-background
+.has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
+[class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, .has-background:not(.has-background-background-color)
+.wp-block-quote cite,
+[class*=background-color]:not(.has-background-background-color)
+.wp-block-quote cite, .has-background:not(.has-background-background-color)
+.wp-block-quote footer,
+[class*=background-color]:not(.has-background-background-color)
 .wp-block-quote footer {
 	color: currentColor;
 }
@@ -1862,6 +1867,11 @@ p.has-background {
 	letter-spacing: normal;
 }
 
+.has-background:not(.has-background-background-color) .wp-block-quote,
+[class*=background-color]:not(.has-background-background-color) .wp-block-quote {
+	border-color: currentColor;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;
@@ -2042,8 +2052,7 @@ table th,
 }
 
 .has-background:not(.has-background-background-color) a,
-.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
-.has-background .wp-block-quote__citation {
+.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
 	color: currentColor;
 }
 

varia/style.css

@@ -1830,8 +1830,13 @@ p.has-background {
 	letter-spacing: normal;
 }
 
-.has-background .wp-block-quote .wp-block-quote__citation, .has-background
-.wp-block-quote cite, .has-background
+.has-background:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation,
+[class*=background-color]:not(.has-background-background-color) .wp-block-quote .wp-block-quote__citation, .has-background:not(.has-background-background-color)
+.wp-block-quote cite,
+[class*=background-color]:not(.has-background-background-color)
+.wp-block-quote cite, .has-background:not(.has-background-background-color)
+.wp-block-quote footer,
+[class*=background-color]:not(.has-background-background-color)
 .wp-block-quote footer {
 	color: currentColor;
 }
@@ -1862,6 +1867,11 @@ p.has-background {
 	letter-spacing: normal;
 }
 
+.has-background:not(.has-background-background-color) .wp-block-quote,
+[class*=background-color]:not(.has-background-background-color) .wp-block-quote {
+	border-color: currentColor;
+}
+
 hr {
 	border-bottom: 2px solid #DDDDDD;
 	clear: both;
@@ -2047,8 +2057,7 @@ table th,
 }
 
 .has-background:not(.has-background-background-color) a,
-.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6,
-.has-background .wp-block-quote__citation {
+.has-background p, .has-background h1, .has-background h2, .has-background h3, .has-background h4, .has-background h5, .has-background h6 {
 	color: currentColor;
 }