catalogo y carrito de compras
This commit is contained in:
Brisa
+659
@@ -0,0 +1,659 @@
|
||||
<?php
|
||||
session_start();
|
||||
include("db.php");
|
||||
|
||||
$categoria = isset($_GET['cat']) ? $_GET['cat'] : '';
|
||||
|
||||
if ($categoria == '' || $categoria == 'Todos') {
|
||||
$titulo_pagina = "Nuestro Menú";
|
||||
$subtitulo_pagina = "Descubrí todas las delicias caseras listas para vos";
|
||||
$query = "SELECT * FROM productos WHERE activo = 1 AND id != 999";
|
||||
} else {
|
||||
$titulo_pagina = htmlspecialchars($categoria);
|
||||
$subtitulo_pagina = "Los mejores platos de nuestra cocina a tu mesa";
|
||||
$cat_segura = $conexion->real_escape_string($categoria);
|
||||
$query = "SELECT * FROM productos WHERE categoria = '$cat_segura' AND activo = 1 AND id != 999";
|
||||
}
|
||||
|
||||
$resultado = $conexion->query($query);
|
||||
|
||||
$query_promo = "SELECT p.mensaje
|
||||
FROM promociones p
|
||||
WHERE p.fecha_publicacion >= NOW() - INTERVAL 1 DAY
|
||||
ORDER BY p.id DESC LIMIT 1";
|
||||
$res_promo = $conexion->query($query_promo);
|
||||
|
||||
$promo_activa = null;
|
||||
if ($res_promo && $res_promo->num_rows > 0) {
|
||||
$datos_promo = $res_promo->fetch_assoc();
|
||||
|
||||
$query_prod_999 = "SELECT precio, imagen, stock FROM productos WHERE id = 999 AND activo = 1";
|
||||
$res_999 = $conexion->query($query_prod_999);
|
||||
|
||||
if ($res_999 && $res_999->num_rows > 0) {
|
||||
$prod_999 = $res_999->fetch_assoc();
|
||||
$promo_activa = array(
|
||||
'mensaje' => $datos_promo['mensaje'],
|
||||
'precio' => $prod_999['precio'],
|
||||
'imagen' => $prod_999['imagen'],
|
||||
'stock' => $prod_999['stock']
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
// Contador del pedido (solo lectura de sesión, no modifica la lógica del carrito)
|
||||
$cant_pedido = 0;
|
||||
if (!empty($_SESSION['carrito']) && is_array($_SESSION['carrito'])) {
|
||||
foreach ($_SESSION['carrito'] as $item) {
|
||||
if (is_array($item) && isset($item['cantidad'])) {
|
||||
$cant_pedido += (int) $item['cantidad'];
|
||||
} else {
|
||||
$cant_pedido += 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
?>
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="es">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Productos - La Pecosa</title>
|
||||
<link rel="stylesheet" href="css/all.min.css">
|
||||
<style>
|
||||
/* ══════════════════════════════════════
|
||||
BASE
|
||||
══════════════════════════════════════ */
|
||||
* { margin: 0; padding: 0; box-sizing: border-box; }
|
||||
html { scroll-behavior: smooth; }
|
||||
body {
|
||||
font-family: 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
|
||||
background-color: #fffef8;
|
||||
color: #333;
|
||||
padding-bottom: 70px; /* espacio para barra inferior fija */
|
||||
}
|
||||
|
||||
.container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
NAVBAR (estilo index.php)
|
||||
══════════════════════════════════════ */
|
||||
.navbar {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 8px 5%;
|
||||
background-color: #e02828;
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 1000;
|
||||
box-shadow: 0 2px 12px rgba(0,0,0,0.15);
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.nav-left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 24px;
|
||||
}
|
||||
|
||||
.nav-brand {
|
||||
color: #fffef8;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 0.5px;
|
||||
text-decoration: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.nav-brand i { font-size: 1rem; }
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
gap: 7px;
|
||||
list-style: none;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
/* Botones finos del navbar */
|
||||
.nav-pill {
|
||||
text-decoration: none;
|
||||
background-color: rgba(255,255,255,0.15);
|
||||
color: #fff;
|
||||
padding: 6px 14px;
|
||||
border-radius: 50px;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.4px;
|
||||
border: 1px solid rgba(255,255,255,0.25);
|
||||
transition: all 0.25s ease;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.nav-pill:hover {
|
||||
background-color: #fff;
|
||||
color: #e02828;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
|
||||
}
|
||||
|
||||
/* Variante destacada (LOGIN) */
|
||||
.nav-pill.pill-login {
|
||||
background-color: #fff;
|
||||
color: #e02828;
|
||||
}
|
||||
.nav-pill.pill-login:hover {
|
||||
background-color: #1a1a1a;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/* Etiqueta de usuario logueado */
|
||||
.nav-user {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
background: rgba(0,0,0,0.18);
|
||||
color: #fff;
|
||||
padding: 6px 14px;
|
||||
border-radius: 50px;
|
||||
font-size: 11px;
|
||||
font-weight: 700;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.4px;
|
||||
border: 1px solid rgba(255,255,255,0.25);
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
TÍTULO DE SECCIÓN
|
||||
══════════════════════════════════════ */
|
||||
.titulo-seccion-contenedor {
|
||||
text-align: center;
|
||||
margin: 48px 0 36px;
|
||||
padding: 36px 20px;
|
||||
background: #fffef8;
|
||||
}
|
||||
.titulo-seccion-contenedor h1 {
|
||||
font-size: 2.4rem;
|
||||
font-weight: 800;
|
||||
color: #1a1a1a;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1.5px;
|
||||
}
|
||||
.titulo-seccion-contenedor h1::after {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 64px;
|
||||
height: 4px;
|
||||
background: linear-gradient(90deg, #e02828, #ff8585);
|
||||
margin: 14px auto 0;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.titulo-seccion-contenedor p {
|
||||
font-size: 1.05rem;
|
||||
color: #777;
|
||||
font-style: italic;
|
||||
margin-top: 14px;
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
BANNER SLIDER
|
||||
══════════════════════════════════════ */
|
||||
.product-banner-slider {
|
||||
width: 100vw;
|
||||
margin-left: calc(-50vw + 50%);
|
||||
margin-right: calc(-50vw + 50%);
|
||||
margin-bottom: 40px;
|
||||
height: 220px;
|
||||
overflow: hidden;
|
||||
border-radius: 0;
|
||||
position: relative;
|
||||
}
|
||||
.product-slider-wrapper {
|
||||
display: flex;
|
||||
gap: 0;
|
||||
width: max-content;
|
||||
height: 100%;
|
||||
animation: scrollContinuo 40s linear infinite;
|
||||
}
|
||||
.product-slide {
|
||||
width: 300px;
|
||||
height: 100%;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.product-slide img {
|
||||
display: block;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
.product-banner-slider:hover .product-slider-wrapper {
|
||||
animation-play-state: paused;
|
||||
}
|
||||
@keyframes scrollContinuo {
|
||||
0% { transform: translateX(0); }
|
||||
100% { transform: translateX(-50%); }
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
CARD DE PROMOCIÓN EN TIEMPO REAL
|
||||
══════════════════════════════════════ */
|
||||
.promo-realtime-card {
|
||||
background: #fff;
|
||||
border: 2px dashed #e02828;
|
||||
padding: 24px;
|
||||
border-radius: 22px;
|
||||
margin-bottom: 40px;
|
||||
display: flex;
|
||||
gap: 24px;
|
||||
align-items: center;
|
||||
box-shadow: 0 8px 28px rgba(224, 40, 40, 0.07);
|
||||
animation: pulseCard 2.5s infinite;
|
||||
}
|
||||
@keyframes pulseCard {
|
||||
0% { border-color: #e02828; }
|
||||
50% { border-color: #f59e0b; }
|
||||
100% { border-color: #e02828; }
|
||||
}
|
||||
.promo-thumb {
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
flex-shrink: 0;
|
||||
border-radius: 16px;
|
||||
overflow: hidden;
|
||||
border: 1px solid #f0f0f0;
|
||||
background-color: #fff;
|
||||
}
|
||||
.promo-thumb img { width: 100%; height: 100%; object-fit: cover; }
|
||||
|
||||
.promo-info-layout {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 20px;
|
||||
}
|
||||
.promo-content h4 {
|
||||
background: #e02828;
|
||||
color: white;
|
||||
padding: 5px 14px;
|
||||
border-radius: 50px;
|
||||
font-size: 0.75rem;
|
||||
font-weight: 700;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 6px;
|
||||
margin-bottom: 8px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.promo-content p {
|
||||
font-size: 1.3rem;
|
||||
font-weight: 700;
|
||||
color: #1e293b;
|
||||
line-height: 1.3;
|
||||
}
|
||||
.promo-price-tag {
|
||||
font-size: 1.7rem;
|
||||
font-weight: 800;
|
||||
color: #e02828;
|
||||
display: block;
|
||||
margin-top: 6px;
|
||||
}
|
||||
.promo-action {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: flex-end;
|
||||
gap: 8px;
|
||||
}
|
||||
.btn-promo-carrito {
|
||||
background: #10b981;
|
||||
color: white;
|
||||
padding: 13px 26px;
|
||||
border-radius: 50px;
|
||||
font-weight: 700;
|
||||
text-decoration: none;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
box-shadow: 0 6px 16px rgba(16, 185, 129, 0.25);
|
||||
transition: 0.2s;
|
||||
}
|
||||
.btn-promo-carrito:hover { background: #059669; transform: scale(1.03); }
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
GRID DE PRODUCTOS
|
||||
══════════════════════════════════════ */
|
||||
.productos-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
|
||||
gap: 28px;
|
||||
}
|
||||
.producto-card {
|
||||
background: #fff;
|
||||
border-radius: 20px;
|
||||
padding: 18px;
|
||||
text-align: center;
|
||||
box-shadow: 0 4px 20px rgba(0,0,0,0.03);
|
||||
border: 1px solid rgba(224, 40, 40, 0.08);
|
||||
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
/* Acento superior al hacer hover */
|
||||
.producto-card::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0; left: 0; right: 0;
|
||||
height: 4px;
|
||||
background: linear-gradient(90deg, #e02828, #ff8585);
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
.producto-card:hover {
|
||||
transform: translateY(-8px);
|
||||
box-shadow: 0 16px 36px rgba(224, 40, 40, 0.12);
|
||||
border-color: rgba(224, 40, 40, 0.25);
|
||||
}
|
||||
.producto-card:hover::before { opacity: 1; }
|
||||
|
||||
.producto-card img {
|
||||
width: 100%;
|
||||
height: 190px;
|
||||
object-fit: cover;
|
||||
border-radius: 14px;
|
||||
margin-bottom: 16px;
|
||||
background-color: #fdfdfd;
|
||||
transition: transform 0.4s ease;
|
||||
}
|
||||
.producto-card:hover img { transform: scale(1.05); }
|
||||
|
||||
.producto-card h3 {
|
||||
font-size: 1.15rem;
|
||||
font-weight: 700;
|
||||
margin-bottom: 8px;
|
||||
color: #2d2d2d;
|
||||
}
|
||||
.precio {
|
||||
display: block;
|
||||
font-size: 1.5rem;
|
||||
font-weight: 800;
|
||||
color: #e02828;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.stock-info { margin-top: auto; }
|
||||
|
||||
/* Botón de compra */
|
||||
.btn-carrito {
|
||||
background: #e02828;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 13px 20px;
|
||||
border-radius: 50px;
|
||||
cursor: pointer;
|
||||
font-weight: 700;
|
||||
font-size: 0.95rem;
|
||||
width: 100%;
|
||||
transition: 0.2s ease-in-out;
|
||||
box-shadow: 0 4px 12px rgba(224, 40, 40, 0.15);
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
gap: 8px;
|
||||
}
|
||||
.btn-carrito:hover { background: #be1e1e; transform: translateY(-2px); box-shadow: 0 8px 18px rgba(224,40,40,0.22); }
|
||||
|
||||
.no-hay {
|
||||
text-align: center;
|
||||
grid-column: 1 / -1;
|
||||
padding: 70px;
|
||||
color: #999;
|
||||
font-style: italic;
|
||||
background: #fff;
|
||||
border-radius: 20px;
|
||||
border: 1px dashed #e5e5e5;
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
BARRA INFERIOR FIJA (estilo index.php)
|
||||
══════════════════════════════════════ */
|
||||
.bottom-bar {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background: #e02828;
|
||||
color: #fffef8;
|
||||
padding: 12px 5%;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
z-index: 1000;
|
||||
box-shadow: 0 -2px 16px rgba(0,0,0,0.12);
|
||||
}
|
||||
.footer-text { font-size: 0.85rem; font-weight: 600; opacity: 0.92; }
|
||||
.btn-red {
|
||||
background: rgba(255,255,255,0.15);
|
||||
color: #fff;
|
||||
border: 1px solid rgba(255,255,255,0.3);
|
||||
padding: 8px 18px;
|
||||
border-radius: 50px;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 700;
|
||||
cursor: pointer;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 9px;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.5px;
|
||||
transition: all 0.25s;
|
||||
}
|
||||
.btn-red:hover {
|
||||
background: #fff;
|
||||
color: #e02828;
|
||||
transform: translateY(-1px);
|
||||
box-shadow: 0 4px 12px rgba(0,0,0,0.15);
|
||||
}
|
||||
/* Contador del pedido (estilo index.php) */
|
||||
#cart-count {
|
||||
background: #fff;
|
||||
color: #e02828;
|
||||
font-size: 0.72rem;
|
||||
min-width: 22px;
|
||||
height: 22px;
|
||||
padding: 0 5px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50px;
|
||||
font-weight: 800;
|
||||
transition: all 0.25s;
|
||||
}
|
||||
.btn-red:hover #cart-count {
|
||||
background: #e02828;
|
||||
color: #fff;
|
||||
outline: 2px solid #fff;
|
||||
}
|
||||
|
||||
/* ══════════════════════════════════════
|
||||
RESPONSIVE
|
||||
══════════════════════════════════════ */
|
||||
@media (max-width: 768px) {
|
||||
.navbar { flex-direction: column; padding: 10px 4%; }
|
||||
.nav-left { justify-content: center; }
|
||||
.nav-links { justify-content: center; }
|
||||
.nav-pill, .nav-user { padding: 6px 12px; font-size: 10px; }
|
||||
|
||||
.titulo-seccion-contenedor h1 { font-size: 1.8rem; }
|
||||
|
||||
.promo-realtime-card { flex-direction: column; text-align: center; }
|
||||
.promo-info-layout { flex-direction: column; gap: 15px; }
|
||||
.promo-action { align-items: center; }
|
||||
|
||||
.product-banner-slider { height: 160px; }
|
||||
.product-slide { width: 220px; }
|
||||
|
||||
.bottom-bar { padding: 10px 4%; }
|
||||
.footer-text { font-size: 0.75rem; }
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- NAVBAR estilo index.php -->
|
||||
<header class="navbar">
|
||||
<div class="nav-left">
|
||||
<a href="index.php" class="nav-brand"><i class="fa-solid fa-apple-whole"></i> La Pecosa</a>
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
<ul class="nav-links">
|
||||
<li><a href="index.php" class="nav-pill"><i class="fa-solid fa-house"></i> Inicio</a></li>
|
||||
<li><a href="productos.php?cat=Todos" class="nav-pill"><i class="fa-solid fa-bowl-food"></i> Productos</a></li>
|
||||
<li><a href="carrito.php" class="nav-pill"><i class="fa-solid fa-cart-shopping"></i> Carrito</a></li>
|
||||
|
||||
<?php if (isset($_SESSION['rol']) && $_SESSION['rol'] == 'admin'): ?>
|
||||
<li><a href="panel_admin.php" class="nav-pill"><i class="fa-solid fa-gauge"></i> Admin</a></li>
|
||||
<?php endif; ?>
|
||||
|
||||
<?php if(isset($_SESSION['usuario'])): ?>
|
||||
<li><span class="nav-user"><i class="fa-solid fa-user"></i> <?php echo strtoupper($_SESSION['usuario']); ?></span></li>
|
||||
<li><a href="logout.php" class="nav-pill"><i class="fa-solid fa-right-from-bracket"></i> Salir</a></li>
|
||||
<?php else: ?>
|
||||
<li><a href="login.php" class="nav-pill pill-login"><i class="fa-solid fa-right-to-bracket"></i> Login</a></li>
|
||||
<?php endif; ?>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<div class="container">
|
||||
|
||||
<div class="titulo-seccion-contenedor">
|
||||
<h1><?php echo $titulo_pagina; ?></h1>
|
||||
<p><?php echo $subtitulo_pagina; ?></p>
|
||||
</div>
|
||||
|
||||
<div class="product-banner-slider">
|
||||
<div class="product-slider-wrapper">
|
||||
<div class="product-slide"><img src="imagenes/imagen3.jpg" alt="Promo 3"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen4.jpg" alt="Promo 4"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen5.jpg" alt="Promo 5"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen6.jpg" alt="Promo 6"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen7.jpg" alt="Promo 7"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen8.jpg" alt="Promo 8"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen9.jpg" alt="Promo 9"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen10.jpg" alt="Promo 10"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen11.jpg" alt="Promo 11"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen12.jpg" alt="Promo 12"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen13.jpg" alt="Promo 13"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen14.jpg" alt="Promo 14"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen15.jpg" alt="Promo 15"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen16.jpg" alt="Promo 16"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen17.jpg" alt="Promo 17"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen18.jpg" alt="Promo 18"></div>
|
||||
|
||||
<div class="product-slide"><img src="imagenes/imagen3.jpg" alt="Promo 3"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen4.jpg" alt="Promo 4"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen5.jpg" alt="Promo 5"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen6.jpg" alt="Promo 6"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen7.jpg" alt="Promo 7"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen8.jpg" alt="Promo 8"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen9.jpg" alt="Promo 9"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen10.jpg" alt="Promo 10"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen11.jpg" alt="Promo 11"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen12.jpg" alt="Promo 12"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen13.jpg" alt="Promo 13"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen14.jpg" alt="Promo 14"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen15.jpg" alt="Promo 15"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen16.jpg" alt="Promo 16"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen17.jpg" alt="Promo 17"></div>
|
||||
<div class="product-slide"><img src="imagenes/imagen18.jpg" alt="Promo 18"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<?php if ($promo_activa && ($categoria == '' || $categoria == 'Todos' || $categoria == 'Promociones')): ?>
|
||||
<div class="promo-realtime-card">
|
||||
|
||||
<div class="promo-thumb">
|
||||
<img src="<?php echo !empty($promo_activa['imagen']) ? $promo_activa['imagen'] : 'img/default_promo.jpg'; ?>" alt="Imagen de la Promo">
|
||||
</div>
|
||||
|
||||
<div class="promo-info-layout">
|
||||
<div class="promo-content">
|
||||
<h4><i class="fa-solid fa-bullhorn"></i> Súper Promo de Hoy</h4>
|
||||
<p><?php echo htmlspecialchars($promo_activa['mensaje']); ?></p>
|
||||
<span class="promo-price-tag">$<?php echo number_format($promo_activa['precio'], 0, ',', '.'); ?></span>
|
||||
</div>
|
||||
|
||||
<div class="promo-action">
|
||||
<?php if (isset($promo_activa['stock']) && $promo_activa['stock'] > 0): ?>
|
||||
<span style="font-size: 0.8rem; color: #666; font-weight: 600; margin-bottom: 2px;">
|
||||
¡Quedan solo <?php echo $promo_activa['stock']; ?> unidades!
|
||||
</span>
|
||||
<a href="gestionar_carrito.php?accion=agregar&id=999&cat=<?php echo urlencode($categoria); ?>&origen=menu" class="btn-promo-carrito">
|
||||
<i class="fa-solid fa-cart-plus"></i> Añadir Promo al Carrito
|
||||
</a>
|
||||
<?php else: ?>
|
||||
<button class="btn-promo-carrito" disabled style="background-color: #e5e5e5; color: #999; cursor: not-allowed; box-shadow: none;">
|
||||
<i class="fa-solid fa-ban"></i> Promo Agotada
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
|
||||
<div class="productos-grid">
|
||||
<?php
|
||||
if ($resultado && $resultado->num_rows > 0) {
|
||||
while($row = $resultado->fetch_assoc()) {
|
||||
?>
|
||||
<div class="producto-card" id="prod-<?php echo $row['id']; ?>">
|
||||
<img src="<?php echo !empty($row['imagen']) ? $row['imagen'] : 'img/default.jpg'; ?>" alt="<?php echo htmlspecialchars($row['nombre']); ?>">
|
||||
<h3><?php echo htmlspecialchars($row['nombre']); ?></h3>
|
||||
<span class="precio">$<?php echo number_format($row['precio'], 0, ',', '.'); ?></span>
|
||||
<?php if (isset($row['stock']) && $row['stock'] > 0): ?>
|
||||
<span class="stock-info" style="display: block; font-size: 0.85rem; color: #666; margin-bottom: 12px;">
|
||||
Disponibles: <strong><?php echo $row['stock']; ?></strong> un.
|
||||
</span>
|
||||
|
||||
<a href="gestionar_carrito.php?accion=agregar&id=<?php echo $row['id']; ?>&cat=<?php echo urlencode($categoria); ?>&origen=menu#prod-<?php echo $row['id']; ?>" class="btn-carrito" style="text-decoration: none; display: flex;">
|
||||
<i class="fa-solid fa-cart-plus"></i> Añadir al carrito
|
||||
</a>
|
||||
<?php else: ?>
|
||||
<span class="stock-info" style="display: block; font-size: 0.85rem; color: #e02828; font-weight: bold; margin-bottom: 12px;">
|
||||
¡Agotado por hoy!
|
||||
</span>
|
||||
|
||||
<button class="btn-carrito" disabled style="display: flex; width: 100%; background-color: #e5e5e5; border: none; color: #999; cursor: not-allowed; box-shadow: none;">
|
||||
<i class="fa-solid fa-ban"></i> Sin Stock
|
||||
</button>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
<?php
|
||||
}
|
||||
} else {
|
||||
echo "<div class='no-hay'><i class='fa-solid fa-utensils' style='font-size: 2rem; display:block; margin-bottom:10px; color:#ccc;'></i>No hay productos disponibles por el momento en esta sección.</div>";
|
||||
}
|
||||
?>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- BARRA INFERIOR FIJA estilo index.php -->
|
||||
<footer class="bottom-bar">
|
||||
<span class="footer-text">© LA PECOSA — Paraná, Entre Ríos.</span>
|
||||
<a href="carrito.php" class="btn-red"><i class="fa-solid fa-utensils"></i> Pedido <span id="cart-count"><?php echo $cant_pedido; ?></span></a>
|
||||
</footer>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user