albertorestifo

const fs = require('fs');
const Path = require('path');

const React = require('react');
const ReactDOMServer = require('react-dom/server');

const Email = require('../lib/Email').default;

const STYLE_TAG = '%STYLE%';
const CONTENT_TAG = '%CONTENT%';

albertorestifo

 {
   "name": "react-emails-example",
   "version": "0.1.0",
   "private": true,
+  "main": "./server/createEmail.js",
   "devDependencies": {
+    "babel-cli": "^6.24.1",
+    "babel-preset-react-app": "^2.2.0",
     "react-scripts": "0.9.5"
   },

albertorestifo

 import React from 'react';
 import ReactDOM from 'react-dom';

+import './inlined.css';

albertorestifo

@media only screen and (max-width: 650px) {

  .title-heading {
    font-size: 18px !important;    /* We need !important to  */
    text-align: center !important; /* overcome inline styles */
  }

}

albertorestifo

-    <h1 style={style.title}>
+    <h1 style={style.title} className="title-heading">
       {children}
     </h1>

albertorestifo

import React from 'react';

function Cell({ children }) {
  return <td>{children}</td>;
}

function Row({ children }) {
  return (
    <tr>
      {React.Children.map(children, (el) => {

albertorestifo

import React from 'react';

const style = {

  title: {
    fontSize: '24px',
    fontWeight: 'bold',
    marginTop: '5px',
    marginBottom: '10px',
  },

albertorestifo

@sentis/emails
├── index.js
└── src/
    ├── App.js
    ├── elements/

albertorestifo

var flatten = arr => arr.reduce((p, c) => p.concat(Array.isArray(c) ? flatten(c) : c), []);

/**
 * Credit goes to Benjamin Gruenbaum, from his comment on this article: http://www.2ality.com/2016/04/promise-trees.html
 */

albertorestifo

# Your init script
#
# Atom will evaluate this file each time a new window is opened. It is run
# after packages are loaded/activated and after the previous editor state
# has been restored.
#
# An example hack to log to the console when each text editor is saved.
#
# atom.workspace.observeTextEditors (editor) ->
#   editor.onDidSave ->