Redesign whole website #16

Merged
leomurca merged 18 commits from development into main 2025-04-12 18:04:08 +00:00
7 changed files with 122 additions and 12 deletions
Showing only changes of commit cce7ac2f23 - Show all commits

View file

@ -1 +0,0 @@
google.com, pub-5761689301112420, DIRECT, f08c47fec0942fa0

View file

@ -60,3 +60,15 @@ body a:hover {
background-color: #06345F;
color: #ffffff;
}
:is(h1, h2, h3, h4, h5, h6) {
color: #06345F;
}
strong {
color: #06345F;
}
ul li::marker {
color: #06345F;
}

View file

@ -5,10 +5,26 @@ export default {
"head.keywords": "free embroidery file viewer, open PES files online, view DST files, embroidery file preview, EXP file viewer, multiple embroidery files",
"head.ogtitle": "Free Online Embroidery File Viewer Open PES, DST & More",
"head.ogdescription": "Upload and preview multiple embroidery files like PES, DST, and EXP online for free. No software needed!",
"nav.home": "Home",
"nav.donate": "Donate",
"nav.about": "About",
"nav.home": "🏠 Home",
"nav.viewer": "🧵 Viewer",
"nav.donate": "💖 Donate",
"nav.about": " About",
"main.title": "Upload files",
"home.main.title": "🧵 Free Online Embroidery File Viewer",
"home.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>",
"home.features.title": "🚀 Features",
"home.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>",
"home.howtouse.title": "📘 How to Use",
"home.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 its that simple</li></ol>",
"home.testimonials.title": "❤️ Loved by Hobbyists and Professionals",
"home.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>",
"home.donation.title": "💖 Help Keep It Free",
"home.donation.description": "<p><strong>Embroidery Viewer is completely free</strong> for everyone to use, with no ads.</p><p>If you find it useful and want to support ongoing development and hosting costs, please consider making a small donation.</p>",
"home.donation.cta": "🙌 Donate Now",
"home.donation.cta.description": "every little bit helps!",
"home.cta.title": "🚀 Try It Now",
"home.cta.cta": "🧵 Open Viewer",
"home.cta.cta.description": "the fastest <strong>Free Online Embroidery File Viewer</strong>.",
"main.languageSwitch": "🇧🇷",
"main.fileSize": "Max file size is <strong>{{fileSize}}kb</strong>.",
"main.supportedFormats": "Accepted formats: <strong>{{supportedFormats}}</strong>.",
@ -20,7 +36,7 @@ export default {
"main.dimensions": "Dimensions (x, y)",
"main.download": "Download image",
"main.copyright": "Copyright © {{year}} <a href=\"{{website}}\" target=\"_blank\" rel=\"noreferrer\">Leonardo Murça</a>. <br/> All rights reserved.",
"main.version": "Version: {{version}}"
"main.version": "🧵 Version: {{version}}"
},
pt: {
"head.title": "Visualizador de arquivos de bordado online gratuito Abra PES, DST, EXP e mais",
@ -28,9 +44,25 @@ export default {
"head.keywords": "visualizador de arquivos de bordado grátis, abra arquivos PES online, visualize arquivos DST, pré-visualização de arquivos de bordado, visualizador de arquivos EXP, vários arquivos de bordado",
"head.ogtitle": "Visualizador de arquivos de bordado online gratuito Abra PES, DST e mais",
"head.ogdescription": "Carregue e visualize vários arquivos de bordado como PES, DST e EXP online gratuitamente. Não precisa de software!",
"nav.home": "Página Inicial",
"nav.donate": "Doe",
"nav.about": "Sobre",
"nav.home": "🏠 Página Inicial",
"nav.viewer": "🧵 Visualizador",
"nav.donate": "💖 Doe",
"nav.about": " Sobre",
"home.main.title": "🧵 Visualizador de arquivos de bordado online gratuito",
"home.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>",
"home.features.title": "🚀 Funcionalidades",
"home.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>",
"home.howtouse.title": "📘 Como usar",
"home.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>",
"home.testimonials.title": "❤️ Amado por Hobbyistas e Profissionais",
"home.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>",
"home.donation.title": "💖 Ajude a mantê-lo gratuito",
"home.donation.description": "<p><strong>O Embroidery Viewer é totalmente gratuito</strong> para todos usarem, sem anúncios.</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>",
"home.donation.cta": "🙌 Doe agora",
"home.donation.cta.description": "cada pequena ajuda é bem-vinda!",
"home.cta.title": "🚀 Experimente agora",
"home.cta.cta": "🧵 Abrir visualizador",
"home.cta.cta.description": "o <strong>visualizador de arquivos de bordado online gratuito</strong> mais rápido.",
"main.title": "Carregar arquivos",
"main.languageSwitch": "🇺🇸",
"main.fileSize": "O tamanho máximo do arquivo é <strong>{{fileSize}}kb</strong>.",
@ -43,6 +75,6 @@ export default {
"main.dimensions": "Dimensões (x, y)",
"main.download": "Baixar imagem",
"main.copyright": "Copyright © {{year}} <a href=\"{{website}}/pt-br\" target=\"_blank\" rel=\"noreferrer\">Leonardo Murça</a>. <br/> Todos os direitos reservados.",
"main.version": "Versão: {{version}}"
"main.version": "🧵 Versão: {{version}}"
},
};

View file

@ -14,7 +14,7 @@
let component;
const unsubscribe = path.subscribe(current => {
component = routes[current].component || fallback;
component = routes[current] !== undefined ? routes[current].component : fallback;
});
onMount(() => () => unsubscribe());

View file

@ -1,2 +1,60 @@
<h1>Home</h1>
<p>Welcome to the home page.</p>
<script>
import { t } from "../../i18n"
import { path } from '../../utils/stores.js';
const onNavigateTo = (e, route) => {
e.preventDefault()
history.pushState({}, '', route);
path.set(route);
}
</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><a href="#" on:click={(e) => onNavigateTo(e, "/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="#" on:click={(e) => onNavigateTo(e, "/viewer")} class="button">{$t("home.cta.cta")}</a> {@html $t("home.cta.cta.description")}</p>
</section>
</div>
<style>
.home-container {
margin: 0 auto;
max-width: 70%;
}
@media (max-width: 768px) {
.home-container {
max-width: 100%;
}
}
</style>

View file

@ -0,0 +1,4 @@
<script>
import FileViewer from "../components/FileViewer.svelte"
</script>
<FileViewer/>

View file

@ -1,6 +1,7 @@
import Home from '../lib/pages/Home.svelte';
import About from '../lib/pages/About.svelte';
import Donate from '../lib/pages/Donate.svelte';
import Viewer from '../lib/pages/Viewer.svelte';
import NotFound from '../lib/pages/NotFound.svelte';
export const routes = {
@ -12,6 +13,10 @@ export const routes = {
component: About,
nameKey: "nav.about"
},
'/viewer': {
component: Viewer,
nameKey: "nav.viewer"
},
'/donate': {
component: Donate,
nameKey: "nav.donate"