<template>
  <el-header class="app-header">
    <div class="block"/>
    <div class="title">{{ title }}</div>
    <div class="block" style="transform: rotatey(-180deg);"/>
    <div class="block1"/>
    <div class="block1" style="transform: rotatey(-180deg);"/>
    <clock/>
  </el-header>
</template>

<script>

import Clock from "../../components/clock/Clock";
export default {
  name: 'AppHeader',
  components: {Clock  },
  data() {
    return {
      title: this.baseConfig.title, // 标题
    }
  },
  created() {
  },
  methods: {
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
  .title{
    display: block;
    font-size: 28px;
    line-height: 45px;
    text-align: center;
    font-weight: bold;
    width: 22%;
    /*background-color: #E6A23C;*/
  }
  .block{
    background: url("../../assets/images/title.png") no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    width: 38%;
    height: 45px;

  }
  .block1{
    background: url("../../assets/images/line.png") no-repeat;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
    width: 45%;
    height: 15px;
  }
</style>