diff --git a/README.md b/README.md index 7bc049cf8..476041566 100644 --- a/README.md +++ b/README.md @@ -33,3 +33,11 @@ Use the included `new_contribs.sh` script: ``` pelican content -s pelicanconf.py ``` +### To build the newsletter + +* Generate the HTML + ``` + TWIR_NEWSLETTER_THEME=1 pelican --delete-output-directory content + ``` +* Copy the HTML and inline CSS at http://zurb.com/ink/inliner.php - (MailChimp's inliner doesn't remove the CSS from ``). +* Send the newsletter (we currently use MailChimp). \ No newline at end of file diff --git a/content/images/logo32.png b/content/images/logo32.png new file mode 100644 index 000000000..9200bc619 Binary files /dev/null and b/content/images/logo32.png differ diff --git a/content/images/logo400.png b/content/images/logo400.png new file mode 100644 index 000000000..61b9d9200 Binary files /dev/null and b/content/images/logo400.png differ diff --git a/pelicanconf.py b/pelicanconf.py index b14525c0d..86da212ec 100644 --- a/pelicanconf.py +++ b/pelicanconf.py @@ -11,11 +11,6 @@ if '1' == os.environ.get('TWIR_NEWSLETTER_THEME'): THEME = 'themes/newsletter' - css_path = os.path.join(os.path.dirname(__file__), 'themes', 'newsletter', 'static', 'css') - with open(os.path.join(css_path, 'ink.css')) as f: - CSS_INK = f.read() - with open(os.path.join(css_path, 'main.css')) as f: - CSS_MAIN = f.read() else: THEME = 'themes/rusted' diff --git a/themes/newsletter/static/css/ink.css b/themes/newsletter/static/css/ink.css deleted file mode 100644 index ea216a568..000000000 --- a/themes/newsletter/static/css/ink.css +++ /dev/null @@ -1,513 +0,0 @@ -/********************************************** -* Ink v1.0.5 - Copyright 2013 ZURB Inc * -**********************************************/ - -/* Client-specific Styles & Reset */ - -#outlook a { - padding:0; -} - -body{ - width:100% !important; - min-width: 100%; - -webkit-text-size-adjust:100%; - -ms-text-size-adjust:100%; - margin:0; - padding:0; -} - -.ExternalClass { - width:100%; -} - -.ExternalClass, -.ExternalClass p, -.ExternalClass span, -.ExternalClass font, -.ExternalClass td, -.ExternalClass div { - line-height: 100%; -} - -#backgroundTable { - margin:0; - padding:0; - width:100% !important; - line-height: 100% !important; -} - -img { - outline:none; - text-decoration:none; - -ms-interpolation-mode: bicubic; - width: auto; - max-width: 100%; - float: left; - clear: both; - display: block; -} - -center { - width: 100%; - min-width: 580px; -} - -a img { - border: none; -} - -p { - margin: 0 0 0 10px; -} - -table { - border-spacing: 0; - border-collapse: collapse; -} - -td { - word-break: break-word; - -webkit-hyphens: auto; - -moz-hyphens: auto; - hyphens: auto; - border-collapse: collapse !important; -} - -table, tr, td { - padding: 0; - vertical-align: top; - text-align: left; -} - -hr { - color: #d9d9d9; - background-color: #d9d9d9; - height: 1px; - border: none; -} - -/* Responsive Grid */ - -table.body { - height: 100%; - width: 100%; -} - -table.container { - width: 580px; - margin: 0 auto; - text-align: inherit; -} - -table.row { - padding: 0px; - width: 100%; - position: relative; -} - -table.container table.row { - display: block; -} - -td.wrapper { - padding: 10px 20px 0px 0px; - position: relative; -} - -table.columns, -table.column { - margin: 0 auto; -} - -table.columns td, -table.column td { - padding: 0px 0px 10px; -} - -table.columns td.sub-columns, -table.column td.sub-columns, -table.columns td.sub-column, -table.column td.sub-column { - padding-right: 10px; -} - -td.sub-column, td.sub-columns { - min-width: 0px; -} - -table.row td.last, -table.container td.last { - padding-right: 0px; -} - -table.one { width: 30px; } -table.two { width: 80px; } -table.three { width: 130px; } -table.four { width: 180px; } -table.five { width: 230px; } -table.six { width: 280px; } -table.seven { width: 330px; } -table.eight { width: 380px; } -table.nine { width: 430px; } -table.ten { width: 480px; } -table.eleven { width: 530px; } -table.twelve { width: 580px; } - -table.one center { min-width: 30px; } -table.two center { min-width: 80px; } -table.three center { min-width: 130px; } -table.four center { min-width: 180px; } -table.five center { min-width: 230px; } -table.six center { min-width: 280px; } -table.seven center { min-width: 330px; } -table.eight center { min-width: 380px; } -table.nine center { min-width: 430px; } -table.ten center { min-width: 480px; } -table.eleven center { min-width: 530px; } -table.twelve center { min-width: 580px; } - -table.one .panel center { min-width: 10px; } -table.two .panel center { min-width: 60px; } -table.three .panel center { min-width: 110px; } -table.four .panel center { min-width: 160px; } -table.five .panel center { min-width: 210px; } -table.six .panel center { min-width: 260px; } -table.seven .panel center { min-width: 310px; } -table.eight .panel center { min-width: 360px; } -table.nine .panel center { min-width: 410px; } -table.ten .panel center { min-width: 460px; } -table.eleven .panel center { min-width: 510px; } -table.twelve .panel center { min-width: 560px; } - -.body .columns td.one, -.body .column td.one { width: 8.333333%; } -.body .columns td.two, -.body .column td.two { width: 16.666666%; } -.body .columns td.three, -.body .column td.three { width: 25%; } -.body .columns td.four, -.body .column td.four { width: 33.333333%; } -.body .columns td.five, -.body .column td.five { width: 41.666666%; } -.body .columns td.six, -.body .column td.six { width: 50%; } -.body .columns td.seven, -.body .column td.seven { width: 58.333333%; } -.body .columns td.eight, -.body .column td.eight { width: 66.666666%; } -.body .columns td.nine, -.body .column td.nine { width: 75%; } -.body .columns td.ten, -.body .column td.ten { width: 83.333333%; } -.body .columns td.eleven, -.body .column td.eleven { width: 91.666666%; } -.body .columns td.twelve, -.body .column td.twelve { width: 100%; } - -td.offset-by-one { padding-left: 50px; } -td.offset-by-two { padding-left: 100px; } -td.offset-by-three { padding-left: 150px; } -td.offset-by-four { padding-left: 200px; } -td.offset-by-five { padding-left: 250px; } -td.offset-by-six { padding-left: 300px; } -td.offset-by-seven { padding-left: 350px; } -td.offset-by-eight { padding-left: 400px; } -td.offset-by-nine { padding-left: 450px; } -td.offset-by-ten { padding-left: 500px; } -td.offset-by-eleven { padding-left: 550px; } - -td.expander { - visibility: hidden; - width: 0px; - padding: 0 !important; -} - -table.columns .text-pad, -table.column .text-pad { - padding-left: 10px; - padding-right: 10px; -} - -table.columns .left-text-pad, -table.columns .text-pad-left, -table.column .left-text-pad, -table.column .text-pad-left { - padding-left: 10px; -} - -table.columns .right-text-pad, -table.columns .text-pad-right, -table.column .right-text-pad, -table.column .text-pad-right { - padding-right: 10px; -} - -/* Block Grid */ - -.block-grid { - width: 100%; - max-width: 580px; -} - -.block-grid td { - display: inline-block; - padding:10px; -} - -.two-up td { - width:270px; -} - -.three-up td { - width:173px; -} - -.four-up td { - width:125px; -} - -.five-up td { - width:96px; -} - -.six-up td { - width:76px; -} - -.seven-up td { - width:62px; -} - -.eight-up td { - width:52px; -} - -/* Alignment & Visibility Classes */ - -table.center, td.center { - text-align: center; -} - -h1.center, -h2.center, -h3.center, -h4.center, -h5.center, -h6.center { - text-align: center; -} - -span.center { - display: block; - width: 100%; - text-align: center; -} - -img.center { - margin: 0 auto; - float: none; -} - -.show-for-small, -.hide-for-desktop { - display: none; -} - -/* Typography */ - -body, table.body, h1, h2, h3, h4, h5, h6, p, td { - color: #222222; - font-family: "Helvetica", "Arial", sans-serif; - font-weight: normal; - padding:0; - margin: 0; - text-align: left; - line-height: 1.3; -} - -h1, h2, h3, h4, h5, h6 { - word-break: normal; -} - -h1 {font-size: 40px;} -h2 {font-size: 36px;} -h3 {font-size: 32px;} -h4 {font-size: 28px;} -h5 {font-size: 24px;} -h6 {font-size: 20px;} -body, table.body, p, td {font-size: 14px;line-height:19px;} - -p.lead, p.lede, p.leed { - font-size: 18px; - line-height:21px; -} - -p { - margin-bottom: 10px; -} - -small { - font-size: 10px; -} - -a { - color: #2ba6cb; - text-decoration: none; -} - -a:hover { - color: #2795b6 !important; -} - -a:active { - color: #2795b6 !important; -} - -a:visited { - color: #2ba6cb !important; -} - -h1 a, -h2 a, -h3 a, -h4 a, -h5 a, -h6 a { - color: #2ba6cb; -} - -h1 a:active, -h2 a:active, -h3 a:active, -h4 a:active, -h5 a:active, -h6 a:active { - color: #2ba6cb !important; -} - -h1 a:visited, -h2 a:visited, -h3 a:visited, -h4 a:visited, -h5 a:visited, -h6 a:visited { - color: #2ba6cb !important; -} - -/* Outlook First */ - -body.outlook p { - display: inline !important; -} - -/* Media Queries */ - -@media only screen and (max-width: 600px) { - - table[class="body"] img { - width: auto !important; - height: auto !important; - } - - table[class="body"] center { - min-width: 0 !important; - } - - table[class="body"] .container { - width: 95% !important; - } - - table[class="body"] .row { - width: 100% !important; - display: block !important; - } - - table[class="body"] .wrapper { - display: block !important; - padding-right: 0 !important; - } - - table[class="body"] .columns, - table[class="body"] .column { - table-layout: fixed !important; - float: none !important; - width: 100% !important; - padding-right: 0px !important; - padding-left: 0px !important; - display: block !important; - } - - table[class="body"] .wrapper.first .columns, - table[class="body"] .wrapper.first .column { - display: table !important; - } - - table[class="body"] table.columns td, - table[class="body"] table.column td { - width: 100% !important; - } - - table[class="body"] .columns td.one, - table[class="body"] .column td.one { width: 8.333333% !important; } - table[class="body"] .columns td.two, - table[class="body"] .column td.two { width: 16.666666% !important; } - table[class="body"] .columns td.three, - table[class="body"] .column td.three { width: 25% !important; } - table[class="body"] .columns td.four, - table[class="body"] .column td.four { width: 33.333333% !important; } - table[class="body"] .columns td.five, - table[class="body"] .column td.five { width: 41.666666% !important; } - table[class="body"] .columns td.six, - table[class="body"] .column td.six { width: 50% !important; } - table[class="body"] .columns td.seven, - table[class="body"] .column td.seven { width: 58.333333% !important; } - table[class="body"] .columns td.eight, - table[class="body"] .column td.eight { width: 66.666666% !important; } - table[class="body"] .columns td.nine, - table[class="body"] .column td.nine { width: 75% !important; } - table[class="body"] .columns td.ten, - table[class="body"] .column td.ten { width: 83.333333% !important; } - table[class="body"] .columns td.eleven, - table[class="body"] .column td.eleven { width: 91.666666% !important; } - table[class="body"] .columns td.twelve, - table[class="body"] .column td.twelve { width: 100% !important; } - - table[class="body"] td.offset-by-one, - table[class="body"] td.offset-by-two, - table[class="body"] td.offset-by-three, - table[class="body"] td.offset-by-four, - table[class="body"] td.offset-by-five, - table[class="body"] td.offset-by-six, - table[class="body"] td.offset-by-seven, - table[class="body"] td.offset-by-eight, - table[class="body"] td.offset-by-nine, - table[class="body"] td.offset-by-ten, - table[class="body"] td.offset-by-eleven { - padding-left: 0 !important; - } - - table[class="body"] table.columns td.expander { - width: 1px !important; - } - - table[class="body"] .right-text-pad, - table[class="body"] .text-pad-right { - padding-left: 10px !important; - } - - table[class="body"] .left-text-pad, - table[class="body"] .text-pad-left { - padding-right: 10px !important; - } - - table[class="body"] .hide-for-small, - table[class="body"] .show-for-desktop { - display: none !important; - } - - table[class="body"] .show-for-small, - table[class="body"] .hide-for-desktop { - display: inherit !important; - } -} \ No newline at end of file diff --git a/themes/newsletter/static/css/main.css b/themes/newsletter/static/css/main.css deleted file mode 100644 index c30691d7e..000000000 --- a/themes/newsletter/static/css/main.css +++ /dev/null @@ -1,73 +0,0 @@ -.ExternalClass { - font-family: 'Fira Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif; -} - -body, table.body, h1, h2, h3, h4, h5, h6, p, td { - font-family: 'Fira Sans', 'Helvetica Neue', Helvetica, sans-serif; -} - -table.container { - border: 1px solid #DCDCDC; - border-top: 5px solid #000000; - padding-left: 12px; - padding-right: 12px; -} - -td.wrapper { - padding-left: 24px !important; - padding-right: 24px !important; -} - -p { - margin: 0px !important; - font-size: 14px !important; - color: #333; -} - -li { - font-size: 14px !important; -} - -a, a:visited { - color: #428bca!important; - text-decoration: none; -} - -code { - color: #c7254e !important; - border: 1px solid #e8e8e8; - border-radius: 3px; - background-color: #eef; - font-weight::600 !important; - font-family: 'Fira Mono', monospace; -} - -h1 { - font-size: 19px; - color: #333; - margin: 10px 0px 0px; - font-weight: bold; -} - -h1.title { - font-size: 22px; - margin: 0px; - display: inline; -} - -ul { - margin-top: 0px; -} - -.header, .footer { - background-color: #fdfdfd; -} - -.header { - border-top: 1px solid #e6e6e6; - border-bottom: 1px solid #e6e6e6; -} - -.footer { - border-top: 1px solid #e6e6e6; -} \ No newline at end of file diff --git a/themes/newsletter/templates/base.html b/themes/newsletter/templates/base.html index 70eff0977..3d01205aa 100644 --- a/themes/newsletter/templates/base.html +++ b/themes/newsletter/templates/base.html @@ -1,107 +1,255 @@ - - + + - - - - + + - - - + + + + + +
-
- - - +
- - - - - -
- +
+
+ + + - -
+ + + + + + +
+ Email isn't displaying correctly?
 + Read this e-mail on the Web +
+ + + + - -
+ + - -
- - Email isn't displaying correctly? - - Read this on the Web. - - + + + + + + + +
+ This Week in Rust + This Week in Rust +
+ + + + + + +
+ {% block number_and_date %}{% endblock number_and_date %} +
-
- - - - - -
- - - - -
-

This Week in Rust

-   - {% block number_and_date %}{% endblock number_and_date %} -
-
- - - - + + + - -
- + +
+
+ + -
{% block content %} {% endblock content %}
-
- - - - - -
- - - - -
- - Sponsored by webstream.io. -
- twiiter: @ThisWeekInRust -
- Privacy policy - | - Unsubscribe - | - Change email address - | - Read this issue on the Web - -
-
- -
- -
+
+
+ + + + +
+ + Sponsored by webstream.io. +
+ twiiter: @ThisWeekInRust +
+ Privacy policy + | + Unsubscribe + | + Change email address + | + Read this issue on the Web + +
+
+ + + + + diff --git a/themes/rusted/static/css/_layout.scss b/themes/rusted/static/css/_layout.scss index 8148717ee..99e3aa4ff 100644 --- a/themes/rusted/static/css/_layout.scss +++ b/themes/rusted/static/css/_layout.scss @@ -109,27 +109,23 @@ body > footer { .post-content { margin-bottom: $spacing-unit; - h2 { - font-size: 32px; + h1, h2, h3, h4 { + font-weight: bold; + } - @include media-query($on-laptop) { - font-size: 28px; - } + h1 { + font-size: 24px; } - h3 { - font-size: 26px; + h2 { + font-size: 19px; + } - @include media-query($on-laptop) { - font-size: 22px; - } + h3 { + font-size: 16px; } h4 { - font-size: 20px; - - @include media-query($on-laptop) { - font-size: 18px; - } + font-size: 16px; } }