wp/wp-admin/css/customize-controls-rtl.css
changeset 21 48c4eec2b7e6
parent 19 3d72ae0968f4
child 22 8c2e4d02f4ef
--- a/wp/wp-admin/css/customize-controls-rtl.css	Thu Sep 29 08:06:27 2022 +0200
+++ b/wp/wp-admin/css/customize-controls-rtl.css	Fri Sep 05 18:40:08 2025 +0200
@@ -473,7 +473,6 @@
 	height: 20px;
 	cursor: pointer;
 	box-shadow: none;
-	-webkit-appearance: none;
 	background: transparent;
 	color: #50575e;
 	border: none;
@@ -1084,14 +1083,24 @@
 	float: right;
 }
 
-#available-menu-items .accordion-section-content .new-content-item,
-.customize-control-dropdown-pages .new-content-item {
+#available-menu-items .accordion-section-content .new-content-item-wrapper,
+.customize-control-dropdown-pages .new-content-item-wrapper {
 	width: calc(100% - 30px);
 	padding: 8px 15px;
 	position: absolute;
 	bottom: 0;
 	z-index: 10;
 	background: #f0f0f1;
+}
+
+.customize-control-dropdown-pages .new-content-item-wrapper {
+	width: 100%;
+	padding: 0;
+	position: static;
+}
+
+#available-menu-items .accordion-section-content .new-content-item,
+.customize-control-dropdown-pages .new-content-item {
 	display: flex;
 }
 
@@ -1101,6 +1110,14 @@
 	position: relative;
 }
 
+.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item {
+	padding: 0;
+}
+
+.customize-control-dropdown-pages .new-content-item-wrapper .new-content-item label {
+	line-height: 1.6;
+}
+
 #available-menu-items .new-content-item .create-item-input,
 .customize-control-dropdown-pages .new-content-item .create-item-input {
 	flex-grow: 10;
@@ -1568,10 +1585,9 @@
 }
 
 .customize-control-header .choice:focus {
-	outline: none;
-	box-shadow:
-		0 0 0 1px #4f94d4,
-		0 0 3px 1px rgba(79, 148, 212, 0.8);
+	box-shadow: 0 0 0 2px #2271b1;
+	/* Only visible in Windows High Contrast mode */
+	outline: 2px solid transparent;
 }
 
 .customize-control-header .uploaded div:last-child > .choice {
@@ -1606,7 +1622,6 @@
 	font-family: Consolas, Monaco, monospace;
 	font-size: 12px;
 	padding: 6px 8px;
-	-o-tab-size: 2;
 	tab-size: 2;
 }
 .customize-control-code_editor textarea,
@@ -1819,11 +1834,6 @@
 	bottom: 0;
 }
 
-.themes-filter-bar .feature-filter-toggle {
-	float: left;
-	margin: 3px 25px 3px 0;
-}
-
 .themes-filter-bar .feature-filter-toggle:before {
 	content: "\f111";
 	margin: 0 0 0 5px;
@@ -1884,12 +1894,6 @@
 	animation: .6s themes-fade-in 1;
 }
 
-.control-panel-themes .filter-themes-count {
-	position: relative;
-	float: left;
-	line-height: 2.6;
-}
-
 .control-panel-themes .filter-themes-count .themes-displayed {
 	font-weight: 600;
 	color: #50575e;
@@ -2101,6 +2105,28 @@
 	box-sizing: border-box;
 	border-bottom: 1px solid #dcdcde;
 }
+.customize-preview-header.themes-filter-bar,
+.customize-preview-header.themes-filter-bar .search-form {
+	display: flex;
+	align-items: center;
+	gap: 10px;
+	flex-wrap: wrap;
+}
+
+.customize-preview-header.themes-filter-bar .search-form-input {
+	position: relative;
+}
+
+.customize-preview-header .filter-themes-wrapper {
+	display: grid;
+	align-items: center;
+	gap: 10px;
+	grid-template-columns: auto 1fr;
+}
+
+.customize-preview-header .filter-themes-wrapper .filter-themes-count {
+	justify-self: end;
+}
 
 @media screen and (min-width: 1670px) {
 	.customize-preview-header.themes-filter-bar {
@@ -2113,6 +2139,9 @@
 .themes-filter-bar .themes-filter-container {
 	margin: 0;
 	padding: 0;
+	display: flex;
+	align-items: center;
+	gap: 10px;
 }
 
 .themes-filter-bar .wp-filter-search {
@@ -2121,11 +2150,10 @@
 	max-width: 100%;
 	width: 40%;
 	min-width: 300px;
-	position: absolute;
-	top: 6px;
-	right: 25px;
 	height: 32px;
 	margin: 1px 0;
+	top: 0;
+	right: 0;
 }
 
 /* Unstick the filter bar on short windows/screens. This breakpoint is based on the
@@ -2159,18 +2187,31 @@
 	}
 }
 
-@media screen and (max-width: 900px) {
+@media screen and (max-width: 960px) {
 	.customize-preview-header.themes-filter-bar {
-		height: 86px;
-		padding-top: 46px;
+		height: 96px;
 	}
-
+}
+
+@media screen and (max-width: 900px) {
 	.themes-filter-bar .wp-filter-search {
-		width: calc(100% - 50px);
+		width: 100%;
 		margin: 0;
 		min-width: 200px;
 	}
 
+	.customize-preview-header.themes-filter-bar,
+	.customize-preview-header.themes-filter-bar .search-form
+	.themes-filter-bar .themes-filter-container {
+		display: grid;
+		gap: 4px;
+	}
+
+	.customize-preview-header.themes-filter-bar .search-form-input {
+		display: flex;
+		flex-grow: 1;
+	}
+
 	.filter-drawer {
 		top: 86px;
 	}
@@ -2320,7 +2361,7 @@
 
 .wp-customizer .theme-overlay .theme-actions {
 	text-align: left; /* Because there're only one or two actions, match the UI pattern of media modals and right-align the action. */
-	padding: 10px 25px;
+	padding: 10px 25px 5px;
 	background: #f0f0f1;
 	border-top: 1px solid #dcdcde;
 }
@@ -2329,13 +2370,6 @@
 	margin-right: 8px;
 }
 
-.control-panel-themes .theme-actions .delete-theme {
-	right: 15px; /* these override themes.css on mobile */
-	left: auto;
-	bottom: auto;
-	position: absolute;
-}
-
 .modal-open .in-themes-panel #customize-controls .wp-full-overlay-sidebar-content {
 	overflow: visible; /* Prevent the top-level Customizer controls from becoming visible when elements on the right of the details modal are focused. */
 }
@@ -2591,7 +2625,7 @@
 }
 
 #available-widgets-list {
-	top: 60px;
+	top: 82px;
 	position: absolute;
 	overflow: auto;
 	bottom: 0;
@@ -2635,7 +2669,7 @@
 #available-widgets-filter .search-icon {
 	display: block;
 	position: absolute;
-	top: 15px; /* 13 container padding +1 input margin +1 input border */
+	bottom: 15px; /* 13 container padding +1 input margin +1 input border */
 	right: 16px;
 	width: 30px;
 	height: 30px;
@@ -2645,9 +2679,9 @@
 }
 
 #available-widgets-filter .clear-results,
-#available-menu-items-search .clear-results {
+#available-menu-items-search .accordion-section-title .clear-results {
 	position: absolute;
-	top: 15px; /* 13 container padding +1 input margin +1 input border */
+	top: 36px; /* 13 container padding +1 input margin +1 input border */
 	left: 16px;
 	width: 30px;
 	height: 30px;
@@ -2689,9 +2723,9 @@
 
 #available-widgets-filter .clear-results:focus,
 #available-menu-items-search .clear-results:focus {
-	box-shadow:
-		0 0 0 1px #4f94d4,
-		0 0 2px 1px rgba(79, 148, 212, 0.8);
+	box-shadow: 0 0 0 2px #2271b1;
+	/* Only visible in Windows High Contrast mode */
+	outline: 2px solid transparent;
 }
 
 #available-menu-items-search .search-icon:after,
@@ -2706,8 +2740,8 @@
 
 .themes-filter-bar .search-icon {
 	position: absolute;
-	top: 7px;
-	right: 26px;
+	top: 2px;
+	right: 2px;
 	z-index: 1;
 	color: #646970;
 	height: 30px;
@@ -2825,8 +2859,8 @@
 		margin-top: 12px;
 	}
 
-	.wp-core-ui .themes-filter-bar .feature-filter-toggle {
-		margin: 3px 25px 3px 0;
+	.customize-preview-header.themes-filter-bar .search-icon {
+		top: 6px;
 	}
 }
 
@@ -2963,22 +2997,18 @@
 	}
 
 	#available-widgets-list {
-		top: 130px;
+		top: 152px;
 	}
 
-	#available-menu-items-search .clear-results,
-	#available-menu-items-search .search-icon {
-		top: 85px; /* 70 section title height + 13 container padding +1 input margin +1 input border */
+	#available-menu-items-search .clear-results {
+		top: 36px;
+		left: 16px;
 	}
 
 	.reorder,
 	.reordering .reorder-done {
 		padding: 8px;
 	}
-
-	.wp-core-ui .themes-filter-bar .feature-filter-toggle {
-		margin: 0;
-	}
 }
 
 @media screen and (max-width: 600px) {