# Demo

# Source Code

 





























<template>
  <b-container fluid class="GallerySection" v-if="items">
    <b-row class="GallerySection__contents">
      <b-col
        v-for="item in items"
        :key="item.index"
        class="GallerySection__item"
        cols="6"
        md="6"
        lg="3"
      >
        <a href="#" class="GallerySection__item-link">
          <img
            :src="imgSrc(item)"
            :alt="item.title"
            class="img-fluid GallerySection__image"
          />
          <div class="GallerySection__item-overlay">
            <span class="GallerySection__item-overlay__content"
              >{{ item.title }}
              <span class="GallerySection__item-overlay__subline">{{
                item.subline
              }}</span>
            </span>
          </div>
        </a>
      </b-col>
    </b-row>
  </b-container>
</template>

# props

 

items: { type: Array, default: null },
imageSrc: { type: String }

...