wp/wp-admin/css/customize-controls.css
changeset 19 3d72ae0968f4
parent 18 be944660c56a
child 21 48c4eec2b7e6
--- a/wp/wp-admin/css/customize-controls.css	Wed Sep 21 18:19:35 2022 +0200
+++ b/wp/wp-admin/css/customize-controls.css	Tue Sep 27 16:37:53 2022 +0200
@@ -105,6 +105,12 @@
 	height: 100%;
 }
 
+@media (prefers-reduced-motion: reduce) {
+	#customize-sidebar-outer-content {
+		transition: none;
+	}
+}
+
 #customize-theme-controls .control-section-outer {
 	display: none !important;
 }
@@ -123,6 +129,12 @@
 	transition: left .18s;
 }
 
+@media (prefers-reduced-motion: reduce) {
+	.outer-section-open .wp-full-overlay.expanded #customize-sidebar-outer-content {
+		transition: none;
+	}
+}
+
 .customize-outer-pane-parent {
 	margin: 0;
 }
@@ -537,6 +549,13 @@
 		.15s border-color ease-in-out;
 }
 
+@media (prefers-reduced-motion: reduce) {
+	#customize-theme-controls .accordion-section-title,
+	#customize-outer-theme-controls .accordion-section-title {
+		transition: none;
+	}
+}
+
 #customize-controls #customize-theme-controls .customize-themes-panel .accordion-section-title {
 	color: #50575e;
 	background-color: #fff;
@@ -635,6 +654,14 @@
 	transition: 0.18s transform cubic-bezier(0.645, 0.045, 0.355, 1); /* easeInOutCubic */
 }
 
+@media (prefers-reduced-motion: reduce) {
+	#customize-info,
+	#customize-theme-controls .customize-pane-parent,
+	#customize-theme-controls .customize-pane-child {
+		transition: none;
+	}
+}
+
 #customize-theme-controls .customize-pane-child.skip-transition {
 	transition: none;
 }
@@ -716,7 +743,7 @@
 }
 
 .customize-section-title {
-	margin: -12px -12px 0 -12px;
+	margin: -12px -12px 0;
 	border-bottom: 1px solid #dcdcde;
 	background: #fff;
 }
@@ -739,11 +766,11 @@
 
 #customize-theme-controls .customize-themes-panel h3.customize-section-title:first-child {
 	border-bottom: 1px solid #dcdcde;
-	padding: 12px 12px 12px 12px;
+	padding: 12px;
 }
 
 .ios #customize-theme-controls .customize-themes-panel h3.customize-section-title:first-child {
-	padding: 12px 12px 13px 12px;
+	padding: 12px 12px 13px;
 }
 
 .customize-section-title h3,
@@ -922,7 +949,8 @@
 .customize-control input[type="number"],
 .customize-control input[type="search"],
 .customize-control input[type="tel"],
-.customize-control input[type="url"] {
+.customize-control input[type="url"],
+.customize-control input[type="range"] {
 	width: 100%;
 	margin: 0;
 }
@@ -962,7 +990,7 @@
 
 .customize-section-description a.external-link:after {
 	font: 16px/11px dashicons;
-	content: "\f310";
+	content: "\f504";
 	top: 3px;
 	position: relative;
 	padding-left: 3px;
@@ -1113,7 +1141,7 @@
  */
 
 #customize-controls .customize-control-notifications-container { /* Scoped to #customize-controls for specificity over notification styles in common.css. */
-	margin: 4px 0 8px 0;
+	margin: 4px 0 8px;
 	padding: 0;
 	cursor: default;
 }
@@ -1126,7 +1154,7 @@
 
 #customize-controls .customize-control-notifications-container li.notice {
 	list-style: none;
-	margin: 0 0 6px 0;
+	margin: 0 0 6px;
 	padding: 9px 14px;
 	overflow: hidden;
 }
@@ -1428,7 +1456,7 @@
 }
 
 .customize-control-header .header-view:last-child {
-	margin-bottom: 0px;
+	margin-bottom: 0;
 }
 
 /* Convoluted, but 'outline' support isn't good enough yet */
@@ -1577,7 +1605,6 @@
 	font-family: Consolas, Monaco, monospace;
 	font-size: 12px;
 	padding: 6px 8px;
-	-moz-tab-size: 2;
 	-o-tab-size: 2;
 	tab-size: 2;
 }
@@ -1664,7 +1691,7 @@
 	border-bottom: 1px solid #dcdcde;
 	border-left: none;
 	border-right: none;
-	margin: 0 0 15px 0;
+	margin: 0 0 15px;
 	padding-right: 100px; /* Space for the button */
 }
 
@@ -1705,6 +1732,12 @@
 	font-weight: 400;
 }
 
+#customize-notifications-area .notification-message button.switch-to-editor {
+	display: block;
+	margin-top: 6px;
+	font-weight: 400;
+}
+
 #customize-theme-controls .control-panel-themes > .accordion-section-title:after {
 	display: none;
 }
@@ -1723,6 +1756,12 @@
 	z-index: 20;
 }
 
+@media (prefers-reduced-motion: reduce) {
+	.control-panel-themes .customize-themes-full-container {
+		transition: none;
+	}
+}
+
 @media screen and (min-width: 1670px) {
 	.control-panel-themes .customize-themes-full-container {
 		width: 82%;
@@ -1860,7 +1899,7 @@
 }
 
 .control-panel-themes .customize-themes-notifications .notice {
-	margin: 0 0 25px 0;
+	margin: 0 0 25px;
 }
 
 .customize-themes-full-container .customize-themes-section {
@@ -1874,7 +1913,7 @@
 
 .control-section .customize-section-text-before {
 	padding: 0 0 8px 15px;
-	margin: 15px 0 0 0;
+	margin: 15px 0 0;
 	line-height: 16px;
 	border-bottom: 1px solid #dcdcde;
 	color: #50575e;
@@ -2095,7 +2134,7 @@
 		position: relative;
 		left: 0;
 		width: 100%;
-		margin: 0 0 25px 0;
+		margin: 0 0 25px;
 	}
 	.filter-drawer {
 		top: 46px;
@@ -2205,7 +2244,7 @@
 		width: 26px;
 		display: block;
 		line-height: 2.3;
-		padding: 0 8px 0 8px;
+		padding: 0 8px;
 		border-right: 1px solid #dcdcde;
 	}
 
@@ -2366,7 +2405,7 @@
 	color: #50575e;
 	font-size: 24px;
 	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
-	margin: 30px 0 0 0;
+	margin: 30px 0 0;
 	padding: 0 0 7px;
 }