diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json index 2b7b0d9e5..f2afb44bd 100644 --- 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 index 9eff7db33..f9e83d063 100644 --- 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 index ac6a618e6..32496b61d 100644 --- a/src/frontend/screens/Quests/index.tsx +++ b/src/frontend/screens/Quests/index.tsx @@ -223,8 +223,8 @@ export function QuestsPage() { }