fix: ses-2495 message request banner icon colour incorrect when in light mode

ts/components/leftpane/MessageRequestsBanner.tsx

@@ -63,6 +63,11 @@ const StyledGridContainer = styled.div`
   align-items: center;
   border-radius: 50%;
   background-color: var(--primary-color);
+  color: var(--renderer-span-primary-color);
+
+  svg > path {
+    fill: var(--message-request-icon-color);
+  }
 `;
 
 export const CircularIcon = (props: {

ts/themes/classicDark.ts

@@ -169,4 +169,5 @@ export const classicDark: ThemeColorVariables = {
   '--session-recording-pulse-color': hexColorToRGB(THEMES.CLASSIC_DARK.DANGER),
 
   '--renderer-span-primary-color': 'var(--primary-color)',
+  '--message-request-icon-color': 'var(--background-primary-color)',
 };

ts/themes/classicLight.ts

@@ -169,4 +169,5 @@ export const classicLight: ThemeColorVariables = {
   '--session-recording-pulse-color': hexColorToRGB(THEMES.CLASSIC_LIGHT.DANGER),
 
   '--renderer-span-primary-color': 'var(--text-primary-color)',
+  '--message-request-icon-color': 'var(--text-primary-color)',
 };

ts/themes/oceanDark.ts

@@ -169,4 +169,5 @@ export const oceanDark: ThemeColorVariables = {
   '--session-recording-pulse-color': hexColorToRGB(THEMES.OCEAN_DARK.DANGER),
 
   '--renderer-span-primary-color': 'var(--primary-color)',
+  '--message-request-icon-color': 'var(--background-primary-color)',
 };

ts/themes/oceanLight.ts

@@ -169,4 +169,5 @@ export const oceanLight: ThemeColorVariables = {
   '--session-recording-pulse-color': hexColorToRGB(THEMES.OCEAN_LIGHT.DANGER),
 
   '--renderer-span-primary-color': 'var(--text-primary-color)',
+  '--message-request-icon-color': 'var(--text-primary-color)',
 };

ts/themes/variableColors.tsx

@@ -28,6 +28,9 @@ export type ThemeColorVariables = {
   '--message-bubbles-sent-text-color': string;
   '--message-bubbles-received-text-color': string;
 
+  /* Message Request Banner */
+  '--message-request-icon-color': string;
+
   /* Menu Button */
   '--menu-button-background-color': string;
   '--menu-button-background-hover-color': string;