Merge remote-tracking branch 'origin/main'

HyperPlay-Gaming · Jan 9, 2025 · 83b4e96 · 83b4e96
2 parents 47d253d + 009d09e
commit 83b4e96
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 6 deletions.
diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
@@ -829,6 +829,7 @@
             }
         },
         "quests": "Quests",
+        "search": "Search",
         "viewAllQuests": {
             "title": "View All Quests"
         }

diff --git a/src/frontend/screens/Quests/index.module.scss b/src/frontend/screens/Quests/index.module.scss
@@ -34,20 +34,34 @@
 }
 
 .detailsWrapper {
-  width: 800px;
+  width: 650px;
   max-width: unset !important;
 
   background-color: var(--color-neutral-800);
   border: none;
 
-  @media (max-width: 1300px) {
-    width: 540px;
+  //Steam Deck
+  @media (max-width: 1280px) {
+    width: 600px;
+  }
+
+  @media (max-width: 1024px) {
+    width: 390px;
   }
 }
 
 .tableContainer {
   background-color: var(--color-neutral-800);
   overflow-y: hidden;
+
+  //Steam DecK
+  @media (max-width: 1280px) {
+    width: 510px;
+  }
+
+  @media (max-width: 1024px) {
+    width: 480px;
+  }
 }
 
 .questSelectedLayout {
@@ -56,10 +70,18 @@
   }
 }
 
+.searchBar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin: var(--space-2xs);
+  font-size: var(--text-3xs);
+  padding-right: var(--space-2xs);
+}
+
 .loadingContainer {
   padding: var(--space-2lg);
   height: 100%;
-
   display: flex;
   justify-content: center;
   align-items: center;

diff --git a/src/frontend/screens/Quests/index.tsx b/src/frontend/screens/Quests/index.tsx
@@ -223,8 +223,8 @@ export function QuestsPage() {
             <SearchBar
               searchText={searchText}
               setSearchText={setSearchText}
-              i18n={{ placeholder: 'Search Quest' }}
-              styles={{ container: { margin: '0px 0px 0px auto' } }}
+              i18n={{ placeholder: t('quests.search', 'Search') }}
+              classNames={{ container: styles.searchBar }}
               suggestions={suggestedSearchTitles}
             />
           }