<template>
  <div class="d-flex align-end justify-start flex-row-reverse flex-wrap">
    <SubCard
      class="ma-2 pa-2"
      v-for="n in 6"
      :key="n"
      :content="markdownToHtml"
    />
  </div>
</template>

<script>
import SubCard from "./SubCard.vue";
import { marked } from "marked";

export default {
  name: "HomePage",

  components: {
    SubCard,
  },

  computed: {
    markdownToHtml() {
      return marked(this.content);
    },
  },

  data: () => ({
    content: `~~Default content :D~~`,
  }),
};
</script>
