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,6 +121,7 @@ export function SettingsGeneral() {
         }
       />
 
+      <div style={{width: "22%"}}>
         <SelectField
           label={t("language")}
           value={form.language}
@@ -131,6 +132,8 @@ export function SettingsGeneral() {
             label: language.nativeName,
           }))}
         />
+      </div>
+      
 
       <h3>{t("notifications")}</h3>
       <>