File "menu.php"

Full Path: C:/wamp64/www/Actas_Usuarios/views/dashboard/menu.php
File size: 4.38 KB
MIME-type: text/html
Charset: utf-8

 
Open Edit   Advanced Editor   Back 
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Menú Principal — Actas de Usuarios</title>
    <link rel="icon" type="image/png" href="assets/img/icono.png">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">
    <style>
        @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700&display=swap');
        *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
        body {
            font-family: 'Montserrat', sans-serif;
            min-height: 100vh;
            background: linear-gradient(to right, #FF8626, #E6B881);
            display: flex;
            align-items: center;
            justify-content: center;
            flex-direction: column;
            padding: 20px;
        }
        .main-container {
            background: #fff;
            border-radius: 20px;
            width: 100%;
            max-width: 750px;
            padding: 50px 60px;
            box-shadow: 10px 10px 20px rgba(0,0,0,.25);
            text-align: center;
        }
        .logo-box img { max-width: 180px; border-radius: 16px; padding: 8px; }
        .bienvenida { font-size: .85rem; color: #888; margin-top: 6px; }
        .bienvenida strong { color: #FF4500; }
        h3 { color: #333; font-weight: 700; font-size: 1.1rem; margin: 18px 0 6px;
             text-transform: uppercase; letter-spacing: .5px; }
        hr { background-color: #FF4500; height: 2px; border: none; margin: 10px 0 24px; }

        .btn-modulo {
            display: flex; flex-direction: column; align-items: center;
            justify-content: center; gap: 10px; width: 100%;
            padding: 22px 12px; border: 2px solid #FF4500; border-radius: 16px;
            color: #FF4500; background: #fff; font-size: .82rem; font-weight: 600;
            text-decoration: none; transition: all .25s ease;
            font-family: 'Montserrat', sans-serif;
        }
        .btn-modulo:hover {
            background: #FF4500; color: #fff;
            transform: translateY(-3px);
            box-shadow: 0 6px 14px rgba(255,69,0,.3);
            text-decoration: none;
        }
        .btn-modulo i { font-size: 2.2rem; }
        .btn-logout { border-color: #c0392b; color: #c0392b; }
        .btn-logout:hover { background: #c0392b; color: #fff;
                            box-shadow: 0 6px 14px rgba(192,57,43,.3); }
        .copyright {
            display: inline-block; padding: 10px 18px; background: #fafafa;
            color: #333; border-radius: 6px; font-size: 14px;
            font-weight: bold; margin-top: 22px;
        }
        @media (max-width: 576px) { .main-container { padding: 30px 20px; } }
    </style>
</head>
<body>
<div class="main-container">

    <div class="logo-box">
        <img src="assets/img/Logo.png" alt="Logo Avicampo" onerror="this.style.display='none'">
    </div>
    <p class="bienvenida">Bienvenido, <strong><?= htmlspecialchars($usuario) ?></strong></p>

    <h3>Portal de Actas de Usuarios</h3>
    <hr>

    <div class="row justify-content-center">
		
		<!-- Acta App -->
        <div class="col-md-4 col-sm-6 mb-3">
            <a href="index.php?page=acta_app_consultar" class="btn-modulo">
                <i class="fa-solid fa-globe"></i>
                Acta App
            </a>
        </div>
		
		<!-- Capacitaciones -->
        <div class="col-md-4 col-sm-6 mb-3">
            <a href="index.php?page=capacitacion" class="btn-modulo">
                <i class="fa-solid fa-award"></i>
                Capacitaciones
            </a>
        </div>

        <!-- Cerrar sesión -->
        <div class="col-md-4 col-sm-6 mb-3">
            <a href="index.php?page=logout" class="btn-modulo btn-logout">
                <i class="fa-solid fa-right-from-bracket"></i>
                Cerrar Sesión
            </a>
        </div>

    </div>

    <hr>
    <div class="copyright">&#169; Avicampo <?= date('Y') ?></div>
</div>

<script src="https://code.jquery.com/jquery-3.6.4.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>