Skip to content

Commit 0fd2479

Browse files
danielfurtdanielfurt
committed
feat: adiciona sistema de tradução PT/EN e ajustes de UI
- Adiciona seletor de idioma no header (PT/EN) - Implementa sistema de tradução com localStorage - Traduz todas as sections: Header, Services, Benefits, Mission, NetworkRecoverySteps, Derivative, FAQ, ContactFormHybrid - Corrige posicionamento do botão de fechar no modal de contato - Atualiza vídeos do sistema regenerativo - Ajusta textos e ícones conforme solicitado
1 parent e6e23ea commit 0fd2479

11 files changed

Lines changed: 734 additions & 129 deletions

File tree

‎routes/_app.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,9 @@ export default defineApp(async (_req, ctx) => {
2020
<link rel="preconnect" href="https://fonts.gstatic.com" crossOrigin="anonymous"/>
2121
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"/>
2222

23+
{/* Translations Script */}
24+
<script src={asset("/translations.js")}></script>
25+
2326
{/* Geist Mono from Vercel GitHub */}
2427
<style dangerouslySetInnerHTML={{
2528
__html: `

‎sections/Benefits.tsx‎

Lines changed: 6 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -61,11 +61,12 @@ export default function Benefits({
6161
<div
6262
class="font-normal inline-block leading-[100%] tracking-tight text-white opacity-0 translate-y-8 transition-all duration-1000 ease-out delay-200 scroll-animate"
6363
style="font-size: clamp(3rem, 6vw, 5rem); max-width: 900px; margin: 0 auto 32px auto;"
64+
data-i18n="benefitsTitle"
6465
dangerouslySetInnerHTML={{
6566
__html: title,
6667
}}
6768
/>
68-
<p class="leading-[150%] md:text-lg text-lg max-w-3xl mx-auto opacity-0 translate-y-8 transition-all duration-1000 ease-out delay-400 scroll-animate" style="color: #A1ACAA;">
69+
<p class="leading-[150%] md:text-lg text-lg max-w-3xl mx-auto opacity-0 translate-y-8 transition-all duration-1000 ease-out delay-400 scroll-animate" style="color: #A1ACAA;" data-i18n="benefitsDescription">
6970
{description}
7071
</p>
7172
</div>
@@ -79,10 +80,10 @@ export default function Benefits({
7980
class="lg:col-span-2 bg-[#282524] rounded-2xl overflow-hidden flex flex-col h-full"
8081
>
8182
<div class="p-8">
82-
<h3 class="text-2xl font-semibold text-white mb-4 leading-tight">
83+
<h3 class="text-2xl font-semibold text-white mb-4 leading-tight" data-i18n={`benefit${index + 1}Title`}>
8384
{benefit.title}
8485
</h3>
85-
<p class="text-white/80 text-base leading-relaxed mb-6">
86+
<p class="text-white/80 text-base leading-relaxed mb-6" data-i18n={`benefit${index + 1}Desc`}>
8687
{benefit.description}
8788
</p>
8889
</div>
@@ -103,10 +104,10 @@ export default function Benefits({
103104
class="lg:col-span-3 bg-[#282524] rounded-2xl overflow-hidden flex flex-col h-full"
104105
>
105106
<div class="p-8">
106-
<h3 class="text-2xl font-semibold text-white mb-4 leading-tight">
107+
<h3 class="text-2xl font-semibold text-white mb-4 leading-tight" data-i18n={`benefit${index + 4}Title`}>
107108
{benefit.title}
108109
</h3>
109-
<p class="text-white/80 text-base leading-relaxed mb-6">
110+
<p class="text-white/80 text-base leading-relaxed mb-6" data-i18n={`benefit${index + 4}Desc`}>
110111
{benefit.description}
111112
</p>
112113
</div>

‎sections/ContactFormHybrid.tsx‎

Lines changed: 28 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -22,10 +22,10 @@ export default function ContactFormHybrid({
2222
<div class="hidden lg:grid lg:grid-cols-2 gap-8 lg:gap-12 items-center min-h-screen py-8">
2323
{/* Textos à esquerda */}
2424
<div class="text-left scroll-animate" style="opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease-out, transform 0.8s ease-out;">
25-
<h2 class="text-4xl sm:text-5xl lg:text-6xl font-normal text-white mb-6 leading-tight font-sans">
25+
<h2 class="text-4xl sm:text-5xl lg:text-6xl font-normal text-white mb-6 leading-tight font-sans" data-i18n="contactFormTitle">
2626
{title}
2727
</h2>
28-
<p class="text-lg sm:text-xl lg:text-2xl text-white leading-relaxed font-sans">
28+
<p class="text-lg sm:text-xl lg:text-2xl text-white leading-relaxed font-sans" data-i18n="contactFormDescription">
2929
{description}
3030
</p>
3131
</div>
@@ -38,7 +38,7 @@ export default function ContactFormHybrid({
3838
{/* Formulário sem form tag - usando divs */}
3939
<div id="contactForm" class="space-y-6">
4040
<div>
41-
<label for="nome" class="block text-sm font-medium text-gray-700 mb-2 font-sans">
41+
<label for="nome" class="block text-sm font-medium text-gray-700 mb-2 font-sans" data-i18n="contactFormNome">
4242
Nome Completo
4343
</label>
4444
<input
@@ -48,12 +48,13 @@ export default function ContactFormHybrid({
4848
required
4949
class="w-full px-4 py-3 border-0 rounded-xl focus:bg-transparent focus:border focus:border-gray-400 focus:outline-none font-sans"
5050
style="background-color: #F5F5F5; color: #1F2937;"
51+
data-i18n="contactFormNomePlaceholder"
5152
placeholder="Seu nome completo"
5253
/>
5354
</div>
5455

5556
<div>
56-
<label for="email" class="block text-sm font-medium text-gray-700 mb-2 font-sans">
57+
<label for="email" class="block text-sm font-medium text-gray-700 mb-2 font-sans" data-i18n="contactFormEmail">
5758
Email
5859
</label>
5960
<input
@@ -63,12 +64,13 @@ export default function ContactFormHybrid({
6364
required
6465
class="w-full px-4 py-3 border-0 rounded-xl focus:bg-transparent focus:border focus:border-gray-400 focus:outline-none font-sans"
6566
style="background-color: #F5F5F5; color: #1F2937;"
67+
data-i18n="contactFormEmailPlaceholder"
6668
placeholder="seu@email.com"
6769
/>
6870
</div>
6971

7072
<div>
71-
<label for="mensagem" class="block text-sm font-medium text-gray-700 mb-2 font-sans">
73+
<label for="mensagem" class="block text-sm font-medium text-gray-700 mb-2 font-sans" data-i18n="contactFormMensagem">
7274
Mensagem
7375
</label>
7476
<textarea
@@ -78,6 +80,7 @@ export default function ContactFormHybrid({
7880
required
7981
class="w-full px-4 py-3 border-0 rounded-xl focus:bg-transparent focus:border focus:border-gray-400 focus:outline-none resize-none font-sans"
8082
style="background-color: #F5F5F5; color: #1F2937;"
83+
data-i18n="contactFormMensagemPlaceholder"
8184
placeholder="Conte-nos sobre seu projeto ou dúvida..."
8285
></textarea>
8386
</div>
@@ -86,6 +89,7 @@ export default function ContactFormHybrid({
8689
type="button"
8790
id="submitBtn"
8891
class="w-full bg-black hover:bg-gray-800 text-white font-medium py-3 px-6 rounded-xl transition-all duration-200 font-mono"
92+
data-i18n="contactFormSubmit"
8993
>
9094
Enviar Mensagem
9195
</button>
@@ -98,10 +102,10 @@ export default function ContactFormHybrid({
98102
<div class="block lg:hidden py-8">
99103
{/* Textos no topo */}
100104
<div class="text-center mb-8 scroll-animate" style="opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease-out, transform 0.8s ease-out;">
101-
<h2 class="text-3xl sm:text-4xl font-normal text-white mb-4 leading-tight font-sans">
105+
<h2 class="text-3xl sm:text-4xl font-normal text-white mb-4 leading-tight font-sans" data-i18n="contactFormTitle">
102106
{title}
103107
</h2>
104-
<p class="text-base sm:text-lg text-white leading-relaxed px-4 font-sans">
108+
<p class="text-base sm:text-lg text-white leading-relaxed px-4 font-sans" data-i18n="contactFormDescription">
105109
{description}
106110
</p>
107111
</div>
@@ -114,7 +118,7 @@ export default function ContactFormHybrid({
114118
{/* Formulário sem form tag - usando divs */}
115119
<div id="contactForm-mobile" class="space-y-4">
116120
<div>
117-
<label for="nome-mobile" class="block text-sm font-medium text-gray-700 mb-2 font-sans">
121+
<label for="nome-mobile" class="block text-sm font-medium text-gray-700 mb-2 font-sans" data-i18n="contactFormNome">
118122
Nome Completo
119123
</label>
120124
<input
@@ -124,12 +128,13 @@ export default function ContactFormHybrid({
124128
required
125129
class="w-full px-4 py-3 border-0 rounded-xl focus:bg-transparent focus:border focus:border-gray-400 focus:outline-none font-sans"
126130
style="background-color: #F5F5F5; color: #1F2937;"
131+
data-i18n="contactFormNomePlaceholder"
127132
placeholder="Seu nome completo"
128133
/>
129134
</div>
130135

131136
<div>
132-
<label for="email-mobile" class="block text-sm font-medium text-gray-700 mb-2 font-sans">
137+
<label for="email-mobile" class="block text-sm font-medium text-gray-700 mb-2 font-sans" data-i18n="contactFormEmail">
133138
Email
134139
</label>
135140
<input
@@ -139,12 +144,13 @@ export default function ContactFormHybrid({
139144
required
140145
class="w-full px-4 py-3 border-0 rounded-xl focus:bg-transparent focus:border focus:border-gray-400 focus:outline-none font-sans"
141146
style="background-color: #F5F5F5; color: #1F2937;"
147+
data-i18n="contactFormEmailPlaceholder"
142148
placeholder="seu@email.com"
143149
/>
144150
</div>
145151

146152
<div>
147-
<label for="mensagem-mobile" class="block text-sm font-medium text-gray-700 mb-2 font-sans">
153+
<label for="mensagem-mobile" class="block text-sm font-medium text-gray-700 mb-2 font-sans" data-i18n="contactFormMensagem">
148154
Mensagem
149155
</label>
150156
<textarea
@@ -154,6 +160,7 @@ export default function ContactFormHybrid({
154160
required
155161
class="w-full px-4 py-3 border-0 rounded-xl focus:bg-transparent focus:border focus:border-gray-400 focus:outline-none resize-none font-sans"
156162
style="background-color: #F5F5F5; color: #1F2937;"
163+
data-i18n="contactFormMensagemPlaceholder"
157164
placeholder="Conte-nos sobre seu projeto ou dúvida..."
158165
></textarea>
159166
</div>
@@ -162,6 +169,7 @@ export default function ContactFormHybrid({
162169
type="button"
163170
id="submitBtn-mobile"
164171
class="w-full bg-black hover:bg-gray-800 text-white font-medium py-3 px-6 rounded-xl transition-all duration-200 font-mono"
172+
data-i18n="contactFormSubmit"
165173
>
166174
Enviar Mensagem
167175
</button>
@@ -367,12 +375,14 @@ export default function ContactFormHybrid({
367375
368376
// Validar dados
369377
if (!data.nome || !data.email || !data.mensagem) {
370-
showMessage('Todos os campos são obrigatórios.', false);
378+
const errorMsg = window.DerivaI18n?.t('contactFormErrorRequired') || 'Todos os campos são obrigatórios.';
379+
showMessage(errorMsg, false);
371380
return;
372381
}
373382
374383
currentSubmitBtn.disabled = true;
375-
currentSubmitBtn.textContent = 'Enviando...';
384+
const sendingText = window.DerivaI18n?.t('contactFormSending') || 'Enviando...';
385+
currentSubmitBtn.textContent = sendingText;
376386
377387
try {
378388
console.log('🔄 Enviando via Deco Action...');
@@ -402,7 +412,8 @@ export default function ContactFormHybrid({
402412
console.log('✅ Sucesso via Action:', result);
403413
404414
if (result.success) {
405-
showMessage(result.message, true);
415+
const successMsg = window.DerivaI18n?.t('contactFormSuccess') || 'Mensagem enviada com sucesso!';
416+
showMessage(successMsg, true);
406417
407418
// Limpar formulário
408419
nomeInput.value = '';
@@ -414,10 +425,12 @@ export default function ContactFormHybrid({
414425
415426
} catch (error) {
416427
console.error('❌ Erro:', error);
417-
showMessage('Erro ao enviar mensagem. Tente novamente.', false);
428+
const errorMsg = window.DerivaI18n?.t('contactFormErrorSend') || 'Erro ao enviar mensagem. Tente novamente.';
429+
showMessage(errorMsg, false);
418430
} finally {
419431
currentSubmitBtn.disabled = false;
420-
currentSubmitBtn.textContent = 'Enviar Mensagem';
432+
const submitText = window.DerivaI18n?.t('contactFormSubmit') || 'Enviar Mensagem';
433+
currentSubmitBtn.textContent = submitText;
421434
}
422435
});
423436

0 commit comments

Comments
 (0)