<template>
  <div class="title">
    <i class="left"></i>
    <span>{{title}}</span>
    <i class="right"></i>
  </div>
</template>

<script>
export default {
  props: {
    title: {
      type: String,
      default: ''
    }
  }
}
</script>

<style lang="scss" scoped>
.title {
  font-size: 64px;
  height: 64px;
  padding-top: 68px;
  text-align: center;
  color: #6f96fe;
  font-weight: bold;
  letter-spacing: 10px;
  span {
    margin: 0 40px;
  }
  i {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: #6f96fe;
    transform: rotate(45deg);
    vertical-align: middle;
  }
}
</style>