From 189c592a441e266a10ff79dbb6ff55a1411c3725 Mon Sep 17 00:00:00 2001 From: Jori Lallo Date: Sun, 4 Mar 2018 23:18:39 -0800 Subject: [PATCH 1/2] Tweaked email layout --- public/email/header-logo.png | Bin 0 -> 7748 bytes server/emails/WelcomeEmail.js | 3 +++ server/emails/components/Body.js | 2 +- server/emails/components/Header.js | 24 ++++++++++++++++++++++++ 4 files changed, 28 insertions(+), 1 deletion(-) create mode 100644 public/email/header-logo.png create mode 100644 server/emails/components/Header.js diff --git a/public/email/header-logo.png b/public/email/header-logo.png new file mode 100644 index 0000000000000000000000000000000000000000..8340b6a3e555f96de1568c1e84a9b2f0cfaea58c GIT binary patch literal 7748 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 KMNUMnLSTZgQ|46w literal 0 HcmV?d00001 diff --git a/server/emails/WelcomeEmail.js b/server/emails/WelcomeEmail.js index 4cf4b96c..7324de8d 100644 --- a/server/emails/WelcomeEmail.js +++ b/server/emails/WelcomeEmail.js @@ -3,6 +3,7 @@ import React from 'react'; import EmailTemplate from './components/EmailLayout'; import Body from './components/Body'; import Button from './components/Button'; +import Header from './components/Header'; import Footer from './components/Footer'; import EmptySpace from './components/EmptySpace'; @@ -21,6 +22,8 @@ ${process.env.URL}/dashboard export const WelcomeEmail = () => { return ( +
+

Welcome to Outline! diff --git a/server/emails/components/Body.js b/server/emails/components/Body.js index b36ffaeb..74c2144e 100644 --- a/server/emails/components/Body.js +++ b/server/emails/components/Body.js @@ -14,7 +14,7 @@ export default ({ children }: Props) => { - + {children} diff --git a/server/emails/components/Header.js b/server/emails/components/Header.js new file mode 100644 index 00000000..8f83d126 --- /dev/null +++ b/server/emails/components/Header.js @@ -0,0 +1,24 @@ +// @flow +import React from 'react'; +import { Table, TBody, TR, TD } from 'oy-vey'; +import EmptySpace from './EmptySpace'; +import { color } from '../../../shared/styles/constants'; + +export default () => { + return ( + + + + + + +
+ + +
+ ); +}; From 0b005afdf99e819e2d2218267199c9aec7421627 Mon Sep 17 00:00:00 2001 From: Jori Lallo Date: Sun, 4 Mar 2018 23:30:23 -0800 Subject: [PATCH 2/2] More email styles --- server/__snapshots__/mailer.test.js.snap | 2 +- server/emails/WelcomeEmail.js | 5 ++--- server/emails/components/Heading.js | 17 +++++++++++++++++ 3 files changed, 20 insertions(+), 4 deletions(-) create mode 100644 server/emails/components/Heading.js diff --git a/server/__snapshots__/mailer.test.js.snap b/server/__snapshots__/mailer.test.js.snap index be082375..98fab667 100644 --- a/server/__snapshots__/mailer.test.js.snap +++ b/server/__snapshots__/mailer.test.js.snap @@ -42,7 +42,7 @@ Object { Outline is a place for your team to build and share knowledge. -
 

Welcome to Outline!

Outline is a place for your team to build and share knowledge.

To get started, head to your dashboard and try creating a collection to help document your workflow, create playbooks or help with team onboarding.

You can also import existing Markdown document by drag and dropping them to your collections

 

View my dashboard

 
OutlineTwitterSpectrum
+
 
 

Welcome to Outline!

Outline is a place for your team to build and share knowledge.

To get started, head to your dashboard and try creating a collection to help document your workflow, create playbooks or help with team onboarding.

You can also import existing Markdown document by drag and dropping them to your collections

 

View my dashboard

 
OutlineTwitterSpectrum
diff --git a/server/emails/WelcomeEmail.js b/server/emails/WelcomeEmail.js index 7324de8d..9f39f629 100644 --- a/server/emails/WelcomeEmail.js +++ b/server/emails/WelcomeEmail.js @@ -3,6 +3,7 @@ import React from 'react'; import EmailTemplate from './components/EmailLayout'; import Body from './components/Body'; import Button from './components/Button'; +import Heading from './components/Heading'; import Header from './components/Header'; import Footer from './components/Footer'; import EmptySpace from './components/EmptySpace'; @@ -25,9 +26,7 @@ export const WelcomeEmail = () => {

-

- Welcome to Outline! -

+ Welcome to Outline!

Outline is a place for your team to build and share knowledge.

diff --git a/server/emails/components/Heading.js b/server/emails/components/Heading.js new file mode 100644 index 00000000..d7f55f6c --- /dev/null +++ b/server/emails/components/Heading.js @@ -0,0 +1,17 @@ +// @flow +import React from 'react'; + +const style = { + fontWeight: 500, + fontSize: '18px', +}; + +type Props = { + children: React$Element<*>, +}; + +export default ({ children }: Props) => ( +

+ {children} +

+);