avives
1f72193a64
Some checks are pending
Module sub-split / Sub-split (push) Waiting to run
- Base: wintercms/winter branch 1.2 (full framework) - Theme vivespos: Canvas 7 + Bootstrap 5 CDN, custom CSS - Layout: deferred GTM/GA4 tracking, JSON-LD SoftwareApplication - Partials: hero (offline-first), features, modes (offline/nube toggle), screenshots, pricing (3 planes), comparison, FAQ, CTA - Plugin VivesPOS.Site with ContactForm - Dockerfile: PHP 8.2 Apache, port 80, healthcheck - Added winter/wn-pages, blog, sitemap, seo plugins - Active theme set to vivespos
74 lines
4.8 KiB
HTML
74 lines
4.8 KiB
HTML
description = "Modos: Offline vs Nube — toggle interactivo"
|
|
==
|
|
<section id="modos" class="py-5 py-md-6">
|
|
<div class="container">
|
|
<div class="text-center mb-5">
|
|
<p class="eyebrow eyebrow-violet mb-2">Dos modos de trabajar</p>
|
|
<h2 class="display-5 fw-bold mb-2">Offline o con la nube — tu decides</h2>
|
|
<p class="lead text-muted">Empieza offline hoy. Conecta con la nube cuando lo necesites. Sin migraciones, sin perdida de datos.</p>
|
|
</div>
|
|
<div class="vp-mode-toggle">
|
|
<button class="vp-mode-btn active" id="modeOffline" onclick="vpShowMode('offline')">📍 Solo Offline</button>
|
|
<button class="vp-mode-btn" id="modeCloud" onclick="vpShowMode('cloud')">☁️ Con Sincronizacion Nube</button>
|
|
</div>
|
|
<div id="modeContentOffline" class="vp-mode-detail">
|
|
<div class="row g-4 align-items-center">
|
|
<div class="col-lg-6">
|
|
<div class="vp-mode-card card border-0 shadow-sm rounded-4 p-4 h-100">
|
|
<h3 class="h4 fw-bold mb-3"><i class="bi-wifi-off text-brand me-2"></i>Modo Offline</h3>
|
|
<p class="text-muted">VivesPOS funciona 100% local. Ideal para una sola tienda o puesto.</p>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Vende sin internet.</strong> Tu POS nunca se detiene.</span></li>
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Datos locales.</strong> SQLite en tu maquina, backups manuales.</span></li>
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Cero costo recurrente.</strong> Sin servidores, sin suscripcion.</span></li>
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Privacidad total.</strong> Nada sale de tu equipo.</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="vp-screenshot bg-light rounded-4 d-flex align-items-center justify-content-center" style="min-height:300px;">
|
|
<div class="text-center p-4">
|
|
<i class="bi-laptop" style="font-size:4rem; color:var(--vp-brand);"></i>
|
|
<p class="fw-bold mt-3 mb-1">Tu computadora = tu POS</p>
|
|
<p class="text-muted small mb-0">Windows 10/11 o Linux<br>4GB RAM minimo<br>Sin internet requerido</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="modeContentCloud" class="vp-mode-detail" style="display:none;">
|
|
<div class="row g-4 align-items-center">
|
|
<div class="col-lg-6">
|
|
<div class="vp-mode-card card border-0 shadow-sm rounded-4 p-4 h-100" style="border:2px solid var(--vp-brand);">
|
|
<h3 class="h4 fw-bold mb-3"><i class="bi-cloud-check text-brand me-2"></i>Sincronizacion con la Nube</h3>
|
|
<p class="text-muted">Conecta multiples cajas o sincroniza con tu sistema central cuando haya internet.</p>
|
|
<ul class="list-unstyled">
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Sincronizacion automatica.</strong> Las ventas se suben en segundo plano.</span></li>
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Multi-caja.</strong> Conecta varias terminales a un punto central.</span></li>
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Resiliente.</strong> Si se cae internet, sigues vendiendo. Se sincroniza al volver.</span></li>
|
|
<li class="mb-3 d-flex gap-2"><i class="bi-check2-circle text-success fs-5"></i><span><strong>Facturacion global.</strong> Genera facturas del dia automaticamente.</span></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-6">
|
|
<div class="vp-screenshot bg-light rounded-4 d-flex align-items-center justify-content-center" style="min-height:300px;">
|
|
<div class="text-center p-4">
|
|
<i class="bi-diagram-3" style="font-size:4rem; color:var(--vp-brand);"></i>
|
|
<p class="fw-bold mt-3 mb-1">Multiples cajas + nube</p>
|
|
<p class="text-muted small mb-0">Sincronizacion en segundo plano<br>Transactional outbox<br>Retry automatico<br>Idempotencia garantizada</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<script>
|
|
function vpShowMode(mode) {
|
|
document.getElementById('modeContentOffline').style.display = mode === 'offline' ? 'block' : 'none';
|
|
document.getElementById('modeContentCloud').style.display = mode === 'cloud' ? 'block' : 'none';
|
|
document.getElementById('modeOffline').classList.toggle('active', mode === 'offline');
|
|
document.getElementById('modeCloud').classList.toggle('active', mode === 'cloud');
|
|
}
|
|
</script>
|