Bundled Themes: Improve display of blocks in widget areas.

Fixes minor styling issues, mostly font size and spacing, in blocks used in widget areas. Changes made to Twenty Ten, Twenty Thirteen, Twenty Fourteen, Twenty Sixteen, Twenty Seventeen, and Twenty Twenty-One.

Props noisysocks, sumaiyasiddika, danieldudzic, scruffian, jffng.
Fixes #53422.



git-svn-id: https://develop.svn.wordpress.org/trunk@51205 602fd350-edb4-49c9-b593-d223f7449a82

src/wp-content/themes/twentyfourteen/css/blocks.css

@@ -331,6 +331,15 @@ p.has-drop-cap:not(:focus)::first-letter {
 	color: #41a62a;
 }
 
+.widget-area .wp-block-latest-comments__comment-meta a {
+	color: #fff;
+}
+
+.widget-area .wp-block-latest-comments__comment-meta a:hover,
+.widget-area .wp-block-latest-comments__comment-meta a:focus {
+	color: #41a62a;
+}
+
 .wp-block-latest-comments__comment-excerpt p:last-child {
 }
 

src/wp-content/themes/twentyseventeen/assets/css/blocks.css

@@ -306,6 +306,10 @@ p.has-drop-cap:not(:focus)::first-letter {
 	margin-bottom: 4em;
 }
 
+.widget-area .wp-block-latest-comments article {
+	margin-bottom: 1em;
+}
+
 .blog:not(.has-sidebar) #primary .wp-block-latest-comments article,
 .archive:not(.page-one-column):not(.has-sidebar) #primary .wp-block-latest-comments article,
 .search:not(.has-sidebar) #primary .wp-block-latest-comments article {
@@ -324,6 +328,10 @@ p.has-drop-cap:not(:focus)::first-letter {
 
 }
 
+.wp-block-latest-comments .wp-block-latest-comments__comment {
+	border-top: none;
+}
+
 .wp-block-latest-comments__comment-meta {
 	font-size: 16px;
 	font-size: 1rem;
@@ -351,6 +359,12 @@ p.has-drop-cap:not(:focus)::first-letter {
 	font-size: 0.875rem;
 }
 
+/* Query Loop & Post Template */
+
+.wp-block-query .wp-block-post-template > li {
+	border-top: none;
+}
+
 /*--------------------------------------------------------------
 6.0 Blocks - Colors
 --------------------------------------------------------------*/

src/wp-content/themes/twentysixteen/css/blocks.css

@@ -327,7 +327,7 @@ hr.wp-block-separator {
 	line-height: 1.6153846154;
 }
 
-.wp-block-latest-comments .wp-block-latest-comments__comment {
+.wp-block-latest-comments .wp-block-latest-comments__comment:not(:first-child) {
 	border-top: 1px solid #d1d1d1;
 	margin-bottom: 0;
 	padding: 1.75em 0;
@@ -337,6 +337,21 @@ hr.wp-block-separator {
 	margin-bottom: 0;
 }
 
+/* Query Loop & Post Template */
+
+.wp-block-query .wp-block-post-template {
+	margin-left: 0;
+}
+
+.wp-block-query .wp-block-post-template li {
+	margin-bottom: 0;
+	padding: 1.5em 0 0;
+}
+
+.wp-block-query .wp-block-post-template li:not(:first-child) {
+	border-top: 1px solid #d1d1d1;
+}
+
 /*--------------------------------------------------------------
 6.0 Blocks - Colors
 --------------------------------------------------------------*/

src/wp-content/themes/twentyten/style.css

@@ -1285,6 +1285,11 @@ h3#reply-title {
 	margin-left: 1.3em;
 	padding: 0;
 }
+
+#main .widget-area ul.wp-block-latest-posts.wp-block-latest-posts__list {
+	list-style: square;
+}
+
 #primary {
 }
 #secondary {

src/wp-content/themes/twentythirteen/css/blocks.css

@@ -583,7 +583,7 @@ body:not(.sidebar) .wp-block-table.alignfull {
 	font-size: 16px;
 }
 
-.wp-block-latest-comments .wp-block-latest-comments__comment {
+.wp-block-latest-comments .wp-block-latest-comments__comment:not(:first-child) {
 	background: url(../images/dotted-line.png) repeat-x left top;
 	margin-bottom: 0;
 	padding: 24px 0;

src/wp-content/themes/twentytwentyone/assets/css/ie.css

@@ -3590,6 +3590,11 @@ h6 {
 	margin-bottom: 0;
 }
 
+.widget-area .wp-block-latest-posts:not(.is-grid) > li {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+
 .wp-block-latest-posts.is-grid {
 	word-wrap: break-word;
 	word-break: break-word;
@@ -3644,6 +3649,11 @@ h6 {
 	}
 }
 
+.widget-area .wp-block-latest-posts > li > a {
+	font-size: 1.125rem;
+	margin-bottom: 0;
+}
+
 .wp-block-latest-posts .wp-block-latest-posts__post-author {
 	color: #28303d;
 	font-size: 1.25rem;

src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/latest-posts/_style.scss

@@ -15,6 +15,11 @@
 		}
 	}
 
+	.widget-area &:not(.is-grid) > li {
+		margin-top: 0;
+		margin-bottom: 0;
+	}
+
 	&.is-grid {
 		word-wrap: break-word;
 		word-break: break-word;
@@ -65,6 +70,11 @@
 		margin-bottom: calc(0.333 * var(--global--spacing-vertical));
 	}
 
+	.widget-area & > li > a {
+		font-size: var(--global--font-size-sm);
+		margin-bottom: 0;
+	}
+
 	// Post author
 	.wp-block-latest-posts__post-author {
 		color: var(--global--color-primary);

src/wp-content/themes/twentytwentyone/style-rtl.css

@@ -2462,6 +2462,11 @@ h6,
 	margin-bottom: 0;
 }
 
+.widget-area .wp-block-latest-posts:not(.is-grid) > li {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+
 .wp-block-latest-posts.is-grid {
 	word-wrap: break-word;
 	word-break: break-word;
@@ -2510,6 +2515,11 @@ h6,
 	margin-bottom: calc(0.333 * var(--global--spacing-vertical));
 }
 
+.widget-area .wp-block-latest-posts > li > a {
+	font-size: var(--global--font-size-sm);
+	margin-bottom: 0;
+}
+
 .wp-block-latest-posts .wp-block-latest-posts__post-author {
 	color: var(--global--color-primary);
 	font-size: var(--global--font-size-md);

src/wp-content/themes/twentytwentyone/style.css

@@ -2472,6 +2472,11 @@ h6,
 	margin-bottom: 0;
 }
 
+.widget-area .wp-block-latest-posts:not(.is-grid) > li {
+	margin-top: 0;
+	margin-bottom: 0;
+}
+
 .wp-block-latest-posts.is-grid {
 	word-wrap: break-word;
 	word-break: break-word;
@@ -2520,6 +2525,11 @@ h6,
 	margin-bottom: calc(0.333 * var(--global--spacing-vertical));
 }
 
+.widget-area .wp-block-latest-posts > li > a {
+	font-size: var(--global--font-size-sm);
+	margin-bottom: 0;
+}
+
 .wp-block-latest-posts .wp-block-latest-posts__post-author {
 	color: var(--global--color-primary);
 	font-size: var(--global--font-size-md);