style: custom chevron on language selector for consistent spacing

Author: alejandroSuch

src/components/Header.tsx

@@ -39,7 +39,7 @@ export default function Header({ dark, toggleDark }: Props) {
             value={i18n.language.substring(0, 2)}
             onChange={(e) => i18n.changeLanguage(e.target.value)}
             aria-label={t('language')}
-            className="rounded-md border border-gray-300 bg-white pl-2 pr-7 py-1 text-xs text-gray-700 focus:border-amber-500 focus:outline-none focus:ring-1 focus:ring-amber-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-300"
+            className="appearance-none rounded-md border border-gray-300 bg-white bg-[url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22%236b7280%22%3E%3Cpath%20fill-rule%3D%22evenodd%22%20d%3D%22M5.23%207.21a.75.75%200%20011.06.02L10%2011.168l3.71-3.938a.75.75%200%20111.08%201.04l-4.25%204.5a.75.75%200%2001-1.08%200l-4.25-4.5a.75.75%200%2001.02-1.06z%22%20clip-rule%3D%22evenodd%22/%3E%3C/svg%3E')] bg-[length:1.25rem_1.25rem] bg-[right_0.35rem_center] bg-no-repeat pl-2 pr-7 py-1 text-xs text-gray-700 focus:border-amber-500 focus:outline-none focus:ring-1 focus:ring-amber-500 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-300"
           >
             {LANGUAGES.map((l) => (
               <option key={l.code} value={l.code}>{l.label}</option>