diff --git a/apps/frontend/src/assets/warpengine-client.png b/apps/frontend/src/assets/warpengine-client.png new file mode 100644 index 0000000..1e0fda7 Binary files /dev/null and b/apps/frontend/src/assets/warpengine-client.png differ diff --git a/apps/frontend/src/i18n/locales/en.ts b/apps/frontend/src/i18n/locales/en.ts index 2bd9e90..27b1004 100644 --- a/apps/frontend/src/i18n/locales/en.ts +++ b/apps/frontend/src/i18n/locales/en.ts @@ -205,6 +205,7 @@ export default { clientTitle: 'Get WarpEngine Store', clientDesc: 'A small desktop application: the catalog as a grid of cards, one click to install a game into your own application menu, one to play it, one to remove it. Nothing to set up first — it downloads the store itself on first run — and on Windows it is the way in, because `curl … | sh` does not exist there.', clientPlatforms: 'Linux, macOS and Windows', + clientShotAlt: 'The WarpEngine Store window: the store picker and category filters on the left, and the catalog as a grid of game cards with install and play buttons.', clientPointSetup: 'Sets the store up itself on first run — nothing to install beforehand.', clientPointBrowse: 'Filter by platform, by what is installed, or by what has an update.', clientPointSame: 'The same store underneath, so the command line keeps working on the same games.', diff --git a/apps/frontend/src/i18n/locales/hu.ts b/apps/frontend/src/i18n/locales/hu.ts index 047951c..327196f 100644 --- a/apps/frontend/src/i18n/locales/hu.ts +++ b/apps/frontend/src/i18n/locales/hu.ts @@ -205,6 +205,7 @@ export default { clientTitle: 'Töltsd le a WarpEngine Store-t', clientDesc: 'Egy kis asztali alkalmazás: a katalógus kártyákban, egy kattintás a telepítés a saját alkalmazásmenüdbe, egy az indítás, egy az eltávolítás. Előre semmit nem kell beállítani — első indításkor magát a store-t is letölti —, Windowson pedig ez az út, mert ott a `curl … | sh` nem létezik.', clientPlatforms: 'Linux, macOS és Windows', + clientShotAlt: 'A WarpEngine Store ablaka: balra a store-választó és a kategóriaszűrők, jobbra a katalógus játékkártyákban, telepítés és indítás gombokkal.', clientPointSetup: 'Első indításkor magát a store-t is beállítja — előre semmit nem kell telepíteni.', clientPointBrowse: 'Szűrhetsz platformra, a telepítettekre vagy arra, amihez frissítés van.', clientPointSame: 'Alatta ugyanaz a store, tehát a parancssor ugyanazokon a játékokon dolgozik tovább.', diff --git a/apps/frontend/src/page/stores/StoresIndexPage.vue b/apps/frontend/src/page/stores/StoresIndexPage.vue index f398328..405e4e3 100644 --- a/apps/frontend/src/page/stores/StoresIndexPage.vue +++ b/apps/frontend/src/page/stores/StoresIndexPage.vue @@ -19,28 +19,39 @@
{{ t('stores.clientDesc') }}
-{{ t('stores.clientDesc') }}
++ + {{ t('stores.clientPlatforms') }} +
+- - {{ t('stores.clientPlatforms') }} -
{{ t('stores.clientNote') }}
@@ -149,6 +160,7 @@ import { RouterLink, useRoute, useRouter } from 'vue-router' import { useI18n } from 'vue-i18n' import { CONFIG } from '../../lib/config' import CommandBlock from './CommandBlock.vue' +import clientScreenshot from '../../assets/warpengine-client.png' const { t } = useI18n() const route = useRoute() @@ -328,6 +340,15 @@ const engines = [ .st-app-platforms { @apply flex items-center gap-2 text-sm text-gray-500 mt-4; } +.st-app-grid { + @apply grid gap-6 items-start lg:grid-cols-2; +} +.st-app-shot { + @apply rounded-xl overflow-hidden border border-emerald-200/70 shadow-lg bg-gray-900; +} +.st-app-shot img { + @apply block w-full h-auto; +} .st-link-cta { @apply bg-emerald-600 text-white hover:bg-emerald-700 text-base px-5 py-2.5 font-semibold; }