vuepress-theme-vdoing/vdoing/theme-vdoing/components/PostList.vue

<template>
  <div class="post-list">
    <div class="post card-box">
      <div class="title-wrapper">
        <h2>
          <router-link to="/pages/fd4a16d56b83c1bc/">比typeof运算符更准确的类型判断</router-link>
        </h2>
        <div class="article-info">
          <a href="javascript:;" title="作者" class="iconfont icon-touxiang">Evan Xu</a>
          <a href="javascript:;" title="创建时间" class="iconfont icon-riqi">2020-03-03</a>
          <a href="javascript:;" title="分类" class="iconfont icon-wenjian">JavaScript文章</a>
          <a href="javascript:;" title="标签" class="iconfont icon-biaoqian">js、css</a>
        </div>
      </div>
      <div class="excerpt-wrapper">
        <div class="excerpt">
          <p>
            9月26号收到了苹果的一活动邀请邮件《创建卓越的 Apple Watch 体验》，活动地点是：Design and Development Accelerator，这是苹果今年7月份在上海设立的
            <a
              href="https://developer.apple.com/cn/accelerator/"
              target="_blank"
              rel="external nofollow noopener noreferrer"
            >设计开发加速器</a>，为开发者提供有关应用设计与开发的专业培训和资源。
          </p>
        </div>
        <router-link to="/pages/fd4a16d56b83c1bc/" class="readmore">
          阅读全文>
        </router-link>
      </div>
    </div>

    <div class="post card-box">
      <div class="title-wrapper">
        <h2>
          <router-link to="/pages/fd4a16d56b83c1bc/">比typeof运算符更准确的类型判断</router-link>
        </h2>
        <div class="article-info">
          <a href="javascript:;" title="作者" class="iconfont icon-touxiang">Evan Xu</a>
          <a href="javascript:;" title="创建时间" class="iconfont icon-riqi">2020-03-03</a>
          <a href="javascript:;" title="分类" class="iconfont icon-wenjian">JavaScript文章</a>
          <a href="javascript:;" title="标签" class="iconfont icon-biaoqian">js、css</a>
        </div>
      </div>
      <div class="excerpt-wrapper">
        <div class="excerpt">
          <p>
            9月26号收到了苹果的一活动邀请邮件《创建卓越的 Apple Watch 体验》，活动地点是：Design and Development Accelerator，这是苹果今年7月份在上海设立的
            <a
              href="https://developer.apple.com/cn/accelerator/"
              target="_blank"
              rel="external nofollow noopener noreferrer"
            >设计开发加速器</a>，为开发者提供有关应用设计与开发的专业培训和资源。
          </p>
        </div>
        <router-link to="/pages/fd4a16d56b83c1bc/" class="readmore">
          阅读全文>
        </router-link>
      </div>
    </div>

    <div class="post card-box">
      <div class="title-wrapper">
        <h2>
          <router-link to="/pages/fd4a16d56b83c1bc/">比typeof运算符更准确的类型判断</router-link>
        </h2>
        <div class="article-info">
          <a href="javascript:;" title="作者" class="iconfont icon-touxiang">Evan Xu</a>
          <a href="javascript:;" title="创建时间" class="iconfont icon-riqi">2020-03-03</a>
          <a href="javascript:;" title="分类" class="iconfont icon-wenjian">JavaScript文章</a>
          <a href="javascript:;" title="标签" class="iconfont icon-biaoqian">js、css</a>
        </div>
      </div>
      <!-- <div class="excerpt-wrapper">
        <div class="excerpt">
          <p>
            9月26号收到了苹果的一活动邀请邮件《创建卓越的 Apple Watch 体验》，活动地点是：Design and Development Accelerator，这是苹果今年7月份在上海设立的
            <a
              href="https://developer.apple.com/cn/accelerator/"
              target="_blank"
              rel="external nofollow noopener noreferrer"
            >设计开发加速器</a>，为开发者提供有关应用设计与开发的专业培训和资源。
          </p>
        </div>
        <router-link to="/pages/fd4a16d56b83c1bc/" class="readmore">
          阅读全文>
        </router-link>
      </div> -->
    </div>

    <div class="post card-box">
      <div class="title-wrapper">
        <h2>
          <router-link to="/pages/fd4a16d56b83c1bc/">比typeof运算符更准确的类型判断</router-link>
        </h2>
        <div class="article-info">
          <a href="javascript:;" title="作者" class="iconfont icon-touxiang">Evan Xu</a>
          <a href="javascript:;" title="创建时间" class="iconfont icon-riqi">2020-03-03</a>
          <a href="javascript:;" title="分类" class="iconfont icon-wenjian">JavaScript文章</a>
          <a href="javascript:;" title="标签" class="iconfont icon-biaoqian">js、css</a>
        </div>
      </div>
      <div class="excerpt-wrapper">
        <div class="excerpt">
          <p>
            9月26号收到了苹果的一活动邀请邮件《创建卓越的 Apple Watch 体验》，活动地点是：Design and Development Accelerator，这是苹果今年7月份在上海设立的
            <a
              href="https://developer.apple.com/cn/accelerator/"
              target="_blank"
              rel="external nofollow noopener noreferrer"
            >设计开发加速器</a>，为开发者提供有关应用设计与开发的专业培训和资源。
          </p>
        </div>
        <router-link to="/pages/fd4a16d56b83c1bc/" class="readmore">
          阅读全文>
        </router-link>
      </div>
    </div>

    <div class="post card-box">
      <div class="title-wrapper">
        <h2>
          <router-link to="/pages/fd4a16d56b83c1bc/">比typeof运算符更准确的类型判断</router-link>
        </h2>
        <div class="article-info">
          <a href="javascript:;" title="作者" class="iconfont icon-touxiang">Evan Xu</a>
          <a href="javascript:;" title="创建时间" class="iconfont icon-riqi">2020-03-03</a>
          <a href="javascript:;" title="分类" class="iconfont icon-wenjian">JavaScript文章</a>
          <a href="javascript:;" title="标签" class="iconfont icon-biaoqian">js、css</a>
        </div>
      </div>
      <div class="excerpt-wrapper">
        <div class="excerpt">
          <p>
            9月26号收到了苹果的一活动邀请邮件《创建卓越的 Apple Watch 体验》，活动地点是：Design and Development Accelerator，这是苹果今年7月份在上海设立的
            <a
              href="https://developer.apple.com/cn/accelerator/"
              target="_blank"
              rel="external nofollow noopener noreferrer"
            >设计开发加速器</a>，为开发者提供有关应用设计与开发的专业培训和资源。
          </p>
        </div>
        <router-link to="/pages/fd4a16d56b83c1bc/" class="readmore">
          阅读全文>
        </router-link>
      </div>
    </div>
    
  </div>
</template>

<script>
export default {

}
</script>

<style lang='stylus'>
.post-list
  .post
    .title-wrapper
      a
        color var(--textColor)
        &:hover
          color $accentColor
      h2
        margin .5rem 0
        border none
      .article-info
        a
          opacity .7
          font-size .8rem
          margin-right 1rem
          &::before
            margin-right .3rem
    .excerpt-wrapper
      border-top 1px solid var(--borderColor)
      margin .5rem 0
      overflow hidden
      .readmore
        float right 
        margin-right 1rem
</style>