Creating new ccs files

css/styleBill.css

@@ -0,0 +1,77 @@
+/* Estilo general */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: sans-serif;
+}
+
+body {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 100vh;
+    background: linear-gradient(to right, #a3c9a8, #8ec5a0); /* Fondo verde relajante */
+}
+
+.container {
+    background: #f9f9f9; /* Fondo claro */
+    padding: 25px 30px;
+    border-radius: 8px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+    width: 100%;
+    max-width: 600px;
+}
+
+.title {
+    color: #4d774e; /* Verde oscuro */
+    font-size: 35px;
+    font-weight: 800;
+    text-align: center;
+    margin-bottom: 30px;
+}
+
+/* Estilo del formulario */
+form {
+    display: flex;
+    flex-direction: column;
+}
+
+form label {
+    margin-bottom: 15px;
+    font-size: 18px;
+    color: #4d774e;
+    display: flex;
+    flex-direction: column;
+}
+
+form input, form textarea {
+    outline: none;
+    border: 2px solid #8ec5a0; /* Borde verde */
+    padding: 10px;
+    font-size: 16px;
+    border-radius: 5px;
+    background-color: #f9f9f9; /* Fondo claro */
+    margin-top: 5px;
+}
+
+form textarea {
+    resize: none; /* No permitir cambiar tamaño */
+}
+
+form button {
+    color: #fff;
+    border: none;
+    background: linear-gradient(to right, #4d774e, #81c784); /* Botón verde degradado */
+    padding: 12px 20px;
+    cursor: pointer;
+    font-size: 20px;
+    border-radius: 5px;
+    transition: background 0.3s, transform 0.2s ease-in-out;
+    margin-top: 20px;
+}
+
+form button:hover {
+    background: #4d774e; /* Verde sólido */
+    transform: scale(1.05); /* Efecto de aumento */
+}

css/styleCMM.css

@@ -0,0 +1,64 @@
+/* Estilo general */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+    font-family: sans-serif;
+}
+
+body {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    min-height: 100vh;
+    background: linear-gradient(to right, #a3c9a8, #8ec5a0); /* Fondo verde relajante */
+}
+
+.container {
+    text-align: center;
+    background: #f9f9f9; /* Fondo claro */
+    padding: 25px 30px;
+    border-radius: 8px;
+    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
+    width: 100%;
+    max-width: 500px;
+}
+
+.title {
+    color: #4d774e; /* Verde oscuro */
+    font-size: 35px;
+    font-weight: 800;
+    margin-bottom: 30px;
+}
+
+/* Botones */
+button {
+    color: #fff;
+    border: none;
+    background: linear-gradient(to right, #4d774e, #81c784); /* Botón verde degradado */
+    padding: 12px 20px;
+    cursor: pointer;
+    font-size: 20px;
+    border-radius: 5px;
+    transition: transform 0.2s ease-in-out, background 0.3s;
+    margin: 10px 0;
+}
+
+button:hover {
+    background: #4d774e; /* Verde sólido */
+    transform: scale(1.05); /* Efecto de aumento */
+}
+
+/* Animación de pulso */
+.animated-button {
+    animation: pulse 2s infinite;
+}
+
+@keyframes pulse {
+    0%, 100% {
+        transform: scale(1);
+    }
+    50% {
+        transform: scale(1.1);
+    }
+}

js/main.js

@@ -4,7 +4,7 @@ document.getElementById('loginForm').addEventListener('submit', function (event)
     const username = document.getElementById('username').value;
     const password = document.getElementById('password').value; 
     // Simulación de autenticación
-    if (username === 'usuario' && password === 'contraseña') {  // Cambia a los valores que necesites
+    if (username === 'admin' && password === 'admin') {  // Cambia a los valores que necesites
         localStorage.setItem('isAuthenticated', 'true');  // Guardamos el estado de autenticación
         window.location.href = 'menu.html';  // Redirigimos al menú
     } else {

menu.html

@@ -30,9 +30,9 @@ <h1 class="text-center text-success mb-4">Menú Principal</h1>
                         <span>Libro de Ventas</span>
                     </button>
                 </div>
-                <!-- Gestor de Clientes -->
+                <!-- Menu Gestor de Clientes -->
                 <div class="col-md-6 col-lg-3 text-center">
-                    <button id="btnGestorClientes" class="menu-item btn btn-light p-3 shadow-sm d-flex flex-column align-items-center" onclick="window.location.href='pages/gestorClientes.html';">
+                    <button id="btnGestorClientes" class="menu-item btn btn-light p-3 shadow-sm d-flex flex-column align-items-center" onclick="window.location.href='pages/gestorClientesMenu.html';">
                         <i class="fa-solid fa-users fa-2x mb-2"></i>
                         <span>Gestor de Clientes</span>
                     </button>

pages/facturasElectronicas.html

@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Crear Factura</title>
+    <!-- Bootstrap CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- Archivo CSS personalizado -->
+    <link rel="stylesheet" href="/css/styleBill.css">
+</head>
+<body>
+    <div class="container mt-5">
+        <div class="card shadow p-4">
+            <h1 class="title text-center mb-4">Crear Factura</h1>
+            <form action="exportar_factura.php" method="POST">
+                <div class="mb-3">
+                    <label for="nombre_cliente" class="form-label">Nombre del Cliente:</label>
+                    <input type="text" id="nombre_cliente" name="nombre_cliente" class="form-control" placeholder="Ingresa el nombre del cliente" required>
+                </div>
+                <div class="mb-3">
+                    <label for="documento_cliente" class="form-label">Documento del Cliente:</label>
+                    <input type="text" id="documento_cliente" name="documento_cliente" class="form-control" placeholder="Cédula/NIT" required>
+                </div>
+                <div class="mb-3">
+                    <label for="direccion_cliente" class="form-label">Dirección:</label>
+                    <input type="text" id="direccion_cliente" name="direccion_cliente" class="form-control" placeholder="Dirección del cliente" required>
+                </div>
+                <div class="mb-3">
+                    <label for="detalles_producto" class="form-label">Detalles del Producto:</label>
+                    <textarea id="detalles_producto" name="detalles_producto" class="form-control" placeholder="Descripción del producto" rows="4" required></textarea>
+                </div>
+                <div class="mb-3">
+                    <label for="total" class="form-label">Total a Pagar:</label>
+                    <input type="number" id="total" name="total" class="form-control" placeholder="Total en COP" required>
+                </div>
+                <button type="submit" class="btn btn-success btn-lg w-100">Exportar Factura</button>
+            </form>
+        </div>
+    </div>
+    <!-- Bootstrap JS -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+</body>
+</html>

pages/gestorClientesMenu.html

@@ -0,0 +1,29 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Gestión de Clientes</title>
+    <!-- Bootstrap CSS -->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <!-- Archivo CSS personalizado -->
+    <link rel="stylesheet" href="/css/styleClientManagerMenu.css">
+</head>
+<body>
+    <div class="container text-center mt-5">
+        <div class="card shadow p-4">
+            <h1 class="title mb-4">Gestión de Clientes</h1>
+            <div class="d-flex flex-column gap-3">
+                <button class="animated-button btn btn-lg btn-success" onclick="window.location.href='crear_cliente.html'">
+                    Crear Cliente Preferido
+                </button>
+                <button class="animated-button btn btn-lg btn-success" onclick="window.location.href='mirar_clientes.html'">
+                    Mirar Clientes
+                </button>
+            </div>
+        </div>
+    </div>
+    <!-- Bootstrap JS -->
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+</body>
+</html>