i18n: Stylize LanguageSelector

Author: danielhjacobs

src/app/translate.tsx

@@ -2,6 +2,7 @@
 
 import React, { useEffect, useState, useCallback } from "react";
 import defaultTranslations from "@/i18n/translations.en.json";
+import classes from "@/components/header.module.css";
 
 const languages = {
   en: "English (United States)",
@@ -205,7 +206,7 @@ export const LanguageSelector: React.FC<LanguageSelectorProps> = ({
 
   return (
     <select
-      className={className}
+      className={`${classes.languageSelector} ${className || ""}`}
       value={selectedLang}
       onChange={handleLanguageChange}
     >

src/components/header.module.css

@@ -55,3 +55,10 @@
 .overlay {
   top: rem(56px);
 }
+
+.languageSelector {
+  color: var(--ruffle-orange);
+  background: var(--ruffle-blue);
+  border: 1px solid var(--ruffle-orange);
+  padding: 4px;
+}