<template>
  <section class="border0">
    <div class="title">
      <slot v-if="$slots.title" name="title"/>
      <b v-else v-text="title"/>
    </div>
    <div class="slot">
      <slot />
    </div>
  </section>
</template>

<script>
export default {
  name: "border0",
  props: {title: String}
}
</script>

<style lang="scss" scoped>
.border0 {
  height: 100%;
  .title {
    padding-left: 30px;
    background-image: url("./../asset/titleBg.svg");
    background-repeat: no-repeat;
    height: 41px;
    margin-bottom: 10px;

    & > b {
      font-size: 24px;
      color: #fff;
      line-height: 32px;
      letter-spacing: 2px;
    }
  }

  .slot {
    height: calc(100% - 51px);
  }
}
</style>
