dsg
Copy This
<template>
  <div class="page" data-name="discover-view-venue">


    <!-- Top Navbar -->
    <div class="navbar">
      <div class="navbar-bg"></div>
      <div class="navbar-inner">
        <div class="left">
          <a class="link back">
            <i class="icon icon-back"></i>
          </a>
        </div>
        <div class="middle">
          <div class="header-logo"><img src="assets/img/logo-dark.png" /></div>
        </div>
        <div class="right">
          
          <a href="#" class="link icon-only">
            <i class="icon f7-icons">bell</i>
          </a>
        </div>
      </div>

    </div>


    <!-- Page content-->
    <div class="page-content">

      <div class="loading-fullscreen">
        <div class="preloader preloader-central">
          <span class="preloader-inner"><span class="preloader-inner-line"></span><span
              class="preloader-inner-line"></span><span class="preloader-inner-line"></span><span
              class="preloader-inner-line"></span><span class="preloader-inner-line"></span><span
              class="preloader-inner-line"></span><span class="preloader-inner-line"></span><span
              class="preloader-inner-line"></span>
          </span>
        </div>
      </div>

      <div class="discover-view-event">
        <div class="event-detail-img-box">
          <div class="swiper-container">
            <div class="swiper-wrapper">
              <div class="swiper-slide">
                <div class="swiper-image" style="background-color: gray;"></div>
              </div>
              <div class="swiper-slide">
                <div class="swiper-image" style="background-color: gray;"></div>
              </div>
            </div>
          </div>
        </div>

        <div class="container">
          <div class="event-detail">
            <div class="event-detail-title">
              <div class="skeleton-block" style="width: 200px"></div>

            </div>
            <div class="event-time-address-wrap mt-3 mb-2">
              <div class="event-time-address">
                <i class="f7-icons">placemark_fill</i>
                <span>
                  <div class="skeleton-block" style="width: 200px"></div>
                </span>
              </div>
            </div>
            <div class="event-list-btn mt-1">
              <div class="btn w-100 bg-dark venue-follow-btn">Follow</div>
            </div>
            <div class="event-list-btn d-flex">
              <div class="btn btn-primary w-100 popup-open" data-popup=".share-listing-popup"><i
                  class="f7-icons">paperplane_fill</i> Share</div>
            </div>
          </div>

          <div class="listing-tabs">
            <a href="#tab-events" class="tab-link  tab-link-active">Upcoming Events</a>
            <a href="#tab-about" class="tab-link">About</a>
          </div>

          <swiper-container class="tabs">
            <swiper-slide id="tab-events" class="tab tab-active">
              <div class="swiper-inner-container">
                <div class="grid grid-cols-2 event-listing mt-2">
                  <a href="#" class="card event-item">
                    <div class="event-image position-relative">
                      <div class="image-rectangle" style="background-image: url(\'assets/img/start01.jpg\');"></div>
                      <div class="event-dates">
                        <div class="event-date-item">
                          <p>Feb</p>
                          <h5>18</h5>
                        </div>
                        <div class="event-date-item">
                          <p>Feb</p>
                          <h5>21</h5>
                        </div>
                      </div>
                    </div>
                    <div class="card-content">
                      <h3 class="event-title">Power Maxed MotoFest Coventry</h3>
                      <p class="event-info">Starts Thu, 18 Feb 2023</p>
                      <div class="event-info">NEC Birmingham</div>
                    </div>
                  </a>
                </div>
              </div>
            </swiper-slide>
            <swiper-slide id="tab-about" class="tab">
              <div class="swiper-inner-container">
                <div class="event-des-wrap">
                  <p>
                  <div class="skeleton-block" style="width: 95%;padding: .5rem; margin-bottom: 5px;"></div>
                  <div class="skeleton-block" style="width: 95%;padding: .5rem; margin-bottom: 5px;"></div>
                  <div class="skeleton-block" style="width: 95%;padding: .5rem; margin-bottom: 5px;"></div>
                  <div class="skeleton-block" style="width: 95%;padding: .5rem; margin-bottom: 5px;"></div>
                  </p>
                </div>
              </div>
            </swiper-slide>
          </swiper-container>
        </div>
      </div>
    </div>
    <!-- Page content-->


    <!-- Share Slider -->
    <div class="popup share-listing-popup three-quarter-popup">
      <div class="view">
        <div class="page">
          <div class="navbar">
            <div class="navbar-inner">
              <div class="title">Share This</div>
              <div class="right">
                <!-- Link to close popup -->
                <a class="link popup-close"><i class="icon f7-icons">xmark</i></a>
              </div>
            </div>
          </div>
          <div class="page-content">

            <div class="block">
              <div class="list links-list list-outline-ios list-strong-ios list-dividers-ios">
                <ul>
                  <li><a href="#" target="_blank" id="copy-venue-link"><i class="icon f7-icons">link</i> Copy Link</a>
                  </li>
                  <li><a href="#" target="_blank" id="share-email-venue-link"><i class="icon f7-icons">envelope</i>
                      Share via Email</a></li>
                </ul>
              </div>
            </div>

          </div>
        </div>
      </div>
    </div>
    <!-- * Share Slider -->

  </div>
</template>
Array
(
    [div] => Array
        (
            [class] => Array
                (
                    [0] => page
                    [1] => navbar
                    [2] => navbar-bg
                    [3] => navbar-inner
                    [4] => left
                    [5] => middle
                    [6] => header-logo
                    [7] => right
                    [8] => page-content
                    [9] => loading-fullscreen
                    [10] => preloader preloader-central
                    [11] => discover-view-event
                    [12] => event-detail-img-box
                    [13] => swiper-container
                    [14] => swiper-wrapper
                    [15] => swiper-slide
                    [16] => swiper-image
                    [17] => swiper-slide
                    [18] => swiper-image
                    [19] => container
                    [20] => event-detail
                    [21] => event-detail-title
                    [22] => skeleton-block
                    [23] => event-time-address-wrap mt-3 mb-2
                    [24] => event-time-address
                    [25] => skeleton-block
                    [26] => event-list-btn mt-1
                    [27] => btn w-100 bg-dark venue-follow-btn
                    [28] => event-list-btn d-flex
                    [29] => btn btn-primary w-100 popup-open
                    [30] => listing-tabs
                    [31] => swiper-inner-container
                    [32] => grid grid-cols-2 event-listing mt-2
                    [33] => event-image position-relative
                    [34] => image-rectangle
                    [35] => event-dates
                    [36] => event-date-item
                    [37] => event-date-item
                    [38] => card-content
                    [39] => event-info
                    [40] => swiper-inner-container
                    [41] => event-des-wrap
                    [42] => skeleton-block
                    [43] => skeleton-block
                    [44] => skeleton-block
                    [45] => skeleton-block
                    [46] => popup share-listing-popup three-quarter-popup
                    [47] => view
                    [48] => page
                    [49] => navbar
                    [50] => navbar-inner
                    [51] => title
                    [52] => right
                    [53] => page-content
                    [54] => block
                    [55] => list links-list list-outline-ios list-strong-ios list-dividers-ios
                )

            [data-name] => Array
                (
                    [0] => discover-view-venue
                )

            [style] => Array
                (
                    [0] => background-color: gray;
                    [1] => background-color: gray;
                    [2] => width: 200px
                    [3] => width: 200px
                    [4] => background-image: url(\'assets/img/start01.jpg\');
                    [5] => width: 95%;padding: .5rem; margin-bottom: 5px;
                    [6] => width: 95%;padding: .5rem; margin-bottom: 5px;
                    [7] => width: 95%;padding: .5rem; margin-bottom: 5px;
                    [8] => width: 95%;padding: .5rem; margin-bottom: 5px;
                )

            [data-popup] => Array
                (
                    [0] => .share-listing-popup
                )

        )

    [a] => Array
        (
            [class] => Array
                (
                    [0] => link back
                    [1] => link icon-only
                    [2] => tab-link  tab-link-active
                    [3] => tab-link
                    [4] => card event-item
                    [5] => link popup-close
                )

            [href] => Array
                (
                    [0] => #
                    [1] => #tab-events
                    [2] => #tab-about
                    [3] => #
                    [4] => #
                    [5] => #
                )

            [target] => Array
                (
                    [0] => _blank
                    [1] => _blank
                )

            [id] => Array
                (
                    [0] => copy-venue-link
                    [1] => share-email-venue-link
                )

        )

)
Add JS Function Name