diff --git a/resources/common/components/MenuDropdown.less b/resources/common/components/MenuDropdown.less
index e98e328dc..febc59ff0 100644
--- a/resources/common/components/MenuDropdown.less
+++ b/resources/common/components/MenuDropdown.less
@@ -56,7 +56,8 @@
 		text-align: left;
 		opacity: 0;
 		visibility: hidden;
-		.transition( opacity 100ms );
+		transition-property: opacity;
+		transition-duration: 100ms;
 		z-index: @z-index-menu;
 	}
 
diff --git a/resources/common/components/SearchBox.less b/resources/common/components/SearchBox.less
index 03711b3b8..3ccdb1b10 100644
--- a/resources/common/components/SearchBox.less
+++ b/resources/common/components/SearchBox.less
@@ -28,7 +28,8 @@
 	font-family: inherit;
 	font-size: @font-size-search-input;
 	direction: ltr;
-	.transition( ~'border-color 250ms, box-shadow 250ms' );
+	transition-property: border-color, box-shadow;
+	transition-duration: 250ms;
 
 	// Undo the proprietary styles, we provide our own.
 	// Support: Safari/iOS `none` needed, Chrome would accept `textfield` as well. See T247299.
diff --git a/resources/skins.vector.js/skin.js b/resources/skins.vector.js/skin.js
index 38b7898e7..5442f136b 100644
--- a/resources/skins.vector.js/skin.js
+++ b/resources/skins.vector.js/skin.js
@@ -22,9 +22,9 @@ var languageButton = require( './languageButton.js' ),
  * }
  *
  * // This transition will be disabled initially for JavaScript users. It will never be enabled for
- * // no-JS users.
+ * // non-JavaScript users.
  * .vector-animations-ready .foo {
- *     .transition( transform 100ms ease-out; );
+ *     transition: transform 100ms ease-out;
  * }
  * ```
  *
diff --git a/resources/skins.vector.styles/components/Sidebar.less b/resources/skins.vector.styles/components/Sidebar.less
index aeef8e4b1..cd24c359b 100644
--- a/resources/skins.vector.styles/components/Sidebar.less
+++ b/resources/skins.vector.styles/components/Sidebar.less
@@ -165,8 +165,9 @@
 .vector-animations-ready {
 	// Enable transition on all widths by default.
 	.mw-sidebar {
-		@timing: @transition-duration-base ease-out;
-		.transition( transform @timing, opacity @timing, visibility @timing; );
+		transition-property: transform, opacity, visibility;
+		transition-duration: @transition-duration-base;
+		transition-timing-function: ease-out;
 	}
 
 	@media ( max-width: @width-breakpoint-tablet ) {
@@ -177,10 +178,7 @@
 
 	// Enable sidebar button transitions.
 	#mw-sidebar-button {
-		.transition(
-			background-color @transition-duration-base,
-			border-color @transition-duration-base,
-			box-shadow @transition-duration-base;
-		);
+		transition-property: background-color, border-color, box-shadow;
+		transition-duration: @transition-duration-base;
 	}
 }
diff --git a/resources/skins.vector.styles/components/VueEnhancedSearchBox.less b/resources/skins.vector.styles/components/VueEnhancedSearchBox.less
index 8a512e1a9..6f6b9813b 100644
--- a/resources/skins.vector.styles/components/VueEnhancedSearchBox.less
+++ b/resources/skins.vector.styles/components/VueEnhancedSearchBox.less
@@ -86,7 +86,7 @@
 	// Reset WVUI. Prevents the input border from animating
 	// when it gets inserted into the DOM while being focused.
 	.wvui-input__input:not( [ disabled ] ) {
-		.transition( none );
+		transition: none;
 	}
 
 	&.vector-search-box-show-thumbnail {
diff --git a/resources/skins.vector.styles/components/checkboxHack.less b/resources/skins.vector.styles/components/checkboxHack.less
index b77f8d362..82cc19861 100644
--- a/resources/skins.vector.styles/components/checkboxHack.less
+++ b/resources/skins.vector.styles/components/checkboxHack.less
@@ -18,8 +18,9 @@
 //             // of this can be replaced with `display: none` instead to avoid hidden rendering.
 //             visibility: hidden;
 //             opacity: 0;
-//             @timing: @transition-duration-base ease-in-out;
-//             .transition( transform @timing, opacity @timing, visibility @timing; );
+//             transition-property: transform, opacity, visibility;
+//             transition-duration: @transition-duration-base;
+//             transition-timing-function: ease-in-out;
 //             .transform( translateX( -100% ) );
 //     }
 //
diff --git a/resources/skins.vector.styles/layouts/screen.less b/resources/skins.vector.styles/layouts/screen.less
index dc64f5dfc..3f43a2c8a 100644
--- a/resources/skins.vector.styles/layouts/screen.less
+++ b/resources/skins.vector.styles/layouts/screen.less
@@ -333,7 +333,7 @@ body {
 	// Specificity needed to disable the default animations at lower resolutions.
 	.vector-animations-ready .mw-sidebar {
 		// Remove sidebar transition at smaller widths.
-		.transition( none );
+		transition: none;
 	}
 }