Archivo ohana.html añadido

This commit is contained in:
Ohana Monserrath Gutierrez Hernandez 2025-03-26 07:09:09 -06:00
parent 7e75c092ee
commit 210d1eb9bc
1 changed files with 119 additions and 0 deletions
node_modules/admin-lte

119
node_modules/admin-lte/ohana.html generated vendored Normal file
View File

@ -0,0 +1,119 @@
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Galería | AdminLTE</title>
<!-- Estilos -->
<link rel="stylesheet" href="../plugins/fontawesome-free/css/all.min.css">
<link rel="stylesheet" href="../plugins/ekko-lightbox/ekko-lightbox.css">
<link rel="stylesheet" href="./dist/css/ohanastyle.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback">
</head>
<body class="hold-transition sidebar-mini">
<div class="wrapper">
<div class="content-wrapper">
<section class="content">
<div class="container-fluid">
<h2 class="mt-4">Gallery</h2>
<!-- Filtro de categorías -->
<div class="card card-primary">
<div class="card-header">
<h3 class="card-title">FilteriZr Gallery with Ekko Lightbox</h3>
</div>
<div class="card-body">
<div class="btn-group w-100 mb-2">
<button class="btn btn-primary filter" data-filter="all">All items</button>
<button class="btn btn-info filter" data-filter="1">Category 1 (WHITE)</button>
<button class="btn btn-success filter" data-filter="2">Category 2 (BLACK)</button>
<button class="btn btn-warning filter" data-filter="3">Category 3 (COLORED)</button>
</div>
<div class="filter-container p-0 row">
<div class="filtr-item col-md-3" data-category="1">
<a href="./dist/img/ohana/comida.jpeg" data-toggle="lightbox" data-gallery="gallery">
<img src="./dist/img/ohana/comida.jpeg" class="img-fluid" alt="White Sample">
</a>
</div>
<div class="filtr-item col-md-3" data-category="2">
<a href="./dist/img/ohana/comida.jpeg" data-toggle="lightbox" data-gallery="gallery">
<img src="./dist/img/ohana/comida.jpeg" class="img-fluid" alt="Black Sample">
</a>
</div>
<div class="filtr-item col-md-3" data-category="3">
<a href="./dist/img/ohana/comida.jpeg" data-toggle="lightbox" data-gallery="gallery">
<img src="./dist/img/ohana/comida.jpeg" class="img-fluid" alt="Colored Sample">
</a>
</div>
</div>
</div>
</div>
<!-- Sección de Lightbox -->
<div class="card card-primary">
<div class="card-header">
<h3 class="card-title">Ekko Lightbox</h3>
</div>
<div class="card-body">
<div class="row">
<div class="col-md-3">
<a href="./dist/img/ohana/comida.jpeg" data-toggle="lightbox" data-gallery="gallery">
<img src="./dist/img/ohana/comida.jpeg" class="img-fluid" alt="Sample 1">
</a>
</div>
<div class="col-md-3">
<a href="./dist/img/ohana/comida.jpeg" data-toggle="lightbox" data-gallery="gallery">
<img src="./dist/img/ohana/comida.jpeg" class="img-fluid" alt="Sample 2">
</a>
</div>
</div>
</div>
</div>
</div>
</section>
</div>
</div>
<!-- Scripts -->
<script src="../plugins/jquery/jquery.min.js"></script>
<script src="../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="../plugins/ekko-lightbox/ekko-lightbox.min.js"></script>
<script src="./dist/js/adminlte.min.js"></script>
<script src="../plugins/filterizr/jquery.filterizr.min.js"></script>
<script>
$(document).on('click', '[data-toggle="lightbox"]', function(event) {
event.preventDefault();
$(this).ekkoLightbox();
});
$(function() {
var filterizd = $('.filter-container').filterizr({
layout: 'sameSize'
});
$('.filter').on('click', function() {
$('.filter').removeClass('active');
$(this).addClass('active');
var filter = $(this).data('filter');
filterizd.filterizr('filter', filter);
});
});
</script>
</body>
</html>