<section>

  <div class="ecommerce-gallery" data-mdb-zoom-effect="true" data-mdb-auto-height="true">

    <div class="row py-3 shadow-5">

      <!-- Loop through product gallery images -->

      <div class="col-12 mb-1">

        <div class="lightbox" >

          <img src="https://upload.wikimedia.org/wikipedia/commons/5/5b/Zobian_saad.jpg" alt="" class="ecommerce-gallery-main-img w-100 active">

        </div>

      </div>

      <div class="col-3 mt-1">

        <img src="https://upload.wikimedia.org/wikipedia/commons/5/5b/Zobian_saad.jpg" data-mdb-img="https://upload.wikimedia.org/wikipedia/commons/5/5b/Zobian_saad.jpg" alt="" class="active w-100">

      </div>

      <div class="col-3 mt-1">

        <img src="https://upload.wikimedia.org/wikipedia/commons/a/a9/SamridhTmrk.jpg" data-mdb-img="https://upload.wikimedia.org/wikipedia/commons/a/a9/SamridhTmrk.jpg" alt="Artist painting with Atelier Interactive" class="w-100">

      </div>

      <div class="col-3 mt-1">

        <img src="https://upload.wikimedia.org/wikipedia/commons/b/b9/Twist_Khalifa.png" data-mdb-img="https://upload.wikimedia.org/wikipedia/commons/b/b9/Twist_Khalifa.png" alt="Atelier Interactive colours aligned on table" class="w-100">

      </div>

    </div>

  </div>

</section>

​

import "core-js/stable";

import "regenerator-runtime/runtime";

​

//import MDB UI KIT Pro Advanced

import * as mdb from "mdb-ui-kit";

import { Lightbox } from "mdb-ui-kit";

​

// add lib as a global object

window.mdb = mdb;

​

//MDB UI Kit Plugins

​

import Parallax from "mdb-parallax";

import MultiCarousel from "mdb-multi-carousel";

import Filters from "mdb-filters";

import EcommerceGallery from "mdb-ecommerce-gallery";

​

// add plugin as a global object

window.Parallax = Parallax;

window.MultiCarousel = MultiCarousel;

window.Filters = Filters;

window.EcommerceGallery = EcommerceGallery;

​

import Search from "./modules/custom/newsearch";

import ColourChart from "./modules/custom/colourChartFilter";

​

const searchComponent = new Search();

const ColourChartComponent = new ColourChart();

​

export default {

  mdb,

  EcommerceGallery,

};