<template>
  <ui-shadow-box @click="$router.push('/article-detail')" v-bind="$attrs" class="relative">
    <div class="flex bg-white pl-16px pr-14px items-center h-165px">
      <div class="relative">
        <img class="w-250px h-140px object-cover" src="/imgs/article_cover1.png" />
        <div class="absolute left-0 top-0 text-white text-size-12px">
          <img class="w-60px h-auto" src="/imgs/cover-tag.png" />
          <span class="absolute top-0 h-full w-full flex items-center ml-6px"
            >VIP尊享</span
          >
        </div>
      </div>
      <div class="w-19px"></div>
      <div class="flex flex-col flex-1 h-full">
        <div class="h-18px"></div>
        <div class="text-size-20px text-[#000A04] font-thin">
          这里是轮播图推荐内容标题这里是轮播图推荐内容标题
        </div>
        <div class="h-23px"></div>
        <div class="text-[#686868] text-size-16px font-normal leading-20px h-40px">
          这里是文章简介内容这里是文章简介内容这里是文章简介内容这里是文章简介内
          容这里是文这里是文章简介内容这里是文章简介内容这里是文章简介内容这......
        </div>
        <div class="h-32px"></div>
        <div class="flex w-full items-center">
          <div class="text-[#B8B8B8] text-size-14px font-normal">香港特派员赵圆松</div>
          <div class="flex items-center ml-76px">
            <img class="w-18px h-auto" src="/imgs/time.png" />
            <div class="text-[#B8B8B8] text-size-14px font-normal ml-5px">2022-08-09</div>
          </div>
          <div
            v-if="!$slots.right"
            class="text-[#B8B8B8] text-size-14px font-medium ml-auto"
          >
            2803浏览
          </div>
          <slot name="right"></slot>
        </div>
      </div>
    </div>
  </ui-shadow-box>
</template>

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

<style></style>
