meface/docs/.vuepress/theme/components/Custom/SubjectInfo.vue

<template>
  <div class="part1-container">
    <div
      class="major aos-init aos-animate"
      data-aos="fade-up"
      data-aos-delay="50"
      data-aos-anchor-placement="top-bottom"
    >
      —&nbsp;欢迎来到我的备忘录&nbsp;—
    </div>
    <div class="div_p">
      <p
        class="aos-init aos-animate"
        data-aos="fade-up"
        data-aos-delay="100"
        data-aos-anchor-placement="top-bottom"
      >
        名字没什么含义，只是用来怀念那段积极向上的日子
      </p>
      <p
        class="aos-init aos-animate"
        data-aos="fade-up"
        data-aos-delay="150"
        data-aos-anchor-placement="top-bottom"
      >
        提醒自己保持那种心态，不断学习
      </p>
      <p
        class="aos-init aos-animate"
        data-aos="fade-up"
        data-aos-delay="300"
        data-aos-anchor-placement="top-bottom"
      >
        有关于我的更多信息，请移步关于我 页面进行了解...
      </p>
    </div>
    <a
      class="btn_url aos-init aos-animate"
      data-aos="fade-up"
      data-aos-delay="450"
      data-aos-anchor-placement="top-bottom"
      href="/aboutme"
      >about&nbsp;me</a
    >
  </div>
</template>

<script>
export default {};
</script>

<style lang="stylus">
.part1-container{
  text-align center
  .major{
    font-size 1.6rem
    margin-bottom 1.8rem
  }
  .div_p p{
    line-height 1.8rem
  }
  a {
    display: inline-block;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    color: white;
    background: #42b983;
    border: 1px solid #dcdfe6;
    -webkit-appearance: none;
    text-align: center;
    box-sizing: border-box;
    outline: none;
    margin: 0;
    transition: .1s;
    font-weight: 500;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    padding: 12px 20px;
    font-size: 14px;
    border-radius: 4px;
  }
}
</style>