<script setup lang="ts">
const router = useRouter();
const onClose = () => {
  router.back();
};
</script>

<template>
  <div class="second-header">
    <div class="left-text">
      <slot></slot>
    </div>
    <div>
      <svg-icon icon-class="close" @click="onClose" style="cursor: pointer" />
    </div>
  </div>
</template>

<style scoped lang="scss">
.second-header {
  width: 100%;
  height: $main-header-height;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: $hj-white-1;
  padding: 0 20px;
  border-bottom: 1px solid $hj-white-3;

  .left-text {
    height: 18px;

    font-weight: bold;
    font-size: 14px;
    color: $hj-black-1;
    line-height: 16px;
    text-align: left;
  }
}
</style>
