← All changes | build/styles/block-library/latest-posts/style-rtl.css +26 -15 23.2.2 → trunk View file →

		@@ -1,5 +1,8 @@
1	1	/**
	2	+ * Breakpoints & Media Queries
	3	+ */
	4	+/**
2	5	* Typography
3	6	*/
4	7	/**
5	8	* SCSS Variables.
		@@ -46,11 +49,8 @@
46	49	* React Native specific.
47	50	* These variables do not appear to be used anywhere else.
48	51	*/
49	52	/**
50		- * Breakpoints & Media Queries
51		- */
52		-/**
53	53	* Converts a hex value into the rgb equivalent.
54	54	*
55	55	* @param {string} hex - the hexadecimal value to convert
56	56	* @return {string} comma separated rgb values
		@@ -67,8 +67,14 @@
67	67	/**
68	68	* Focus styles.
69	69	*/
70	70	/**
	71	+ * Standard focus rings for the WordPress Design System.
	72	+ *
	73	+ * Apply `outset-ring__focus` inside the relevant pseudo-class at the call site,
	74	+ * e.g. `&:focus { @include outset-ring__focus(); }`.
	75	+ */
	76	+/**
71	77	* Applies editor left position to the selector passed as argument
72	78	*/
73	79	/**
74	80	* Styles that are reused verbatim in a few places
		@@ -102,49 +108,54 @@
102	108	.wp-block-latest-posts.wp-block-latest-posts__list li {
103	109	clear: both;
104	110	overflow-wrap: break-word;
105	111	}
106		-.wp-block-latest-posts.is-grid {
	112	+.wp-block-latest-posts.is-grid:not(.is-layout-grid) {
107	113	display: flex;
108	114	flex-wrap: wrap;
109	115	}
110		-.wp-block-latest-posts.is-grid li {
	116	+.wp-block-latest-posts.is-grid:not(.is-layout-grid) li {
111	117	margin: 0 0 1.25em 1.25em;
112	118	width: 100%;
113	119	}
114	120	@media (min-width: 600px) {
115		- .wp-block-latest-posts.columns-2 li {
	121	+ .wp-block-latest-posts.columns-2:not(.is-layout-grid) li {
116	122	width: calc(100% / 2 - 1.25em + 1.25em / 2);
117	123	}
118		- .wp-block-latest-posts.columns-2 li:nth-child(2n) {
	124	+ .wp-block-latest-posts.columns-2:not(.is-layout-grid) li:nth-child(2n) {
119	125	margin-left: 0;
120	126	}
121		- .wp-block-latest-posts.columns-3 li {
	127	+ .wp-block-latest-posts.columns-3:not(.is-layout-grid) li {
122	128	width: calc(100% / 3 - 1.25em + 1.25em / 3);
123	129	}
124		- .wp-block-latest-posts.columns-3 li:nth-child(3n) {
	130	+ .wp-block-latest-posts.columns-3:not(.is-layout-grid) li:nth-child(3n) {
125	131	margin-left: 0;
126	132	}
127		- .wp-block-latest-posts.columns-4 li {
	133	+ .wp-block-latest-posts.columns-4:not(.is-layout-grid) li {
128	134	width: calc(100% / 4 - 1.25em + 1.25em / 4);
129	135	}
130		- .wp-block-latest-posts.columns-4 li:nth-child(4n) {
	136	+ .wp-block-latest-posts.columns-4:not(.is-layout-grid) li:nth-child(4n) {
131	137	margin-left: 0;
132	138	}
133		- .wp-block-latest-posts.columns-5 li {
	139	+ .wp-block-latest-posts.columns-5:not(.is-layout-grid) li {
134	140	width: calc(100% / 5 - 1.25em + 1.25em / 5);
135	141	}
136		- .wp-block-latest-posts.columns-5 li:nth-child(5n) {
	142	+ .wp-block-latest-posts.columns-5:not(.is-layout-grid) li:nth-child(5n) {
137	143	margin-left: 0;
138	144	}
139		- .wp-block-latest-posts.columns-6 li {
	145	+ .wp-block-latest-posts.columns-6:not(.is-layout-grid) li {
140	146	width: calc(100% / 6 - 1.25em + 1.25em / 6);
141	147	}
142		- .wp-block-latest-posts.columns-6 li:nth-child(6n) {
	148	+ .wp-block-latest-posts.columns-6:not(.is-layout-grid) li:nth-child(6n) {
143	149	margin-left: 0;
144	150	}
145	151	}
146	152
	153	+@media (max-width: 600px) {
	154	+ .wp-block-latest-posts-is-layout-grid[class*=columns-]:not(.has-native-responsive-grid) {
	155	+ grid-template-columns: 1fr;
	156	+ }
	157	+}
147	158	:root :where(.wp-block-latest-posts.is-grid) {
148	159	padding: 0;
149	160	}
150	161	:root :where(.wp-block-latest-posts.wp-block-latest-posts__list) {