Fix lighten deprecations

Automattic · Oct 30, 2024 · ccfa9a5 · ccfa9a5
1 parent 21c0b6f
commit ccfa9a5
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 16 deletions.
diff --git a/assets/css/course-editor.scss b/assets/css/course-editor.scss
@@ -66,8 +66,8 @@ $secondary: #0693e3;
 
 				&:hover,
 				&:active {
-					background-color: lighten($primary, 5%);
-					border-color: lighten($primary, 5%);
+					background-color: adjust-color($primary, $lightness: 5%);
+					border-color: adjust-color($primary, $lightness: 5%);
 					text-decoration: none;
 				}
 

diff --git a/assets/css/frontend.scss b/assets/css/frontend.scss
@@ -101,7 +101,7 @@ a.sensei-certificate-link {
 
 	.course-author,
 	.sensei-course-meta {
-		color: lighten($color_body, 20%);
+		color: adjust-color($color_body, $lightness: 20%);
 		font-size: .9em;
 
 		a {
@@ -150,7 +150,7 @@ a.sensei-certificate-link {
 			p.lesson-meta {
 				font-style: italic;
 				font-size: .9em;
-				color: lighten($color_body, 20%);
+				color: adjust-color($color_body, $lightness: 20%);
 
 				a {
 					color: #555;
@@ -274,7 +274,7 @@ a.sensei-certificate-link {
 	margin: 2em 0;
 	padding: 0.5em 1em;
 	font-style: italic;
-	color: lighten($color_body, 20%);
+	color: adjust-color($color_body, $lightness: 20%);
 	clear: both;
 
 	&:before {
@@ -286,7 +286,7 @@ a.sensei-certificate-link {
 .lesson-tags {
 	margin: 2em 0;
 	font-style: italic;
-	color: lighten($color_body, 20%);
+	color: adjust-color($color_body, $lightness: 20%);
 	font-size: .9em;
 }
 

diff --git a/assets/css/notices.scss b/assets/css/notices.scss
@@ -77,7 +77,7 @@
 	}
 
 	&.success {
-		background: lighten( $success, 35% );
+		background: adjust-color( $success, $lightness: 35% );
 
 		&:before {
 			color: $success;

diff --git a/assets/setup-wizard/features/style.scss b/assets/setup-wizard/features/style.scss
@@ -30,9 +30,9 @@ $bar-color: #217D7C;
 		background-color: $bar-color;
 		background-image: linear-gradient(
 			135deg,
-			lighten($bar-color, 5%) 25%, $bar-color 25%,
-			$bar-color 50%, lighten($bar-color, 5%) 50%,
-			lighten($bar-color, 5%) 75%, $bar-color 75%
+			adjust-color($bar-color, $lightness: 5%) 25%, $bar-color 25%,
+			$bar-color 50%, adjust-color($bar-color, $lightness: 5%) 50%,
+			adjust-color($bar-color, $lightness: 5%) 75%, $bar-color 75%
 		);
 		background-size: 50px 50px;
 		height: 100%;

diff --git a/assets/shared/styles/wp-admin.scss b/assets/shared/styles/wp-admin.scss
@@ -9,8 +9,8 @@
 
 	&:hover,
 	&:active {
-		color: lighten($primary, 5%);
-		border-color: lighten($primary, 5%);
+		color: adjust-color($primary, $lightness: 5%);
+		border-color: adjust-color($primary, $lightness: 5%);
 	}
 
 	&:focus {
@@ -26,8 +26,8 @@
 
 	&:hover,
 	&:active {
-		background-color: lighten($primary, 5%);
-		border-color: lighten($primary, 5%);
+		background-color: adjust-color($primary, $lightness: 5%);
+		border-color: adjust-color($primary, $lightness: 5%);
 	}
 
 	&:focus {

diff --git a/assets/shared/styles/wp-components.scss b/assets/shared/styles/wp-components.scss
@@ -40,7 +40,7 @@ body.sensei-color {
 
 			&:hover,
 			&:active {
-				color: lighten($link, 20%);
+				color: adjust-color($link, $lightness: 20%);
 			}
 
 			&:not(.components-button):focus {
@@ -54,7 +54,7 @@ body.sensei-color {
 
 			&:hover,
 			&:active {
-				color: lighten($link-primary, 20%);
+				color: adjust-color($link-primary, $lightness: 20%);
 			}
 
 			&:focus {