happychin-web/components/Header-top-section/index.vue

<template>
  <div :class="sectionClass">
    <div class="header-top-shape">
      <img src="/picture/header-top-shape.svg" alt="shape-img" />
    </div>
    <div class="container-fluid">
      <div class="header-top-wrapper">
        <!-- <ul class="contact-list">
          <li>
            <i class="fal fa-map-marker-alt"></i>
            6391 Elgin St. Celina,USA
          </li>
          <li>
            <i class="far fa-envelope"></i>
            <a href="mailto:info@example.com" class="link">info@example.com</a>
          </li>
        </ul>
        <div class="social-icon d-flex align-items-center">
          <span>Follow Us On:</span>
          <a href="#"><i class="fab fa-facebook-f"></i></a>
          <a href="#"><i class="fab fa-twitter"></i></a>
          <a href="#"><i class="fa-brands fa-linkedin-in"></i></a>
          <a href="#"><i class="fa-brands fa-youtube"></i></a>
        </div> -->
      </div>
    </div>
  </div>
</template>
<script setup>
const porps = defineProps({
  sectionClass: {
    type: String,
    default: 'header-top-section'
  }
})
</script>