Add fancybox lightbox
This commit is contained in:
parent
2aba547539
commit
40f1010573
@ -19,10 +19,6 @@
|
|||||||
<div class="carousel-item active">
|
<div class="carousel-item active">
|
||||||
<img class="d-block w-100" src="@Model?.Figures[0].FilePath" alt="...">
|
<img class="d-block w-100" src="@Model?.Figures[0].FilePath" alt="...">
|
||||||
</div>
|
</div>
|
||||||
<div class="carousel-caption d-none d-md-block">
|
|
||||||
<h5>@Model?.Name</h5>
|
|
||||||
<p>@Model?.Description</p>
|
|
||||||
</div>
|
|
||||||
@for (int i = 1; i < @Model?.Figures.Count(); i++)
|
@for (int i = 1; i < @Model?.Figures.Count(); i++)
|
||||||
{
|
{
|
||||||
<div class="carousel-item">
|
<div class="carousel-item">
|
||||||
|
@ -15,9 +15,9 @@
|
|||||||
</button>
|
</button>
|
||||||
<div class="collapse navbar-collapse" id="navbarResponsive">
|
<div class="collapse navbar-collapse" id="navbarResponsive">
|
||||||
<ul class="navbar-nav ms-auto">
|
<ul class="navbar-nav ms-auto">
|
||||||
<li class="nav-item"><a class="nav-link" href="#about">О нас</a></li>
|
<li class="nav-item"><a class="nav-link" href="#about">О нас</a></li>
|
||||||
<li class="nav-item"><a class="nav-link" href="#projects">Комплекты</a></li>
|
<li class="nav-item"><a class="nav-link" href="#projects">Комплекты</a></li>
|
||||||
<li class="nav-item"><a class="nav-link" href="#signup">Заказать</a></li>
|
<li class="nav-item"><a class="nav-link" href="#signup">Заказать</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -27,7 +27,7 @@
|
|||||||
<div class="container px-4 px-lg-5 d-flex h-100 align-items-center justify-content-center">
|
<div class="container px-4 px-lg-5 d-flex h-100 align-items-center justify-content-center">
|
||||||
<div class="d-flex justify-content-center">
|
<div class="d-flex justify-content-center">
|
||||||
<div class="text-center">
|
<div class="text-center">
|
||||||
<img class="mx-auto my-0" height="140" src="/assets/img/logo.svg"/>
|
<img class="mx-auto my-0" height="140" src="/assets/img/logo.svg" />
|
||||||
<h2 class="text-white-50 mx-auto mt-2 mb-5">Нижнее бельё ручной работы по индивидуальным меркам</h2>
|
<h2 class="text-white-50 mx-auto mt-2 mb-5">Нижнее бельё ручной работы по индивидуальным меркам</h2>
|
||||||
<a class="btn btn-primary" href="#about">Узнать больше</a>
|
<a class="btn btn-primary" href="#about">Узнать больше</a>
|
||||||
</div>
|
</div>
|
||||||
@ -59,8 +59,13 @@
|
|||||||
{
|
{
|
||||||
<div class="col mb-5">
|
<div class="col mb-5">
|
||||||
<div class="card h-100">
|
<div class="card h-100">
|
||||||
<a asp-controller="Bundle" asp-action="Show" asp-route-id="@bundle.Id"><img class="card-img-top"
|
<a data-src="@bundle.Figures.FirstOrDefault()?.FilePath" data-fancybox="@bundle.Id"
|
||||||
src="@bundle.Figures.FirstOrDefault()?.FilePath" alt="..." /></a>
|
data-caption="@bundle.Description"><img class="card-img-top"
|
||||||
|
src="@bundle.Figures.FirstOrDefault()?.FilePath" alt="@bundle.Name" /></a>
|
||||||
|
@for (int i = 1; i < @bundle.Figures.Count(); i++)
|
||||||
|
{
|
||||||
|
<a data-src="@bundle.Figures[i].FilePath" data-fancybox="@bundle.Id"></a>
|
||||||
|
}
|
||||||
<div class="card-body p-4">
|
<div class="card-body p-4">
|
||||||
<div class="text-center">
|
<div class="text-center">
|
||||||
<h5 class="fw-bolder">@bundle.Name</h5>
|
<h5 class="fw-bolder">@bundle.Name</h5>
|
||||||
|
@ -10,6 +10,7 @@
|
|||||||
<link rel="icon" type="image/x-icon" href="/assets/favicon.ico" />
|
<link rel="icon" type="image/x-icon" href="/assets/favicon.ico" />
|
||||||
<script src="https://use.fontawesome.com/releases/v6.1.0/js/all.js" crossorigin="anonymous"></script>
|
<script src="https://use.fontawesome.com/releases/v6.1.0/js/all.js" crossorigin="anonymous"></script>
|
||||||
<link href="/css/styles.css" rel="stylesheet" />
|
<link href="/css/styles.css" rel="stylesheet" />
|
||||||
|
<link href="/lib/fancyapps-ui/fancybox.css" rel="stylesheet" />
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body id="page-top">
|
<body id="page-top">
|
||||||
@ -20,6 +21,7 @@
|
|||||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/bs5-lightbox@1.8.3/dist/index.bundle.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/bs5-lightbox@1.8.3/dist/index.bundle.min.js"></script>
|
||||||
<script src="/js/scripts.js"></script>
|
<script src="/js/scripts.js"></script>
|
||||||
|
<script src="/lib/fancyapps-ui/fancybox.umd.js"></script>
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
</html>
|
@ -1,5 +1,10 @@
|
|||||||
{
|
{
|
||||||
"version": "1.0",
|
"version": "1.0",
|
||||||
"defaultProvider": "cdnjs",
|
"defaultProvider": "cdnjs",
|
||||||
"libraries": []
|
"libraries": [
|
||||||
|
{
|
||||||
|
"library": "fancyapps-ui@4.0.31",
|
||||||
|
"destination": "wwwroot\\lib\\fancyapps-ui"
|
||||||
|
}
|
||||||
|
]
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user