From 40f101057350347317618252fd2fda3f170a982a Mon Sep 17 00:00:00 2001
From: Sergey Chebotar <s.chebotar@gmail.com>
Date: Fri, 10 Feb 2023 07:36:29 +0300
Subject: [PATCH] Add fancybox lightbox

---
 Views/Bundle/Show.cshtml    |  4 ----
 Views/Home/Index.cshtml     | 17 +++++++++++------
 Views/Shared/_Layout.cshtml |  2 ++
 libman.json                 |  7 ++++++-
 4 files changed, 19 insertions(+), 11 deletions(-)

diff --git a/Views/Bundle/Show.cshtml b/Views/Bundle/Show.cshtml
index 2186a3f..e3a49f1 100644
--- a/Views/Bundle/Show.cshtml
+++ b/Views/Bundle/Show.cshtml
@@ -19,10 +19,6 @@
             <div class="carousel-item active">
                 <img class="d-block w-100" src="@Model?.Figures[0].FilePath" alt="...">
             </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++)
             {
                 <div class="carousel-item">
diff --git a/Views/Home/Index.cshtml b/Views/Home/Index.cshtml
index 1d96040..574c54b 100644
--- a/Views/Home/Index.cshtml
+++ b/Views/Home/Index.cshtml
@@ -15,9 +15,9 @@
         </button>
         <div class="collapse navbar-collapse" id="navbarResponsive">
             <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="#projects">Комплекты</a></li>
-                    <li class="nav-item"><a class="nav-link" href="#signup">Заказать</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="#signup">Заказать</a></li>
             </ul>
         </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="d-flex justify-content-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>
                 <a class="btn btn-primary" href="#about">Узнать больше</a>
             </div>
@@ -59,8 +59,13 @@
             {
                 <div class="col mb-5">
                     <div class="card h-100">
-                        <a asp-controller="Bundle" asp-action="Show" asp-route-id="@bundle.Id"><img class="card-img-top"
-                                src="@bundle.Figures.FirstOrDefault()?.FilePath" alt="..." /></a>
+                        <a data-src="@bundle.Figures.FirstOrDefault()?.FilePath" data-fancybox="@bundle.Id"
+                            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="text-center">
                                 <h5 class="fw-bolder">@bundle.Name</h5>
diff --git a/Views/Shared/_Layout.cshtml b/Views/Shared/_Layout.cshtml
index 356a192..d834178 100644
--- a/Views/Shared/_Layout.cshtml
+++ b/Views/Shared/_Layout.cshtml
@@ -10,6 +10,7 @@
     <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>
     <link href="/css/styles.css" rel="stylesheet" />
+    <link href="/lib/fancyapps-ui/fancybox.css" rel="stylesheet" />
 </head>
 
 <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/bs5-lightbox@1.8.3/dist/index.bundle.min.js"></script>
     <script src="/js/scripts.js"></script>
+    <script src="/lib/fancyapps-ui/fancybox.umd.js"></script>
 </body>
 
 </html>
\ No newline at end of file
diff --git a/libman.json b/libman.json
index ceee271..fee38e5 100644
--- a/libman.json
+++ b/libman.json
@@ -1,5 +1,10 @@
 {
   "version": "1.0",
   "defaultProvider": "cdnjs",
-  "libraries": []
+  "libraries": [
+    {
+      "library": "fancyapps-ui@4.0.31",
+      "destination": "wwwroot\\lib\\fancyapps-ui"
+    }
+  ]
 }
\ No newline at end of file