restructure article metadata, remove image css

homepage/content/articles/0010-milestone-1.md

@@ -3,13 +3,9 @@ description: Our milestone 1 achievements include extensible architecture, a loc
 date: 2019-12-12
 slug: laying-foundation-for-fair-web-analytics
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0010-milestone1.jpg
+image_url: /theme/images/offen-blog-0010-milestone1.jpg
+author: Hendrik Niefeld
 
-<figure class="larger-image mb5">
-<img alt="Milestone 1 - Laying the foundation for fair web analytics" src="/theme/images/offen-blog-0010-milestone1.jpg"/>
-</figure>
-
-###### 12 Dec 2019, Hendrik Niefeld
 # Episode One — Laying the foundation for fair web analytics
 
 Milestone 1 is completed. This is what we've achieved in the last six weeks.

homepage/content/articles/0020-untold-roads.md

@@ -3,13 +3,9 @@ description: Onboarding users onto a product that is still in development needs
 date: 2020-01-19
 slug: untold-roads-versioning-early-stage-software
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0020-untoldRoads.jpg
+image_url: /theme/images/offen-blog-0020-untoldRoads.jpg
+author: Frederik Ring
 
-<figure class="larger-image mb5">
-<img alt="Untold roads" src="/theme/images/offen-blog-0020-untoldRoads.jpg"/>
-</figure>
-
-###### 19 Jan 2020, Frederik Ring
 # Untold roads to v1.0
 
 After a lot of experimenting, taking detours and having unanticipated revelations while building the foundation for Offen over the last months, the state of the project is starting to settle, and we are eager to get ready for users to install our software, and use it for transparently collecting usage statistics for their websites and applications.

homepage/content/articles/0030-milestone-2.md

@@ -3,13 +3,9 @@ description: Our key milestone 2 features are user consent, improved crypto impl
 date: 2020-01-31
 slug: collecting-data-securely
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0030-milestone-2.jpg
+image_url: /theme/images/offen-blog-0030-milestone-2.jpg
+author: Hendrik Niefeld
 
-<figure class="larger-image mb5">
-<img alt="Milestone 2 - Collecting data securely" src="/theme/images/offen-blog-0030-milestone-2.jpg"/>
-</figure>
-
-###### 31 Jan 2020, Hendrik Niefeld
 # Episode Two  — Collecting data securely
 
 We finished milestone 2. Here is what we' ve been doing for the last 8 weeks.

homepage/content/articles/0040-test-offen-today.md

@@ -3,13 +3,9 @@ description: Help us take a step forward. Download or deploy Offen today and giv
 date: 2020-03-04
 slug: test-offen-today
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0040-test-offen-today.jpg
+image_url: /theme/images/offen-blog-0040-test-offen-today.jpg
+author: Hendrik Niefeld
 
-<figure class="larger-image mb5">
-<img alt="Test Offen today" src="/theme/images/offen-blog-0040-test-offen-today.jpg"/>
-</figure>
-
-###### 04 Mar 2020, Hendrik Niefeld
 # Test Offen today
 
 We’re excited to present our first version that is officially ready for testing.

homepage/content/articles/0050-milestone-3.md

@@ -3,13 +3,9 @@ description: Our milestone 3 achievements include an improved UX, a Heroku deplo
 date: 2020-04-13
 slug: displaying-data
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0050-milestone-3.jpg
+image_url: /theme/images/offen-blog-0050-milestone-3.jpg
+author: Frederik Ring
 
-<figure class="larger-image mb5">
-<img alt="Milestone 3 - Displaying data" src="/theme/images/offen-blog-0050-milestone-3.jpg"/>
-</figure>
-
-###### 14 Apr 2020, Frederik Ring
 # Episode Three  — Displaying data
 
 In the middle of strange times Milestone 3 - "Displaying Data" - is done. This means we focused on how we aggregate and display the data Offen collects in a way that operators can use it to improve their services and users can understand what is being collected and what it means for their privacy.

homepage/content/articles/0060-milestone-4.md

@@ -3,15 +3,10 @@ description: Milestone 4 comes with enhanced account management, UX improvements
 date: 2020-06-09
 slug: managing-data
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0060-milestone-4.jpg
+image_url: /theme/images/offen-blog-0060-milestone-4.jpg
+image_caption: <a class="normal moon-gray" target="_blank" href="https://www.flickr.com/photos/wocintechchat/25926651781/in/album-72157664006621903/">Photo</a> by WOCinTechChat / <a class="normal moon-gray" href="https://creativecommons.org/licenses/by/3.0/" target="_blank">CC BY 3.0</a>
+author: Frederik Ring
 
-<figure class="larger-image mb5">
-<img alt="Milestone 4 - Managing data" src="/theme/images/offen-blog-0060-milestone-4.jpg"/>
-</figure>
-
-##### [Photo](https://www.flickr.com/photos/wocintechchat/25926651781/in/album-72157664006621903/){: target="_blank"} by WOCinTechChat / [CC BY 3.0](https://creativecommons.org/licenses/by/3.0/){: target="_blank"}
-
-###### 09 Jun 2020, Frederik Ring
 # Episode Four  — Managing data
 
 Milestone 4 - "Managing data" - has been an important one for us. Finishing it means Offen is now close to being feature complete in the scope of our initial plans, and we can start transitioning into a Beta state, meaning we can finally offer a stable product for users to use in production environments.

homepage/content/articles/0070-budget.md

@@ -3,13 +3,8 @@ description: Here are some real world options for hosting Offen on a budget. Let
 date: 2020-06-30
 slug: hosting-offen-on-budget
 sitemap_priority: 0.7
-sm_image_url: /theme/images/offen-blog-0070-budget.jpg
+image_url: /theme/images/offen-blog-0070-budget.jpg
-
+author: Frederik Ring
-<figure class="larger-image mb5">
-<img alt="Hosting on a budget" src="/theme/images/offen-blog-0070-budget.jpg"/>
-</figure>
-
-###### 30 Jun 2020, Frederik Ring
 
 # Hosting Offen on a budget
 

homepage/theme/templates/archives.html

@@ -16,7 +16,7 @@
       <div class="mw7 center pt5 pb5 ph3 ph5-ns bg-white">
           <figure class="larger-image mb4">
             <a href="{{ article.slug }}">
-              <img alt="{{ article.title }}" src="{{ article.sm_image_url }}"/>
+              <img alt="{{ article.title }}" src="{{ article.image_url }}"/>
             </a>
           </figure>
           <h1 class="f2 normal lh-title mt3 ma0 mb3 light-silver">

homepage/theme/templates/article.html

@@ -3,8 +3,12 @@
 {% set title = article.title + " | Offen" %}
 {% set description = article.description %}
 {% set href = article.save_as.replace('index.html', '') %}
-{% set sm_image_url = article.sm_image_url %}
+{% set image_url = article.image_url %}
+{% set image_caption = article.image_caption %}
 {% set no_stats = article.no_stats %}
 {% set template = article.template %}
 {% set content = article.content %}
+{% set date = article.date %}
+{% set author = article.author %}
+{% set modified = article.modified %}
 {% set cta_1 = 'true' %}

homepage/theme/templates/base.html

@@ -15,7 +15,7 @@
   <meta property="og:description" content="{{ description }}">
   <meta property="og:type" content="website">
   <meta property="og:url" content="{{ SITEURL }}/{{ href }}">
-  <meta property="og:image" content="{{ SITEURL }}{{ sm_image_url or '/theme/images/offen-logo-social-media.jpg' }}">
+  <meta property="og:image" content="{{ SITEURL }}{{ image_url or '/theme/images/offen-logo-social-media.jpg' }}">
   <meta name="twitter:image:alt" content="Offen logo">
   <meta name="twitter:card" content="summary_large_image">
   {% if template != 'archives' %}
@@ -74,10 +74,27 @@
     </div>
       {% block content %}
         <div class="w-100 mt5-ns gray">
-          <div class="mw7 center pt5 pb5 ph3 ph5-ns bg-white">
+          <div class="mw7 center pb5 bg-white">
+            {% if image_url %}
+              <figure class="ma0">
+                <img alt="{{ title }}" src="{{ image_url }}"/>
+                {% if image_caption %}
+                  <figcaption class="ph3 ph5-ns f7 normal moon-gray">
+                    {{ image_caption }}
+                  </figcaption>
+                {% endif %}
+              </figure>
+            {% endif %}
+            <div class="ph3 ph5-ns mt5">
+              {% if date and author %}
+                <h6 class="f5 lh-solid normal ma0 light-silver">
+                  {{ date | strftime('%d %b %Y') }}{% if modified %}(updated {{ modified | strftime('%d %b %Y') }}){% endif %}, {{ author }}
+                </h6>
+              {% endif %}
               {{ content }}
             </div>
           </div>
+        </div>
       {% endblock %}
 
       {% if funnel != 'true' %}

homepage/theme/templates/page.html

@@ -3,7 +3,7 @@
 {% set title = page.title %}
 {% set description = page.description %}
 {% set href = page.save_as.replace('index.html', '') %}
-{% set sm_image_url = page.sm_image_url %}
+{% set image_url = page.image_url %}
 {% set no_stats = page.no_stats %}
 {% set template = page.template %}
 {% set content = page.content %}