happychin-web/pages/team/index.vue

<template>
  <Preloader></Preloader>
  <FixArea></FixArea>
  <Header-top-section sectionClass="header-top-section-4" />
  <TopHeader headerClass="header-4" />
  <div class="search-wrap">
    <div class="search-inner">
      <i class="fas fa-times search-close" id="search-close"></i>
      <div class="search-cell">
        <form method="get">
          <div class="search-field-holder">
            <input type="search" class="main-search-input" placeholder="Search..." />
          </div>
        </form>
      </div>
    </div>
  </div>
  <div class="breadcrumb-wrapper bg-cover" style="background-image: url('/image/breadcrumb.svg')">
    <div class="line-shape">
      <img src="/picture/line1.png" alt="shape-img" />
    </div>
    <div class="plane-shape float-bob-y">
      <img src="/picture/plane2.png" alt="shape-img" />
    </div>
    <div class="doll-shape float-bob-x">
      <img src="/picture/doll.png" alt="shape-img" />
    </div>
    <div class="parasuit-shape float-bob-y">
      <img src="/picture/parasuit1.png" alt="shape-img" />
    </div>
    <div class="frame-shape">
      <img src="/picture/frame3.png" alt="shape-img" />
    </div>
    <div class="bee-shape float-bob-x">
      <img src="/picture/bee1.png" alt="shape-img" />
    </div>
    <div class="container">
      <div class="page-heading">
        <h1 class="wow fadeInUp" data-wow-delay=".3s">Our Teacher</h1>
        <ul class="breadcrumb-items wow fadeInUp" data-wow-delay=".5s">
          <li>
            <a href="p9wfc14694.html">Home</a>
          </li>
          <li>
            <i class="fas fa-chevron-right"></i>
          </li>
          <li>Our Teacher</li>
        </ul>
      </div>
    </div>
  </div>
  <section class="team-section-4 fix section-padding">
    <div class="container">
      <div class="row g-4">
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".2s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/01.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Brooklyn Simmons</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".4s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/02.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Leslie Alexander</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".6s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/03.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Ronald Richards</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".8s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/04.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Kristin Watson</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".2s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/053.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Esther Howard</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".4s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/063.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Savannah Nguyen</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".6s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/071.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Dianne Russell</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
        <div class="col-xl-3 col-lg-4 col-md-6 wow fadeInUp" data-wow-delay=".8s">
          <div class="team-items mt-0">
            <div class="team-image">
              <div class="shape-img">
                <img src="/picture/team-shape.png" alt="img" />
              </div>
              <img src="/picture/081.jpg" alt="team-img" />
              <div class="social-profile">
                <span class="plus-btn"><i class="fas fa-share-alt"></i></span>
                <ul>
                  <li>
                    <a href="#"><i class="fab fa-facebook-f"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fa-brands fa-instagram"></i></a>
                  </li>
                  <li>
                    <a href="#"><i class="fab fa-linkedin-in"></i></a>
                  </li>
                </ul>
              </div>
            </div>
            <div class="team-content">
              <h3>
                <a href="team-details.html">Kathryn Murphy</a>
              </h3>
              <p>Instructors</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <FooterSection></FooterSection>
</template>