<template>
  <el-space alignment="flex-start" :size="10">
    <img :width="64" :height="52" :src="img ?? DefaultIconNews" alt="" />
    <el-space direction="vertical" alignment="flex-start" :size="0">
      <common-text :line-limit="1" class="text-regular text-hover" color="var(--text-primary-80-color)">
        {{ title }}
      </common-text>
      <common-text :line-limit="1" class="text-tip-1" color="var(--text-primary-65-color)">
        {{ from }}
      </common-text>
    </el-space>
  </el-space>
</template>

<script setup>
import DefaultIconNews from "@/assets/icons/default-icon-news.png";
import { ElSpace } from "element-plus";
import CommonText from "../texts/CommonText.vue";

const props = defineProps({
  img: {
    type: String,
    default: null
  },
  title: {
    type: String,
    default: ""
  },
  from: {
    type: String,
    default: ""
  }
});
</script>
<style lang="scss" scoped>
@use '@/styles/common.scss';
</style>