← All changes | build/styles/block-editor/style-rtl.css +113 -30 24.0.0 → trunk View file →

		@@ -339,8 +339,21 @@
339	339	padding: 32px 16px;
340	340	text-align: center;
341	341	}
342	342
	343	+.block-editor-block-inspector__state-badges {
	344	+ display: flex;
	345	+ align-items: center;
	346	+ flex-wrap: wrap;
	347	+ gap: 8px;
	348	+ padding: 8px 16px;
	349	+ margin-top: -16px;
	350	+}
	351	+
	352	+.block-editor-block-inspector__state-badges-text {
	353	+ white-space: nowrap;
	354	+}
	355	+
343	356	.block-editor-block-inspector__no-block-tools {
344	357	border-top: 1px solid #ddd;
345	358	}
346	359
		@@ -635,9 +648,9 @@
635	648	}
636	649	.block-editor-block-lock-modal__checklist-item .block-editor-block-lock-modal__lock-icon {
637	650	flex-shrink: 0;
638	651	margin-left: 12px;
639		- fill: #1e1e1e;
	652	+ color: #1e1e1e;
640	653	}
641	654	.block-editor-block-lock-modal__checklist-item:hover {
642	655	background-color: #f0f0f0;
643	656	border-radius: 2px;
		@@ -745,8 +758,9 @@
745	758	display: flex;
746	759	align-items: center;
747	760	flex-wrap: wrap;
748	761	gap: 4px 8px;
	762	+ overflow-wrap: anywhere;
749	763	}
750	764	.block-editor-block-card__title.block-editor-block-card__title {
751	765	font-size: 13px;
752	766	line-height: 1.4;
		@@ -1043,16 +1057,8 @@
1043	1057	animation: components-button__appear-animation 0.1s ease;
1044	1058	animation-fill-mode: forwards;
1045	1059	}
1046	1060	}
1047		-.components-button.block-editor-block-mover-button:focus, .components-button.block-editor-block-mover-button:focus:enabled, .components-button.block-editor-block-mover-button:focus::before {
1048		- box-shadow: none;
1049		- outline: none;
1050		-}
1051		-.components-button.block-editor-block-mover-button:focus-visible::before {
1052		- box-shadow: inset 0 0 0 1px #fff, 0 0 0 var(--wp-admin-border-width-focus) var(--wp-admin-theme-color);
1053		- outline: 2px solid transparent;
1054		-}
1055	1061
1056	1062	.block-editor-block-navigation__container {
1057	1063	min-width: 280px;
1058	1064	}
		@@ -1125,9 +1131,9 @@
1125	1131	min-width: 24px;
1126	1132	height: 24px;
1127	1133	}
1128	1134	.block-editor-block-patterns-list__item .block-editor-patterns__pattern-icon-wrapper .block-editor-patterns__pattern-icon {
1129		- fill: var(--wp-block-synced-color);
	1135	+ color: var(--wp-block-synced-color);
1130	1136	}
1131	1137
1132	1138	.block-editor-patterns__grid-pagination-wrapper .block-editor-patterns__grid-pagination {
1133	1139	border-top: 1px solid #2f2f2f;
		@@ -1622,8 +1628,9 @@
1622	1628	background: #f0f0f0;
1623	1629	color: var(--wp-admin-theme-color);
1624	1630	}
1625	1631	.block-editor-tools-panel-color-gradient-settings__dropdown .block-editor-panel-color-gradient-settings__color-name {
	1632	+ min-width: 0;
1626	1633	white-space: nowrap;
1627	1634	overflow: hidden;
1628	1635	text-overflow: ellipsis;
1629	1636	max-width: calc(100% - 44px);
		@@ -1638,8 +1645,21 @@
1638	1645	.block-editor-panel-color-gradient-settings__dropdown .component-color-indicator {
1639	1646	flex-shrink: 0;
1640	1647	}
1641	1648
	1649	+.block-editor-panel-color-gradient-settings__labeled-indicators {
	1650	+ width: 100%;
	1651	+ min-width: 0;
	1652	+}
	1653	+
	1654	+.block-editor-panel-color-gradient-settings__color-indicators {
	1655	+ display: flex;
	1656	+ flex-shrink: 0;
	1657	+}
	1658	+.block-editor-panel-color-gradient-settings__color-indicators > * + * {
	1659	+ margin-inline-start: -8px;
	1660	+}
	1661	+
1642	1662	.block-editor-panel-color-gradient-settings__reset {
1643	1663	position: absolute;
1644	1664	left: 0;
1645	1665	top: 8px;
		@@ -1769,8 +1789,17 @@
1769	1789	.block-editor-global-styles__shadow-dropdown-toggle.is-open {
1770	1790	background-color: #f0f0f0;
1771	1791	}
1772	1792
	1793	+.block-editor-panel-duotone-settings__label-row {
	1794	+ width: 100%;
	1795	+ min-width: 0;
	1796	+}
	1797	+
	1798	+.block-editor-panel-duotone-settings__label {
	1799	+ min-width: 0;
	1800	+}
	1801	+
1773	1802	.block-editor-global-styles__shadow-editor__remove-button {
1774	1803	position: absolute;
1775	1804	left: 0;
1776	1805	top: 8px;
		@@ -1852,8 +1881,72 @@
1852	1881	opacity: 1;
1853	1882	}
1854	1883	}
1855	1884
	1885	+.block-editor-global-styles__text-shadow {
	1886	+ width: 260px;
	1887	+ padding: 8px;
	1888	+}
	1889	+
	1890	+.block-editor-global-styles__text-shadow-preview {
	1891	+ display: flex;
	1892	+ align-items: center;
	1893	+ justify-content: center;
	1894	+ height: 80px;
	1895	+ border: #ddd 1px solid;
	1896	+ border-radius: 2px;
	1897	+ font-size: 24px;
	1898	+ margin-bottom: 16px;
	1899	+ background-image: repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0), repeating-linear-gradient(45deg, #e0e0e0 25%, transparent 25%, transparent 75%, #e0e0e0 75%, #e0e0e0);
	1900	+ background-position: 0 0, 8px 8px;
	1901	+ background-size: 16px 16px;
	1902	+}
	1903	+
	1904	+.block-editor-global-styles__text-shadow-list-item {
	1905	+ justify-content: space-between;
	1906	+ gap: 8px;
	1907	+ width: 100%;
	1908	+}
	1909	+.block-editor-global-styles__text-shadow-list-item:not(.is-active) svg {
	1910	+ opacity: 0;
	1911	+}
	1912	+
	1913	+.block-editor-global-styles__text-shadow-dropdown {
	1914	+ display: block;
	1915	+ padding: 0;
	1916	+ position: relative;
	1917	+ border: 1px solid #ddd;
	1918	+ border-radius: 2px;
	1919	+}
	1920	+
	1921	+.block-editor-global-styles__text-shadow-dropdown-toggle {
	1922	+ width: 100%;
	1923	+ padding: 8px;
	1924	+}
	1925	+.block-editor-global-styles__text-shadow-dropdown-toggle.is-open {
	1926	+ background-color: #f0f0f0;
	1927	+}
	1928	+
	1929	+.block-editor-global-styles__text-shadow-remove-button {
	1930	+ position: absolute;
	1931	+ left: 8px;
	1932	+ top: 8px;
	1933	+ opacity: 0;
	1934	+}
	1935	+@media not (prefers-reduced-motion) {
	1936	+ .block-editor-global-styles__text-shadow-remove-button {
	1937	+ transition: opacity 0.1s ease-in-out;
	1938	+ }
	1939	+}
	1940	+.block-editor-global-styles__text-shadow-dropdown:hover .block-editor-global-styles__text-shadow-remove-button, .block-editor-global-styles__text-shadow-remove-button:focus, .block-editor-global-styles__text-shadow-remove-button:hover {
	1941	+ opacity: 1;
	1942	+}
	1943	+@media (hover: none) {
	1944	+ .block-editor-global-styles__text-shadow-remove-button {
	1945	+ opacity: 1;
	1946	+ }
	1947	+}
	1948	+
1856	1949	.is-inherited-from-global-styles .components-base-control__label,
1857	1950	.is-inherited-from-global-styles .components-input-control__label {
1858	1951	text-decoration-line: underline;
1859	1952	text-decoration-style: dotted;
		@@ -2238,9 +2331,10 @@
2238	2331	align-items: stretch;
2239	2332	justify-content: center;
2240	2333	cursor: var(--wpds-cursor-control, pointer);
2241	2334	background: transparent;
2242		- word-break: break-word;
	2335	+ word-break: normal;
	2336	+ overflow-wrap: break-word;
2243	2337	}
2244	2338	@media not (prefers-reduced-motion) {
2245	2339	.components-button.block-editor-block-types-list__item {
2246	2340	transition: all 0.05s ease-in-out;
		@@ -2511,9 +2605,9 @@
2511	2605	color: inherit;
2512	2606	background-color: transparent;
2513	2607	}
2514	2608	.block-editor-link-control__preview .block-editor-link-control__preview-title span {
2515		- font-weight: normal;
	2609	+ font-weight: 400;
2516	2610	}
2517	2611	.block-editor-link-control__preview .block-editor-link-control__preview-title .components-external-link__icon {
2518	2612	position: absolute;
2519	2613	width: 1px;
		@@ -3020,14 +3114,8 @@
3020	3114	}
3021	3115	.block-editor-list-view-leaf .block-editor-block-mover-button.is-down-button svg {
3022	3116	top: -4px;
3023	3117	}
3024		-.block-editor-list-view-leaf .block-editor-block-mover-button::before {
3025		- height: 16px;
3026		- min-width: 100%;
3027		- right: 0;
3028		- left: 0;
3029		-}
3030	3118	.block-editor-list-view-leaf .block-editor-inserter__toggle {
3031	3119	background: #1e1e1e;
3032	3120	color: #fff;
3033	3121	height: 24px;
		@@ -3332,8 +3420,13 @@
3332	3420	width: 36px;
3333	3421	height: 24px;
3334	3422	}
3335	3423
	3424	+.block-editor-plain-text {
	3425	+ width: 100%;
	3426	+ field-sizing: content;
	3427	+}
	3428	+
3336	3429	.block-editor-responsive-block-control {
3337	3430	margin-bottom: 28px;
3338	3431	border-bottom: 1px solid #ccc;
3339	3432	padding-bottom: 14px;
		@@ -3371,9 +3464,9 @@
3371	3464	overflow: hidden;
3372	3465	padding: 0;
3373	3466	position: absolute;
3374	3467	width: 1px;
3375		- word-wrap: normal !important;
	3468	+ overflow-wrap: normal !important;
3376	3469	word-break: normal !important;
3377	3470	}
3378	3471
3379	3472	.preset-input-control__wrapper > * {
		@@ -3691,13 +3784,8 @@
3691	3784	font-size: 12px;
3692	3785	margin-bottom: 16px;
3693	3786	}
3694	3787
3695		-.block-editor-hooks__position-control-item-hint {
3696		- color: var(--wpds-color-foreground-content-neutral-weak, #707070);
3697		- margin-block-start: 4px;
3698		-}
3699		-
3700	3788	div.block-editor-bindings__panel {
3701	3789	grid-template-columns: repeat(auto-fit, minmax(100%, 1fr));
3702	3790	}
3703	3791	div.block-editor-bindings__panel button:hover .block-editor-bindings__item span {
		@@ -4741,9 +4829,9 @@
4741	4829	.block-editor-block-visibility-modal__options-checkbox--everywhere {
4742	4830	font-weight: var(--wpds-typography-font-weight-emphasis, 600);
4743	4831	}
4744	4832	.block-editor-block-visibility-modal__options-icon--checked {
4745		- fill: #ddd;
	4833	+ color: #ddd;
4746	4834	}
4747	4835	.block-editor-block-visibility-modal__sub-options {
4748	4836	width: 100%;
4749	4837	padding-inline-start: 12px;
		@@ -4753,14 +4841,9 @@
4753	4841	color: #757575;
4754	4842	}
4755	4843
4756	4844	.block-editor-block-visibility-info {
4757		- padding-top: 4px;
4758		- padding-bottom: 4px;
4759	4845	margin: 0 16px 16px;
4760		- display: flex;
4761		- align-items: center;
4762		- justify-content: start;
4763	4846	}
4764	4847
4765	4848	/* The stop element is invisible, so its focus indication is drawn around the
4766	4849	canvas it stands for. For the iframed canvas it is an overlay instead of