diff --git a/enews/enews-java/html-generator/src/main/java/com/novoda/enews/HtmlGenerator.java b/enews/enews-java/html-generator/src/main/java/com/novoda/enews/HtmlGenerator.java
index 09e577df1..8f86f1e2d 100644
--- a/enews/enews-java/html-generator/src/main/java/com/novoda/enews/HtmlGenerator.java
+++ b/enews/enews-java/html-generator/src/main/java/com/novoda/enews/HtmlGenerator.java
@@ -19,123 +19,125 @@ public String generate(Stream articleStream) {
head();
shareBar.injectCssInto(this);
style();
- text("#newsletter-body {"
-// + " display: flex;"
-// + " flex-direction: column;" Not supported in email clients
-// + " align-items: center;"
+ text("" +
+ "* {"
+ + " margin: 0;"
+ + " padding: 0;"
+ "}"
+ + "#newsletter-body {"
+ + " padding: 5px;"
+ + "}"
+ "#title a {"
+ " text-decoration: none;"
+ " color: #26A3DB;"
+ "}"
- + "#title p {"
- + " font: 300 1.2em/1.8 Open Sans, regular;"
+ + "#intro {"
+ + " font: 300 1.2em/1.8 Open Sans, Helvetica, Verdana, sans-serif, regular;"
+ " color: #6d6d6d;"
+ " text-align: justify;"
+ "}"
- + "ul {"
- + " -webkit-padding-start: 0px;"
- + "}"
+ "li {"
+ " list-style-type: none;"
+ + " padding-top: 20px;"
+ + " padding-bottom: 20px;"
+ "}"
+ "li a {"
+ " text-decoration: none;"
+ " color: black;"
+ "}"
- + "#content { "
+ + "#article {"
+ + "width: 70%;"
+ + "margin: 0 auto;"
+ "}"
+ "#article-image { "
+ " object-fit: cover;"
+ "}"
+ "#article-title {"
+ " color: #000000;"
+ + " font-weight: bold;"
+ + " font-family: Open Sans, Helvetica, Verdana, sans-serif;"
+ + " line-height: 1.5;"
+ "}"
+ "#article-text {"
+ " color: #000000;"
+ + " font-weight: regular;"
+ + " font-family: Open Sans, Helvetica, Verdana, sans-serif;"
+ + " line-height: 1.5;"
+ "}"
// Mobile Small
+ " @media only screen and (min-width: 320px) {"
+ + "#newsletter-body {"
+ + "width:360px;"
+ + "}"
+ "#header-image { "
- + " background: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_PhoneSmall.png);"
- + " width:360px; height:190px"
+ + " background-image: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_PhoneSmall.png);"
+ + " width: 360px; height: 190px;"
+ "}"
- + "#intro {"
- + "max-width: 360px;"
- +"}"
+ "#article-image { "
+ " width: 360px; height: 202px;"
+ "}"
+ "#article-title {"
- + " font: bold 18px/1.5 Open Sans, Helvetica, Verdana, sans-serif;"
- + " max-width: 360px;"
+ + " font-size: 18px;"
+ "}"
+ "#article-text {"
- + " font: 200 14px/1.5 Open Sans, regular;"
- + " max-width: 360px;"
+ + " font-size: 14px;"
+ "}"
+ "}"
// Mobile Large
+ " @media only screen and (min-width: 425px) {"
+ + "#newsletter-body {"
+ + "width:425px;"
+ + "}"
+ "#header-image { "
- + " background: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_PhoneLarge.png);"
- + " width:425px; height:188px"
+ + " background-image: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_PhoneLarge.png);"
+ + " width: 360px; height: 190px;"
+ "}"
- + "#intro {"
- + "max-width: 360px;"
- +"}"
+ "#article-image { "
+ " width: 360px; height: 202px;"
+ "}"
+ "#article-title {"
- + " font: bold 18px/1.5 Open Sans, Helvetica, Verdana, sans-serif;"
- + " max-width: 360px;"
+ + " font-size: 18px;"
+ "}"
+ "#article-text {"
- + " font: 200 14px/1.5 Open Sans, regular;"
- + " max-width: 360px;"
+ + " font-size: 14px;"
+ "}"
+ "}"
// Tablet
+ " @media only screen and (min-width: 768px) {"
+ + "#newsletter-body {"
+ + "width:600px;"
+ + "}"
+ "#header-image { "
- + " background: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_Tablet.png);"
- + " width:600px; height:180px"
+ + " background-image: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_Tablet.png);"
+ + " width: 600px; height: 180px;"
+ "}"
- + "#intro {"
- + "max-width: 600px;"
- +"}"
+ "#article-image { "
+ " width: 480px; height: 268px;"
+ "}"
+ "#article-title {"
- + " font: bold 20px/1.5 Open Sans, Helvetica, Verdana, sans-serif;"
- + " max-width: 480px;"
+ + " font-size: 20px;"
+ "}"
+ "#article-text {"
- + " font: 200 16px/1.5 Open Sans, regular;"
- + " max-width: 480px;"
+ + " font-size: 16px;"
+ "}"
+ "}"
// Laptop
+ " @media only screen and (min-width: 1024px) {"
+ + "#newsletter-body {"
+ + "width:800px;"
+ + "}"
+ "#header-image { "
- + " background: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_desktop.png);"
- + " width:800px; height:253px"
+ + " background-image: url(https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/Header_desktop.png);"
+ + " width: 800px; height: 253px;"
+ "}"
- + "#intro {"
- + "max-width: 800px;"
- +"}"
+ "#article-image { "
+ " width: 480px; height: 268px;"
+ "}"
+ "#article-title {"
- + " font: bold 20px/1.5 Open Sans, Helvetica, Verdana, sans-serif;"
- + " max-width: 480px;"
+ + " font-size: 20px;"
+ "}"
+ "#article-text {"
- + " font: 200 16px/1.5 Open Sans, regular;"
- + " max-width: 480px;"
+ + " font-size: 16px;"
+ "}"
+ "}"
+ ""
@@ -148,9 +150,8 @@ public String generate(Stream articleStream) {
.div()
.id("title")
.a().href("https://twitter.com/novoda").target("_blank")
- .img()
+ .div()
.id("header-image")
- .src("https://s3-eu-west-1.amazonaws.com/novoda-public-image-bucket/blank.gif")
.end()
.end()
.p()
@@ -187,6 +188,7 @@ void makeList() {
li()
.a().href(article.getPageLink())
.div()
+ .id("article")
.img()
.id("article-image")
.src(article.getImage())