Giters

soheilpro / mailwind

Use Tailwind CSS to design HTML emails.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

How to make this work?

ospfranco opened this issue · comments

commented

Thanks a lot for the package but the usage instructions are not clear at all. I have Juice installed, but then how do I pass the css file into it to render the email?

const TestMail = () => {
  return (
    <div>
      <head>
        <link rel="stylesheet" href="index.css" />
      </head>
      <h1 className="text-xl font-bold border-b">You have a new Test Email on Productlane</h1>
      <p className="border-b">Something something</p>
      <a href="https://productlane.io/feedback" className="bg-purple-600">
        Open
      </a>
    </div>
  )
}

export function testMailer({ to }: IParams) {
  const emailHtml = ReactDOMServer.renderToStaticMarkup(<TestMail />)
  const processedHtml = juice(emailHtml, {
    webResources: {
      relativeTo: "../app/core/styles/",
    },
  })

// ...
commented

You're right. That part needs a little more explanation.

But, you're doing it correctly. You only need to use the juiceResources method.

commented

thanks that works!