feat(overlay-token): updated colour values (#20883)

Co-authored-by: Heloise Lui <71858203+heloiselui@users.noreply.github.com>

Author: maradwan26

packages/themes/src/g10.js

@@ -205,7 +205,7 @@ export const skeletonElement = gray30;
 // Misc
 export const interactive = blue60;
 export const highlight = blue20;
-export const overlay = 'rgba(22, 22, 22, 0.5)';
+export const overlay = rgba(black, 0.6);
 export const toggleOff = gray50;
 export const shadow = 'rgba(0, 0, 0, 0.3)';
 

packages/themes/src/g100.js

@@ -208,7 +208,7 @@ export const skeletonElement = gray80;
 // Misc
 export const interactive = blue50;
 export const highlight = blue90;
-export const overlay = rgba(black, 0.65);
+export const overlay = rgba(black, 0.6);
 export const toggleOff = gray60;
 export const shadow = rgba(black, 0.8);
 

packages/themes/src/g90.js

@@ -209,7 +209,7 @@ export const skeletonElement = gray70;
 // Misc
 export const interactive = blue50;
 export const highlight = blue80;
-export const overlay = rgba(black, 0.65);
+export const overlay = rgba(black, 0.6);
 export const toggleOff = gray50;
 export const shadow = rgba(black, 0.8);
 

packages/themes/src/white.js

@@ -205,7 +205,7 @@ export const skeletonElement = gray30;
 // Misc
 export const interactive = blue60;
 export const highlight = blue20;
-export const overlay = 'rgba(22, 22, 22, 0.5)';
+export const overlay = rgba(black, 0.6);
 export const toggleOff = gray50;
 export const shadow = 'rgba(0, 0, 0, 0.3)';