Mr.Combet Webshell 🔥

View File Name : DepartmentDetail.cshtml

@model bnb.Models.DepartmentViewModel
@{
    ViewBag.Title = "DepartmentDetail";
    Layout = "~/Views/Shared/_Navbar.cshtml";
}

<meta name="keywords" content="private hospital in Nepal, hospital Nepal, Nepal hospital, hospital, orthopedic, urology, orthopedic Nepal, orthopedic surgery, urology Nepal, Ashok Banskota, Jagadish Baidya, B&B, BnB, Kathmandu hospital, Lalitpur hospital">

<style>
    .l-banner__slider {
        margin-top: 0px
    }

    .l-breadcrumb {
        margin-bottom: 0px;
    }

    .l-banner__slider .carousel-item {
        min-height: 500px;
    }

    p {
        text-align: justify;
    }
    
    @*.contain:hover .overlay {
        opacity: 1;
    }*@
    .contain {
        position: relative;
    }

    .l-banner__slider .carousel-item {
        min-height: 160px;
        position: relative;
    }

    .l-banner__slider .carousel-item .contain {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        background: rgba(51, 53, 61, 0.6);
        color: #f1f1f1;
        transition: .5s ease;
        font-size: 20px;
        padding: 10px;
        text-align: center;
        height: 44px;
    }

    .overlay {
        width: 100%;
        @*opacity: 0;
    *@ color: white;
            
    }

    .l-banner-caption {
        font-size: 14px;
    }

    @@media (min-width: 1280px) {
        .l-banner__slider .carousel-item .contain {
            height: 60px;
        }
            .l-banner__slider .carousel-item {
            min-height: 500px;
            background-size: cover !important;
        }

        .l-banner-caption {
            font-size: 25px;
        }

        .img-doctor {
            height: 275px;
            object-fit: contain;
        }
    }

    @*.col-xs-12 {
        width: 65%;
    }*@

    @*@@media(max-width: 500px) {
        .carousel-inner .carousel-item {
            background-size: 491px 501px;
        }
    }*@
</style>




<div class="l-breadcrumb pt-2 pb-2">
    <div class="container">
        <nav style="--bs-breadcrumb-divider: url(&#34;data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8'%3E%3Cpath d='M2.5 0L1 1.5 3.5 4 1 6.5 2.5 8l4-4-4-4z' fill='currentColor'/%3E%3C/svg%3E&#34;);" aria-label="breadcrumb" class="d-flex py-3">
            <ol class="mb-0 breadcrumb align-self-center">
                <li class="breadcrumb-item"><a href="@Url.Action("Index","HomeUI")">Home</a></li>
                <li class="breadcrumb-item"><a href="@Url.Action("Department","HomeUI")">Department</a></li>
                <li class="breadcrumb-item active" aria-current="page">@Model.DepartmentName</li>
            </ol>
        </nav>
    </div>
</div>




<div id="inner-slider" class="l-banner__slider carousel slide" data-bs-ride="carousel" style="margin-bottom: 40px">
    <div class="carousel-inner" role="listbox">
        @foreach (var item in Model.DepartmentImages.Take(1))
        {
            <div class="carousel-item active" style="background: url(../../Content/img/@item.ImageUrl);  background-size:cover ; background-repeat: no-repeat;">
                <div class="contain">
                    <div class="overlay">
                        <p class="text-center l-banner-caption m-0" style="text-transform: uppercase;">@item.Caption</p>
                    </div>
                </div>
            </div>

            @*<div class="carousel-item active" style="background: url(../../Content/img/@item.ImageUrl) no-repeat 0 0 /cover;"><P style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 200%; }">@item.Caption</P></div>*@

        }

        @foreach (var item in Model.DepartmentImages.Skip(1))
        {
            <div class="carousel-item" style="background-image: url(../../Content/img/@item.ImageUrl); background-size: cover; background-repeat: no-repeat;">
                <div class="contain">
                    <div class="overlay">
                        @*<P style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 200%; }">@item.Caption</P>*@
                        <p class="text-center l-banner-caption m-0" style="text-transform: uppercase;">@item.Caption</p>
                    </div>
                </div>
            </div>
        }
        <a class="carousel-control-prev text-decoration-none" href="#inner-slider" role="button" data-bs-target="#inner-slider" data-bs-slide="prev">
            <i class="fa-solid fa-angle-left"></i>
        </a>
        <a class="carousel-control-next text-decoration-none" href="#inner-slider" role="button" data-bs-target="#inner-slider" data-bs-slide="next">
            <i class="fa-solid fa-angle-right"></i>
        </a>
    </div>

    <div class="container align-self-lg-center align-self-center mb-3">
        @*<h1 class="content__title mb-0  align-self-center fw-bold">@Model.DepartmentName</h1>*@
    </div>

    <div class="container mb-5">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-9 col-lg-8">
                <div class="m-blog mb-4 pb-2">
                    <div class="m-blog__post mb-5">
                        @*<div class="m-blog__img mb-4">
                                <a href="#">
                                    <img src="~/Content/img/@Model.Thumbnail" class="w-100 rounded-3" alt="blog">
                                </a>
                            </div>*@
                        <div class="m-blog__title">
                            <h2 class="m-0 pb-3">
                                <a href="#" class="text-decoration-none" style="color: #F58220; text-transform: uppercase;">Department of @Model.DepartmentName</a>
                            </h2>
                        </div>
                        <div class="m-blog__tags mb-2 text-uppercase">
                            <a class="m-blog__category text-decoration-none rounded-1" href="#">
                                @Model.DepartmentNameNepali
                            </a>
                        </div>
                        @Html.Raw(Model.LongDescription)

                    </div>
                    <hr class="pb-0 mb-2"/>
                    <h2 style="text-align: center; color: #F58220; text-transform: uppercase;">Department Related Doctors</h2>
                    <hr class="mt-4" />
                    <div class="row m-blog__post mb-5 text-center" id="doc">
                        @foreach (var item in ViewBag.doctor)
                        {
                            <div class="col-sm-6 col-md-6">
                                <a href="@Url.Action("OurDoctorDetail", "HomeUI", new { name = item.UrlName })">
                                    <img src="~/Content/img/@item.Thumbnail" class="w-100 img-doctor rounded-3 img-fluid" alt="Alternate Text" />
                                </a>
                                @*<img src="~/Content/img/@item.Thumbnail" alt="Alternate Text" style="width: 250px; flex: 25%; height:275px " />*@
                                <div class="m-blog__tags mb-2 text-uppercase">
                                    @*<a class="m-blog__category text-decoration-none rounded-1" href="@Url.Action("OurDoctorDetail", "HomeUI", new { id = item.DoctorId })">
                                            @item.DoctorName
                                        </a>*@
                                    <div class="m-blog__title">
                                        <h3 class="m-0 pb-3">
                                            @* <a href="@Url.Action("OurDoctorDetail", "HomeUI", new { id = item.DoctorId })" class="text-decoration-none" style=" font-size: 14px; color: #F58220;">@item.DoctorName</a>*@
                                            <a href="@Url.Action("OurDoctorDetail", "HomeUI", new { name = item.UrlName })" class="text-decoration-none" style="font-size: 15px; color: #F58220; cursor: pointer; font-weight: 600;">@item.DoctorName</a>
                                            <br />
                                            <p class="m-blog__author" style="font-size: 12px; text-align: inherit;">@item.Designation</p>
                                        </h3>
                                    </div>
                                </div>

                            </div>



                        }
                    </div>

                </div>
            </div>
            @Html.Partial("_RightSideNav")
        </div>
    </div>