fix(vwc-media-controller): stylelint formatting duplication of select…

…or (#669) * fix(vwc-media-controller): stylelint formatting duplication of selector * restore border radius
Vonage · Feb 21, 2021 · 343d62b · 343d62b
1 parent a7a4c4f
commit 343d62b
Showing 1 changed file with 4 additions and 24 deletions.
diff --git a/components/media-controller/src/vwc-media-controller.scss b/components/media-controller/src/vwc-media-controller.scss
@@ -40,29 +40,6 @@
 			margin-left: 1rem;
 			cursor: pointer;
 			user-select: none;
-			@media screen and (prefers-reduced-motion: reduce) {
-				> button {
-					position: absolute;
-					top: 50%;
-					left: 0;
-					width: $scrub-size;
-					height: $scrub-size;
-					padding: 0;
-					border: 0 none;
-					background-color: $basic;
-					border-radius: $scrub-size/2;
-					box-shadow: 0 0 0 0 #0000;
-					cursor: pointer;
-					-webkit-tap-highlight-color: transparent;
-					transform: translate(-50%, -50%);
-					transform-origin: center;
-					transition: none;
-
-					&:focus {
-						outline: none;
-					}
-				}
-			}
 
 			> button {
 				position: absolute;
@@ -73,12 +50,15 @@
 				padding: 0;
 				border: 0 none;
 				background-color: $basic;
+				border-radius: $scrub-size/2;
 				box-shadow: 0 0 0 0 #0000;
 				cursor: pointer;
 				-webkit-tap-highlight-color: transparent;
 				transform: translate(-50%, -50%);
 				transform-origin: center;
-				transition: background-color 0.2s, box-shadow 200ms, border-radius 0.2s;
+				@media screen and (prefers-reduced-motion: reduce) {
+					transition: background-color 0.2s, box-shadow 200ms, border-radius 0.2s;
+				}
 
 				&:focus {
 					outline: none;