components

Markdown

A Markdown component that converts markdown to valid vue-email template code

Usage

Add the component to your email template. Include styles where needed.

<script setup>
import { EMarkdown } from 'vue-email';

const md = `# Hello, World!`;
</script>

<template>
  <e-markdown 
    :custom-styles="{
      h1: { color: 'red' },
      h2: {
        color: 'blue',
      },
      codeInline: {
        background: 'grey',
      },
    }"
    :container-styles="{
      padding: '12px',
      border: 'solid 1px black',
    }"
    :source="md"
  />
</template>

Props

sourcerequired
string

Contains the markdown content that will be rendered in the email template

ContainerStyles
string

Provide custom styles for the containing div that wraps the markdown content

CustomStyles
string

Provide custom styles for the corresponding html element (p, h1, h2, etc.)