Add article images.

examples/docs/content/blog/introducing-elm-pages.md

@@ -4,6 +4,7 @@
   "author": "Dillon Kearns",
   "title": "Introducing elm-pages 🚀 - a type-centric static site generator",
   "description": "Elm is the perfect fit for a static site generator. Learn about some of the features and philosophy behind elm-pages.",
+  "image": "/images/article-covers/introducing-elm-pages.jpg",
   "published": "2019-09-21",
 }
 ---

examples/docs/content/blog/types-over-conventions.md

@@ -4,6 +4,7 @@
   "author": "Dillon Kearns",
   "title": "Types Over Conventions",
   "description": "How elm-pages approaches configuration, using type-safe Elm.",
+  "image": "/images/article-covers/introducing-elm-pages.jpg",
   "published": "2019-09-21",
 }
 ---

examples/docs/gen/Pages.elm

@@ -100,7 +100,11 @@ pages =
     }
 
 images =
-    { author =
+    { articleCovers =
+        { introducingElmPages = (buildImage [ "article-covers", "introducing-elm-pages.jpg" ])
+        , directory = directoryWithoutIndex ["articleCovers"]
+        }
+    , author =
         { dillon = (buildImage [ "author", "dillon.jpg" ])
         , directory = directoryWithoutIndex ["author"]
         }
@@ -114,7 +118,8 @@ images =
 
 allImages : List (ImagePath PathKey)
 allImages =
-    [(buildImage [ "author", "dillon.jpg" ])
+    [(buildImage [ "article-covers", "introducing-elm-pages.jpg" ])
+    , (buildImage [ "author", "dillon.jpg" ])
     , (buildImage [ "compiler-error.png" ])
     , (buildImage [ "elm-logo.svg" ])
     , (buildImage [ "github.svg" ])
@@ -154,13 +159,13 @@ content =
     } )
   ,
   ( ["blog", "introducing-elm-pages"]
-    , { frontMatter = """{"type":"blog","author":"Dillon Kearns","title":"Introducing elm-pages 🚀 - a type-centric static site generator","description":"Elm is the perfect fit for a static site generator. Learn about some of the features and philosophy behind elm-pages.","published":"2019-09-21"}
+    , { frontMatter = """{"type":"blog","author":"Dillon Kearns","title":"Introducing elm-pages 🚀 - a type-centric static site generator","description":"Elm is the perfect fit for a static site generator. Learn about some of the features and philosophy behind elm-pages.","image":"/images/article-covers/introducing-elm-pages.jpg","published":"2019-09-21"}
 """ , body = Nothing
     , extension = "md"
     } )
   ,
   ( ["blog", "types-over-conventions"]
-    , { frontMatter = """{"type":"blog","author":"Dillon Kearns","title":"Types Over Conventions","description":"How elm-pages approaches configuration, using type-safe Elm.","published":"2019-09-21"}
+    , { frontMatter = """{"type":"blog","author":"Dillon Kearns","title":"Types Over Conventions","description":"How elm-pages approaches configuration, using type-safe Elm.","image":"/images/article-covers/introducing-elm-pages.jpg","published":"2019-09-21"}
 """ , body = Nothing
     , extension = "md"
     } )

examples/docs/src/Main.elm

@@ -161,6 +161,7 @@ pageView model siteMetadata page =
                             ]
                             :: (publishedDateView metadata |> Element.el [ Font.size 16, Font.color (Element.rgba255 0 0 0 0.6) ])
                             :: Palette.blogHeading metadata.title
+                            :: articleImageView metadata.image
                             :: Tuple.second page.view
                         )
                     ]
@@ -224,6 +225,14 @@ pageView model siteMetadata page =
             }
 
 
+articleImageView : ImagePath Pages.PathKey -> Element msg
+articleImageView articleImage =
+    Element.image [ Element.width Element.fill ]
+        { src = ImagePath.toString articleImage
+        , description = "Article cover photo"
+        }
+
+
 header : PagePath Pages.PathKey -> Element msg
 header currentPath =
     Element.column [ Element.width Element.fill ]
@@ -334,7 +343,7 @@ head metadata =
                 { canonicalUrlOverride = Nothing
                 , siteName = "elm-pages"
                 , image =
-                    { url = Pages.images.icon
+                    { url = meta.image
                     , alt = meta.description
                     , dimensions = Nothing
                     , mimeType = Nothing

examples/docs/src/Metadata.elm

@@ -24,6 +24,7 @@ type alias ArticleMetadata =
     , description : String
     , published : Date
     , author : Data.Author.Author
+    , image : ImagePath Pages.PathKey
     }
 
 
@@ -60,7 +61,7 @@ decoder =
                             |> Decode.map Author
 
                     "blog" ->
-                        Decode.map4 ArticleMetadata
+                        Decode.map5 ArticleMetadata
                             (Decode.field "title" Decode.string)
                             (Decode.field "description" Decode.string)
                             (Decode.field "published"
@@ -77,6 +78,7 @@ decoder =
                                 )
                             )
                             (Decode.field "author" Data.Author.decoder)
+                            (Decode.field "image" imageDecoder)
                             |> Decode.map Article
 
                     _ ->