@extends('index-main')
@section('title', Helper::getSiteTitle(isset($title) && !empty($title) ? $title : 'Today Deals'))

@section('content')
<div class="slider">
    <div class="container">
        <div class="slack-slider">
            <div>
                <div class="imageslider"><img src="images/slider1.png" /></div>
                <div class="image-fresh">
                    <img src="images/FreshDropsCircle.png" />
                </div>
            </div>
            <div>
                <div class="imageslider"><img src="images/slider1.png" /></div>
                <div class="image-fresh">
                    <img src="images/FreshDropsCircle.png" />
                </div>
            </div>
            <div>
                <div class="imageslider"><img src="images/slider1.png" /></div>
                <div class="image-fresh">
                    <img src="images/FreshDropsCircle.png" />
                </div>
            </div>
        </div>
    </div>
</div>
<!-- Hero Main end  -->

<section class="contactless contactless-sec">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-8 col-md-6">
                <div class="content-1">
                    <p>An all new exclusive hash infused gummy, </p>
                    <p>brought to you by PLUS x Biscotti.</p>
                    <p>Procured from a single source, featuring </p>
                    <p>solvent less, ice water MAC strain hash. </p>
                </div>
            </div>
            <div class="col-lg-4 col-md-6 custom-select-alignment">
                <div class="dropdown">
                    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                      Shop Now
                    </button>
                    <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                        <a class="dropdown-item" href="#">Delivery</a>
                        <a class="dropdown-item" href="#">Palm Desert</a>
                        <a class="dropdown-item" href="#">Cat. City</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="product-main product-main-sec">
    <div class="container">
        <h1 class="in-store margin-20">Recent Releases</h1>
        <div class="row">
            <div class="col-md-4 no-padding">
                <div class="card-product">
                    <img src="images/can1.png" alt="" class="img-card w-100">

                    <div class="card-body">
                        <div class="media-body">
                            <div class="title-card">
                                <h4><a href="#">Coachella Labs</a></h4>
                                <p>Locally produced, exclusively at Libra</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-4 no-padding">
                <div class="card-product">
                    <img src="images/can2.png" alt="" class="img-card w-100">

                    <div class="card-body">
                        <div class="media-body">

                            <div class="title-card">
                                <h4><a href="#">PLUS Strains</a></h4>
                                <p>Strain specific, experience driven dummies</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-4 no-padding">
                <div class="card-product">
                    <img src="images/can3.png" alt="" class="img-card w-100">

                    <div class="card-body">
                        <div class="media-body">
                            <div class="title-card">
                               <h4><a href="#">LA Kush: Ill OG</a></h4>
                                <p> The OG of OG’s returns.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="freshdrop-text">
    <div class="container">
        <div class="row">
           <div class="col-lg-12 col-sm-12">
                <div class="fresh-drop">
                    <h1>What is Fresh Drops ?</h1>
                    <p>Fresh Drops are for the connoisseurs. Club Libra members get early access to our most exclusive, artisanal products and enjoy introductory pricing the 1st week the product hits the shelf. </p>
                </div>
            </div>
        </div>
    </div>
</section>

<div class="d-none d-sm-block">
    <div class="container">
        <a href="#"><img src="images/banner-ads.png" alt=""></a>
    </div>
</div>

<section class="product-main product-main-sec product-main-th">
    <div class="container">
        <h1 class="in-store margin-20">Recent Releases</h1>
        <div class="row">
            <div class="col-md-12 no-padding">
                <div class="card-product">
                    <img src="images/can1.png" alt="" class="img-card w-100">

                    <div class="card-body">
                        <div class="media-body">
                            <div class="title-card">
                                <h4><a href="#">Coachella Labs</a></h4>
                                <p>Locally produced, exclusively at Libra</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12 no-padding">
                <div class="card-product">
                    <img src="images/can2.png" alt="" class="img-card w-100">

                    <div class="card-body">
                        <div class="media-body">

                            <div class="title-card">
                                <h4><a href="#">PLUS Strains</a></h4>
                                <p>Strain specific, experience driven dummies</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="col-md-12 no-padding">
                <div class="card-product">
                    <img src="images/can3.png" alt="" class="img-card w-100">

                    <div class="card-body">
                        <div class="media-body">
                            <div class="title-card">
                               <h4><a href="#">LA Kush: Ill OG</a></h4>
                                <p> The OG of OG’s returns.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection

@section('js')
<script>
    x = document.getElementsByClassName("custom-select");
    if (x.length)
    {
        var x, i, j, l, ll, selElmnt, a, b, c;
        /*look for any elements with the class "custom-select":*/
        l = x.length;
        for (i = 0; i < l; i++) {
            selElmnt = x[i].getElementsByTagName("select")[0];
            ll = selElmnt.length;
            /*for each element, create a new DIV that will act as the selected item:*/
            a = document.createElement("DIV");
            a.setAttribute("class", "select-selected");
            a.innerHTML = selElmnt.options[selElmnt.selectedIndex].innerHTML;
            x[i].appendChild(a);
            /*for each element, create a new DIV that will contain the option list:*/
            b = document.createElement("DIV");
            b.setAttribute("class", "select-items select-hide");
            for (j = 1; j < ll; j++) {
                /*for each option in the original select element,
                create a new DIV that will act as an option item:*/
                c = document.createElement("DIV");
                c.innerHTML = selElmnt.options[j].innerHTML;
                c.addEventListener("click", function (e) {
                    /*when an item is clicked, update the original select box,
                    and the selected item:*/
                    var y, i, k, s, h, sl, yl;
                    s = this.parentNode.parentNode.getElementsByTagName("select")[0];
                    sl = s.length;
                    h = this.parentNode.previousSibling;
                    for (i = 0; i < sl; i++) {
                        if (s.options[i].innerHTML == this.innerHTML) {
                            s.selectedIndex = i;
                            h.innerHTML = this.innerHTML;
                            y = this.parentNode.getElementsByClassName("same-as-selected");
                            yl = y.length;
                            for (k = 0; k < yl; k++) {
                                y[k].removeAttribute("class");
                            }
                            this.setAttribute("class", "same-as-selected");
                            break;
                        }
                    }
                    h.click();
                });
                b.appendChild(c);
            }
            x[i].appendChild(b);
            a.addEventListener("click", function (e) {
                /*when the select box is clicked, close any other select boxes,
                  and open/close the current select box:*/
                e.stopPropagation();
                closeAllSelect(this);
                this.nextSibling.classList.toggle("select-hide");
                this.classList.toggle("select-arrow-active");
            });
        }
        function closeAllSelect(elmnt) {
            /*a function that will close all select boxes in the document,
              except the current select box:*/
            var x,
                y,
                i,
                xl,
                yl,
                arrNo = [];
            x = document.getElementsByClassName("select-items");
            y = document.getElementsByClassName("select-selected");
            xl = x.length;
            yl = y.length;
            for (i = 0; i < yl; i++) {
                if (elmnt == y[i]) {
                    arrNo.push(i);
                } else {
                    y[i].classList.remove("select-arrow-active");
                }
            }
            for (i = 0; i < xl; i++) {
                if (arrNo.indexOf(i)) {
                    x[i].classList.add("select-hide");
                }
            }
        }
        /*if the user clicks anywhere outside the select box,
            then close all select boxes:*/
        document.addEventListener("click", closeAllSelect);
    }
</script>
@endsection