TD-6277 Shade and Tint

Phil-NHS · Phil-NHS · commit 041eb2d46656 · 2025-09-25T15:22:59.000+01:00
diff --git a/DigitalLearningSolutions.Web/Styles/learningPortal/current.scss b/DigitalLearningSolutions.Web/Styles/learningPortal/current.scss
@@ -15,20 +15,20 @@
 
 a.delete-button {
   background-color: nhsuk-colour("red");
-  box-shadow: 0 4px 0 shade(nhsuk-colour("red"), 50%);
+  box-shadow: 0 4px 0 nhsuk-shade(nhsuk-colour("red"), 50%);
   margin-bottom: 16px !important;
 
   &:hover {
-    background-color: shade(nhsuk-colour("red"), 20%);
+    background-color: nhsuk-shade(nhsuk-colour("red"), 20%);
   }
 
   &:active {
-    background-color: shade(nhsuk-colour("red"), 50%);
+    background-color: nhsuk-shade(nhsuk-colour("red"), 50%);
   }
 }
 
 .overdue {
-  background-color: tint(nhsuk-colour("red"), 80);
+  background-color: nhsuk-tint(nhsuk-colour("red"), 80);
 }
 
 .due-soon {
diff --git a/DigitalLearningSolutions.Web/Styles/trackingSystem/courseSetup.scss b/DigitalLearningSolutions.Web/Styles/trackingSystem/courseSetup.scss
@@ -8,7 +8,7 @@
 }
 
 .status-inactive {
-  border-left: 6px solid tint(nhsuk-colour("red"), 80);
+  border-left: 6px solid nhsuk-tint(nhsuk-colour("red"), 80);
 }
 
 .status-archived {
diff --git a/DigitalLearningSolutions.Web/Styles/trackingSystem/viewDelegate.scss b/DigitalLearningSolutions.Web/Styles/trackingSystem/viewDelegate.scss
@@ -53,7 +53,7 @@
 
   &.inactive {
     background-color: #fff;
-    border-left: 6px solid tint(nhsuk-colour("red"), 80);
+    border-left: 6px solid nhsuk-tint(nhsuk-colour("red"), 80);
   }
 
   &.archived {
@@ -63,7 +63,7 @@
 }
 
 .status-inactive {
-  border-left: 6px solid tint(nhsuk-colour("red"), 80);
+  border-left: 6px solid nhsuk-tint(nhsuk-colour("red"), 80);
 }
 
 .status-archived {

Original file line number	Diff line number	Diff line change
`@@ -15,20 +15,20 @@`
`15`	`15`
`16`	`16`	`a.delete-button {`
`17`	`17`	`background-color: nhsuk-colour("red");`
`18`		`- box-shadow: 0 4px 0 shade(nhsuk-colour("red"), 50%);`
	`18`	`+ box-shadow: 0 4px 0 nhsuk-shade(nhsuk-colour("red"), 50%);`
`19`	`19`	`margin-bottom: 16px !important;`
`20`	`20`
`21`	`21`	`&:hover {`
`22`		`- background-color: shade(nhsuk-colour("red"), 20%);`
	`22`	`+ background-color: nhsuk-shade(nhsuk-colour("red"), 20%);`
`23`	`23`	`}`
`24`	`24`
`25`	`25`	`&:active {`
`26`		`- background-color: shade(nhsuk-colour("red"), 50%);`
	`26`	`+ background-color: nhsuk-shade(nhsuk-colour("red"), 50%);`
`27`	`27`	`}`
`28`	`28`	`}`
`29`	`29`
`30`	`30`	`.overdue {`
`31`		`- background-color: tint(nhsuk-colour("red"), 80);`
	`31`	`+ background-color: nhsuk-tint(nhsuk-colour("red"), 80);`
`32`	`32`	`}`
`33`	`33`
`34`	`34`	`.due-soon {`
Original file line number	Diff line number	Diff line change
`@@ -8,7 +8,7 @@`
`8`	`8`	`}`
`9`	`9`
`10`	`10`	`.status-inactive {`
`11`		`- border-left: 6px solid tint(nhsuk-colour("red"), 80);`
	`11`	`+ border-left: 6px solid nhsuk-tint(nhsuk-colour("red"), 80);`
`12`	`12`	`}`
`13`	`13`
`14`	`14`	`.status-archived {`
Original file line number	Diff line number	Diff line change
`@@ -53,7 +53,7 @@`
`53`	`53`
`54`	`54`	`&.inactive {`
`55`	`55`	`background-color: #fff;`
`56`		`- border-left: 6px solid tint(nhsuk-colour("red"), 80);`
	`56`	`+ border-left: 6px solid nhsuk-tint(nhsuk-colour("red"), 80);`
`57`	`57`	`}`
`58`	`58`
`59`	`59`	`&.archived {`
`@@ -63,7 +63,7 @@`
`63`	`63`	`}`
`64`	`64`
`65`	`65`	`.status-inactive {`
`66`		`- border-left: 6px solid tint(nhsuk-colour("red"), 80);`
	`66`	`+ border-left: 6px solid nhsuk-tint(nhsuk-colour("red"), 80);`
`67`	`67`	`}`
`68`	`68`
`69`	`69`	`.status-archived {`