89 lines
4.6 KiB
HTML
89 lines
4.6 KiB
HTML
<div class="max-w-5xl mx-auto p-8">
|
|
<div class="section-title flex items-center mb-6">
|
|
<span class="w-1 h-10 bg-blue-800 mr-4"></span>
|
|
<h2 class="text-3xl font-bold text-gray-800">
|
|
Oficina Virtual Gases del Oriente
|
|
</h2>
|
|
</div>
|
|
|
|
<p class="mb-12">
|
|
Bienvenid@ a la Oficina Virtual de Gases del Oriente SA ESP. Si ya está registrado(a), puede
|
|
iniciar sesión con el Usuario y Contraseña asignados durante el registro. Si aún no tiene Usuario y Contraseña,
|
|
es necesario registrarse según las acciones que desee realizar.
|
|
</p>
|
|
<div class="relative w-full max-w-5xl bg-white shadow-lg rounded-[35px] overflow-hidden">
|
|
<div class="relative w-full h-0 pb-[120%] md:pb-[60%] lg:pb-[50%]"> <!-- Aspect ratio box -->
|
|
<img src="/img/img20.webp" alt="Background Image"
|
|
class="absolute inset-0 w-full h-full object-cover rounded-[35px]">
|
|
<div class="absolute inset-0 z-10 flex flex-col justify-center p-8 lg:max-w-md lg:ml-8">
|
|
<h1 class="text-2xl lg:text-4xl font-bold mb-6 text-[#404e7b] text-center">Iniciar sesión</h1>
|
|
<form action="/do/login" method="POST">
|
|
<div class="mb-4">
|
|
<label for="email" class="block text-md font-medium text-gray-700">Correo electrónico</label>
|
|
<input type="email" id="email" required name="email"
|
|
class="mt-1 block w-full px-3 py-3 lg:py-4 rounded-xl shadow-[0_5px_25px_rgba(0,0,0,0.1)]"
|
|
placeholder="Ingrese su correo electrónico" />
|
|
</div>
|
|
<div class="mb-8">
|
|
<label for="password" class="block text-md font-medium text-gray-700">Contraseña</label>
|
|
<input type="password" id="password" name="password" required
|
|
class="mt-1 block w-full px-3 py-3 lg:py-4 rounded-xl shadow-[0_5px_25px_rgba(0,0,0,0.1)]"
|
|
placeholder="Ingrese su contraseña" />
|
|
</div>
|
|
<a href="/request-password-reset" class="text-black">¿Olvidaste tu contraseña?</a>
|
|
<div class="flex justify-center">
|
|
<button type="{{.Type}}" class="primary-button py-2 px-5 bg-[#284c91] text-white font-medium rounded shadow-sm">
|
|
Iniciar sesión
|
|
</button>
|
|
|
|
|
|
{{if .error}}
|
|
<p class="text-red-300">{{.message}}</p>
|
|
{{end}}
|
|
</div>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="max-w-5xl mx-auto p-8 mb-8">
|
|
<div class="grid grid-cols-1 md:grid-cols-2 gap-8">
|
|
<div class="flex flex-col">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-1 h-16 bg-[#274e93] mr-2"></div>
|
|
<h2 class="text-3xl font-bold text-gray-800">Registrarse Como Usuario del Gas Natural</h2>
|
|
</div>
|
|
<div class="flex-grow bg-white p-10 rounded-lg shadow-[0_5px_25px_rgba(0,0,0,0.1)]">
|
|
<p class="mb-4 text-gray-600">
|
|
Podrá Ver o Imprimir facturas, Consultar o Registrar PQRs, Consultar Estado de créditos, Realizar
|
|
pagos.
|
|
</p>
|
|
<a href="/register-gas">
|
|
<button type="{{.Type}}" class="secondary-button w-full py-2 px-5 bg-[#beda75] text-[#284c91] font-medium rounded shadow-sm hover:bg-[#aecc5b] my-auto">
|
|
Registrarse como usuario del Gas
|
|
</button>
|
|
</a>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="flex flex-col">
|
|
<div class="flex items-center mb-4">
|
|
<div class="w-1 h-16 bg-[#274e93] mr-2"></div>
|
|
<h2 class="text-3xl font-bold text-gray-800">Registrarse Como Organismo de Inspección (OIA)</h2>
|
|
</div>
|
|
<div class="flex-grow bg-white p-10 rounded-lg shadow-[0_5px_25px_rgba(0,0,0,0.1)]">
|
|
<p class="mb-4 text-gray-600">
|
|
Para cargar los certificados de resultados de inspección de conformidad.
|
|
</p>
|
|
<a href="/register-oia">
|
|
<button type="{{.Type}}" class="secondary-button w-full py-2 px-5 bg-[#beda75] text-[#284c91] font-medium rounded shadow-sm hover:bg-[#aecc5b] my-auto">
|
|
Registrarse como OIA
|
|
</button>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|