styles fixed + translations

src/locales/pt/translation.json

@@ -22,7 +22,7 @@
     "game_has_no_executable": "Jogo não possui executável selecionado",
     "sign_in": "Login",
     "sort_by": "Ordenar por",
-    "latest_added": "Adicionado mais recente",
+    "latest_added": "Adicionado recente",
     "alphabetically": "Alfabeticamente",
     "last_launched": "Último jogado",
     "number_of_hours": "Qtd. de horas jogadas",

src/renderer/src/components/select-field/select-field.css.ts

@@ -7,7 +7,7 @@ export const select = recipe({
   base: {
     display: "inline-flex",
     transition: "all ease 0.2s",
-    width: "fit-content",
+    width: "100%",
     alignItems: "center",
     borderRadius: "8px",
     border: `1px solid ${vars.color.border}`,

src/renderer/src/components/select-field/select-field.tsx

@@ -34,6 +34,7 @@ export function SelectField({
         <select
           id={id}
           value={value}
+          style={{width: "100%"}}
           className={styles.option}
           onFocus={() => setIsFocused(true)}
           onBlur={() => setIsFocused(false)}

src/renderer/src/components/sidebar/sidebar.tsx

@@ -51,7 +51,6 @@ export function Sidebar() {
   const location = useLocation();
 
   const sortedLibrary = useMemo(() => {
-    console.log(library);
     switch (sortParam) {
       case "latest_added":
         return sortBy(library, (game) => game.createdAt);
@@ -226,6 +225,8 @@ export function Sidebar() {
           <section className={styles.section}>
             <small className={styles.sectionTitle}>{t("my_library")}</small>
 
+
+      <div style={{width: "102%"}}>
             <SelectField
               label={t("sort_by")}
               value={sortParam}
@@ -236,7 +237,7 @@ export function Sidebar() {
                 label: t(option),
               }))}
             />
-
+      </div>
             <TextField
               placeholder={t("filter")}
               onChange={handleFilter}

src/renderer/src/pages/settings/settings-general.tsx

@@ -121,16 +121,19 @@ export function SettingsGeneral() {
         }
       />
 
-      <SelectField
-        label={t("language")}
-        value={form.language}
-        onChange={handleLanguageChange}
-        options={languageOptions.map((language) => ({
-          key: language.option,
-          value: language.option,
-          label: language.nativeName,
-        }))}
-      />
+      <div style={{width: "22%"}}>
+        <SelectField
+          label={t("language")}
+          value={form.language}
+          onChange={handleLanguageChange}
+          options={languageOptions.map((language) => ({
+            key: language.option,
+            value: language.option,
+            label: language.nativeName,
+          }))}
+        />
+      </div>
+      
 
       <h3>{t("notifications")}</h3>
       <>