Mauri
393f6b0dc3
- Arista Pro Alternate Regular self-hosted (font corporativa) - Toggle theme con CSS variables y @custom-variant dark - 6 servicios en 3 categorías (Hosting & Correo / Diseño & Contenido / Infraestructura) - 3 planes destacados (Básico USD 59, Institucional USD 129, E-commerce USD 219) - Datacenters en 4 países (Canadá, USA, Alemania, Uruguay) sin ciudades en el sitio - Sede operativa en Maldonado, Uruguay - i18n es/en con contenido duplicado en Keystatic - Endpoint PHP para form de contacto con PHPMailer + reCAPTCHA v3 + honeypot + rate limit - WorldMap con animación SVG de los 4 países - 29 páginas generadas, 0 JS por default - Sitemap auto + robots.txt - JSON-LD Organization + ProfessionalService con areaServed
82 lines
4.4 KiB
Plaintext
82 lines
4.4 KiB
Plaintext
---
|
|
import BaseLayout from '@/layouts/BaseLayout.astro';
|
|
import SectionEyebrow from '@/components/SectionEyebrow.astro';
|
|
import { getLangFromUrl, useTranslations } from '@/i18n/utils';
|
|
|
|
const lang = getLangFromUrl(Astro.url);
|
|
const t = useTranslations(lang);
|
|
const base = lang === 'en' ? '/en' : '';
|
|
const whatsappUrl = 'https://wa.me/59899812487';
|
|
|
|
const categories = [
|
|
{ key: 'correo', title: lang === 'en' ? 'Email' : 'Correo electrónico', desc: lang === 'en' ? 'Configuration in clients, IMAP/SMTP, webmail.' : 'Configuración en clientes, IMAP/SMTP, webmail.' },
|
|
{ key: 'wordpress', title: 'WordPress', desc: lang === 'en' ? 'Updates, backups, restoration, security.' : 'Actualizaciones, backups, restauración, seguridad.' },
|
|
{ key: 'dominios', title: lang === 'en' ? 'Domains & DNS' : 'Dominios y DNS', desc: lang === 'en' ? 'Point a domain, transfers, DNS records.' : 'Apuntar un dominio, transferencias, registros DNS.' },
|
|
{ key: 'cpanel', title: 'cPanel', desc: lang === 'en' ? 'Email accounts, FTP, databases, files.' : 'Cuentas de correo, FTP, bases de datos, archivos.' },
|
|
{ key: 'ssl', title: lang === 'en' ? 'SSL certificates' : 'Certificados SSL', desc: lang === 'en' ? 'Install, renewal, force HTTPS.' : 'Instalación, renovación, HTTPS forzado.' },
|
|
{ key: 'backups', title: lang === 'en' ? 'Backups' : 'Respaldos', desc: lang === 'en' ? 'JetBackup, file and email restoration.' : 'JetBackup, restauración de archivos y correos.' },
|
|
];
|
|
---
|
|
<BaseLayout
|
|
title={lang === 'en' ? 'Tutorials' : 'Instructivos'}
|
|
description={lang === 'en'
|
|
? 'Step-by-step guides to the most common questions from Hosting del Sur clients.'
|
|
: 'Guías paso a paso para las consultas más frecuentes de los clientes de Hosting del Sur.'}
|
|
lang={lang}
|
|
>
|
|
<section class="pt-20 pb-12 md:pt-28 md:pb-16" style="background: var(--hds-bg-soft);">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<SectionEyebrow text={lang === 'en' ? 'Knowledge base' : 'Base de conocimiento'} />
|
|
<h1 class="font-display leading-tight mt-5" style="font-size: clamp(2.5rem, 6vw, 4.5rem); color: var(--hds-fg);">
|
|
{lang === 'en' ? 'Tutorials' : 'Instructivos'}.
|
|
</h1>
|
|
<p class="text-lg mt-5 max-w-2xl" style="color: var(--hds-fg-soft);">
|
|
{lang === 'en'
|
|
? 'Step-by-step guides for the questions we receive most often. We are preparing detailed tutorials for each category.'
|
|
: 'Guías paso a paso para las preguntas que más recibimos. Estamos preparando instructivos detallados para cada categoría.'}
|
|
</p>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="py-20 md:py-24" style="background: var(--hds-bg);">
|
|
<div class="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="rounded-2xl p-6 md:p-8 mb-12 flex flex-col md:flex-row md:items-center md:justify-between gap-6" style="background: linear-gradient(135deg, rgba(238,118,35,0.08) 0%, rgba(250,159,92,0.12) 100%); border: 1px solid rgba(238,118,35,0.25);">
|
|
<div>
|
|
<h2 class="text-xl font-semibold mb-2" style="color: var(--hds-fg);">
|
|
{lang === 'en' ? 'Coming soon' : 'Próximamente'}
|
|
</h2>
|
|
<p style="color: var(--hds-fg-soft);">
|
|
{lang === 'en'
|
|
? 'We are writing detailed tutorials for each category. In the meantime, write to us on WhatsApp and we will help you right away.'
|
|
: 'Estamos escribiendo instructivos detallados para cada categoría. Mientras tanto, escribinos por WhatsApp y te ayudamos al instante.'}
|
|
</p>
|
|
</div>
|
|
<a
|
|
href={whatsappUrl}
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="btn-primary text-sm flex-shrink-0"
|
|
>
|
|
{lang === 'en' ? 'Chat on WhatsApp' : 'Hablar por WhatsApp'}
|
|
</a>
|
|
</div>
|
|
|
|
<h2 class="text-2xl mb-6 font-display" style="color: var(--hds-fg);">
|
|
{lang === 'en' ? 'Categories' : 'Categorías'}
|
|
</h2>
|
|
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
|
|
{categories.map((cat) => (
|
|
<div class="service-card">
|
|
<h3 class="text-base font-semibold mb-1" style="color: var(--hds-fg);">{cat.title}</h3>
|
|
<p class="text-sm mb-3" style="color: var(--hds-fg-soft);">{cat.desc}</p>
|
|
<p class="text-xs italic" style="color: var(--hds-fg-muted);">
|
|
{lang === 'en' ? 'No tutorials yet' : 'Sin instructivos aún'}
|
|
</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</BaseLayout>
|