Add home screen
This commit is contained in:
parent
b6aa353ea9
commit
73bc27ddc3
4 changed files with 101 additions and 5 deletions
17
src/lib/translations/en-US/home.json
Normal file
17
src/lib/translations/en-US/home.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"main.title": "🧵 Free Online Embroidery File Viewer",
|
||||
"main.description": "<p>✨Upload and preview your embroidery designs instantly – no software needed.</p> <p><strong>Embroidery Viewer</strong> is a free, browser-based tool that supports multiple embroidery file formats. View your designs quickly and securely, right in your browser.</p>",
|
||||
"features.title": "🚀 Features",
|
||||
"features.list": "<ul><li>📂 <strong>Supports Multiple Formats:</strong> DST, PES, JEF, EXP, VP3, and more</li><li>⚡ <strong>Quick Previews:</strong> See your embroidery files rendered as images</li><li>🧷 <strong>Multiple Files at Once:</strong> Upload several designs and view them side-by-side</li><li>🔒 <strong>No Upload to Server:</strong> Your files stay private – all processing happens locally</li><li>⬇️ <strong>Download as Image:</strong> Save each embroidery design preview as a PNG</li><li>💸 <strong>Fast & Free:</strong> No installations, no sign-ups – just open and use</li></ul>",
|
||||
"howtouse.title": "📘 How to Use",
|
||||
"howtouse.list": "<ol><li>📁 <strong>Click</strong> the upload button <em>or</em> <strong>drag and drop</strong> your embroidery files into the drop area</li><li>🧵 Select one or more embroidery files</li><li>▶️ Click the <strong>“Render files”</strong> button to preview your designs</li><li>👀 Instantly view your designs right in your browser – it’s that simple</li></ol>",
|
||||
"testimonials.title": "❤️ Loved by Hobbyists and Professionals",
|
||||
"testimonials.description": "<p>Whether you're a hobbyist working on your next DIY project or a professional digitizer reviewing client files, <strong>Embroidery Viewer</strong> gives you a no-fuss, instant way to visualize your work.</p>",
|
||||
"donation.title": "💖 Help Keep It Free",
|
||||
"donation.description": "<p><strong>Embroidery Viewer is completely free</strong> for everyone to use.</p><p>If you find it useful and want to support ongoing development and hosting costs, please consider making a small donation.</p>",
|
||||
"donation.cta": "🙌 Donate Now",
|
||||
"donation.cta.description": "every little bit helps!",
|
||||
"cta.title": "🚀 Try It Now",
|
||||
"cta.cta": "🧵 Open Viewer",
|
||||
"cta.cta.description": "the fastest <strong>Free Online Embroidery File Viewer</strong>."
|
||||
}
|
||||
|
|
@ -29,6 +29,12 @@ const config = {
|
|||
key: 'footer',
|
||||
loader: async () => (await import('./en-US/footer.json')).default,
|
||||
},
|
||||
{
|
||||
locale: SUPPORTED_LOCALES.EN_US,
|
||||
key: 'home',
|
||||
routes: [''],
|
||||
loader: async () => (await import('./en-US/home.json')).default,
|
||||
},
|
||||
{
|
||||
locale: SUPPORTED_LOCALES.PT_BR,
|
||||
key: 'header',
|
||||
|
|
@ -39,6 +45,12 @@ const config = {
|
|||
key: 'footer',
|
||||
loader: async () => (await import('./pt-BR/footer.json')).default,
|
||||
},
|
||||
{
|
||||
locale: SUPPORTED_LOCALES.PT_BR,
|
||||
key: 'home',
|
||||
routes: [''],
|
||||
loader: async () => (await import('./pt-BR/home.json')).default,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
|
|
|
|||
17
src/lib/translations/pt-BR/home.json
Normal file
17
src/lib/translations/pt-BR/home.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"main.title": "🧵 Visualizador de arquivos de bordado online gratuito",
|
||||
"main.description": "<p>✨Carregue e visualize seus desenhos de bordado instantaneamente – sem necessidade de software</p> <p><strong>Embroidery Viewer</strong> é uma ferramenta gratuita para navegador que suporta diversos formatos de arquivo de bordado. Visualize seus designs de forma rápida e segura, diretamente no seu navegador.</p>",
|
||||
"features.title": "🚀 Funcionalidades",
|
||||
"features.list": "<ul><li>📂 <strong>Suporta vários formatos:</strong> DST, PES, JEF, EXP, VP3 e mais</li><li>⚡ <strong>Visualizações rápidas:</strong> Veja seus arquivos de bordado renderizados como imagens</li><li>🧷 <strong>Vários arquivos de uma só vez:</strong> Carregue vários designs e visualize-os lado a lado</li><li>🔒 <strong>Sem upload para o servidor:</strong> Seus arquivos permanecem privados – todo o processamento acontece localmente</li><li>⬇️ <strong>Baixar como imagem:</strong> Salve cada pré-visualização do desenho do bordado como um PNG</li><li>💸 <strong>Rápido e gratuito:</strong> Sem instalações, sem cadastros – basta abrir e usar</li></ul>",
|
||||
"howtouse.title": "📘 Como usar",
|
||||
"howtouse.list": "<ol><li>📁 <strong>Clique</strong> no botão de upload <em>ou</em> <strong>arraste e solte</strong> seus arquivos de bordado na área de soltar</li><li>🧵 Selecione um ou mais arquivos de bordado</li><li>▶️ Clique no botão <strong>“Renderizar arquivos”</strong> para visualizar seus designs</li><li>👀 Visualize seus designs instantaneamente no seu navegador – é simples assim</li></ol>",
|
||||
"testimonials.title": "❤️ Amado por Hobbyistas e Profissionais",
|
||||
"testimonials.description": "<p>Seja você um amador trabalhando em seu próximo projeto \"faça você mesmo\" ou um digitalizador profissional revisando arquivos de clientes, o <strong>Embroidery Viewer</strong> oferece uma maneira fácil e instantânea de visualizar seu trabalho.</p>",
|
||||
"donation.title": "💖 Ajude a mantê-lo gratuito",
|
||||
"donation.description": "<p><strong>O Embroidery Viewer é totalmente gratuito</strong> para todos usarem.</p><p>Se você o achar útil e quiser apoiar o desenvolvimento contínuo e os custos de hospedagem, considere fazer uma pequena doação.</p>",
|
||||
"donation.cta": "🙌 Doe agora",
|
||||
"donation.cta.description": "cada pequena ajuda é bem-vinda!",
|
||||
"cta.title": "🚀 Experimente agora",
|
||||
"cta.cta": "🧵 Abrir visualizador",
|
||||
"cta.cta.description": "o <strong>visualizador de arquivos de bordado online gratuito</strong> mais rápido."
|
||||
}
|
||||
|
|
@ -1,6 +1,56 @@
|
|||
<h1>Welcome to SvelteKit</h1>
|
||||
<script>
|
||||
import { t } from '$lib/translations';
|
||||
</script>
|
||||
|
||||
<div class="home-container">
|
||||
<section aria-labelledby="main-title">
|
||||
<h1 id="main-title">{$t('home.main.title')}</h1>
|
||||
{@html $t('home.main.description')}
|
||||
</section>
|
||||
|
||||
<section aria-labelledby="features-title">
|
||||
<h2 id="features-title">{$t('home.features.title')}</h2>
|
||||
{@html $t('home.features.list')}
|
||||
</section>
|
||||
|
||||
<section aria-labelledby="how-to-use-title">
|
||||
<h2 id="how-to-use-title">{$t('home.howtouse.title')}</h2>
|
||||
{@html $t('home.howtouse.list')}
|
||||
</section>
|
||||
|
||||
<section aria-labelledby="testimonials-title">
|
||||
<h2 id="testimonials-title">{$t('home.testimonials.title')}</h2>
|
||||
{@html $t('home.testimonials.description')}
|
||||
</section>
|
||||
|
||||
<section aria-labelledby="donation-title">
|
||||
<h2 id="donation-title">{$t('home.donation.title')}</h2>
|
||||
{@html $t('home.donation.description')}
|
||||
<p>
|
||||
Visit<a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the
|
||||
documentation
|
||||
<a href="/donate" class="button">{$t('home.donation.cta')}</a>
|
||||
– {$t('home.donation.cta.description')}
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<!--TODO: add video preview-->
|
||||
<section aria-labelledby="cta-title">
|
||||
<h2 id="cta-title">{$t('home.cta.title')}</h2>
|
||||
<p>
|
||||
<a href="/viewer" class="button">{$t('home.cta.cta')}</a>
|
||||
– {@html $t('home.cta.cta.description')}
|
||||
</p>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.home-container {
|
||||
margin: 0 auto;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.home-container {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue