Merged in fix/icon-color (pull request #1672)

fix: change to correct icon color

* fix: change to correct icon color


Approved-by: Erik Tiekstra
Approved-by: Fredrik Thorsson

apps/scandic-web/components/LanguageSwitcher/index.tsx

@@ -6,6 +6,7 @@ import FocusLock from "react-focus-lock"
 import { useIntl } from "react-intl"
 
 import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { languages } from "@/constants/languages"
 import { trpc } from "@/lib/trpc/client"
@@ -16,7 +17,6 @@ import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
 import useLang from "@/hooks/useLang"
 
 import SkeletonShimmer from "../SkeletonShimmer"
-import Caption from "../TempDesignSystem/Text/Caption"
 import LanguageSwitcherContainer from "./LanguageSwitcherContainer"
 import LanguageSwitcherContent from "./LanguageSwitcherContent"
 import { languageSwitcherVariants } from "./variants"
@@ -106,14 +106,18 @@ export default function LanguageSwitcher({ type }: LanguageSwitcherProps) {
         aria-label={isLanguageSwitcherOpen ? closeMsg : openMsg}
         onClick={handleClick}
       >
-        <MaterialIcon icon="globe" size={globeIconSize} />
-        <Caption className={styles.buttonText} type="regular" asChild>
+        <MaterialIcon icon="globe" size={globeIconSize} color="CurrentColor" />
+        <Typography
+          variant="Body/Supporting text (caption)/smRegular"
+          className={styles.buttonText}
+        >
           <span>{languages[currentLanguage]}</span>
-        </Caption>
+        </Typography>
         <MaterialIcon
           icon="keyboard_arrow_down"
           className={`${styles.chevron} ${isLanguageSwitcherOpen ? styles.isExpanded : ""}`}
           size={20}
+          color="CurrentColor"
         />
       </button>