code-corps / design

MIT License
1 stars 0 forks source link

Email Design Templates #3

Closed samserif closed 7 years ago

samserif commented 7 years ago

Figuring out some email templates we can use just for transactional emails right now we have nothing for email verification, or password reset, etc or receipts for payments

For reference http://foundation.zurb.com/emails.html

joshsmith commented 7 years ago

We can make these pretty basic, too. They definitely don't need to be too fancy or complex. Just something that mirrors the exiting UI in #1.

samserif commented 7 years ago

@JoshSmith Here are some options. I find that simple is better so I kept these clean and somewhat neutral in color so when you add elements like buttons they will stand out better with the brighter colors. Let me know what you think!

Option 1 option 1

Option 2 option 2

joshsmith commented 7 years ago

Looks great @samserif!

I think I prefer Option 1, but might want to just altogether remove the social links for now in favor of whatever action might be expected in the email. What do you think?

green-arrow commented 7 years ago

@samserif Are those emails already coded in foundation, or are they sketch designs?

samserif commented 7 years ago

@JoshSmith Sounds good. I can remove the social links but I think any action (buttons, links etc.) should be in the white content box so it doesn't get lost.

@green-arrow They are just sketch designs but I planned to code them tonight or tomorrow.

green-arrow commented 7 years ago

@samserif sounds good!

How do we want to manage the templates @JoshSmith? Put the compiled templates into the API project? Or put the source files in the API and compile them on build?

joshsmith commented 7 years ago

@green-arrow we're going to use https://github.com/thoughtbot/bamboo for sending. It would be nice to be able to have a CSS inliner. I don't know if that exists in Elixir-land.

green-arrow commented 7 years ago

@JoshSmith - The foundation framework handles inlining as part of its build process.

Our current process at work is this:

joshsmith commented 7 years ago

@green-arrow it looks like you can use Phoenix views with Bamboo https://github.com/thoughtbot/bamboo#using-phoenix-views-and-layouts

green-arrow commented 7 years ago

👍

I was thinking we could compile the foundation templates on build and rename the file to have the proper .eex extension, then just use it in Bamboo like they do in their docs.

joshsmith commented 7 years ago

We would still be able to use merge variables in them though, right @green-arrow?

green-arrow commented 7 years ago

Right. It would mean that whoever codes the emails would need to know a little bit of the phoenix / elixir syntax for using variables provided by the application.

samserif commented 7 years ago

Adding this here for now..https://github.com/samserif/codecorp_emails. I'm not sure how to update the phoenix/elixir portion.

But src/pages/index.html contains the styled template.

joshsmith commented 7 years ago

@green-arrow would you be able to spend any time pointing @samserif in the right direction here?

joshsmith commented 7 years ago

Implemented now in an email! 🙌 thanks @samserif.