<template>
  <div class="header">
    <div class="logo">
      <img :src="logoImg" alt="" />
      <span>健康服务预约平台</span>
    </div>
    <div class="logout">
      <img :src="logout" alt="" />
      <span>退出</span>
    </div>
  </div>
</template>

<script>
export default {
  name: "Header",
  components: {},
  data() {
    return {
      logoImg: require("@/assets/imgs/login/logo.png"),
      logout: require("@/assets/imgs/login/logout.png"),
    };
  },
  methods: {},
};
</script>

<style lang="less" scoped>
.header {
  display: flex;

  justify-content: space-between;
  background: #2c2c31;
  .logout {
    padding: 2.5px 24.5px;
    color: white;
    cursor: pointer;
    line-height: 30px;
    span {
      margin-left: 3px;
      position: relative;
      top: 1px;
    }
  }
  .logo {
    padding: 2.5px 21.5px;
    span {
      color: white;
      line-height: 30px;
      margin-left: 8px;
    }
    img {
      height: 25px;
    }
  }
}
</style>
