Merge pull request #87 from noesya/feature/post-author

Feature/post author

assets/sass/_theme/_utils.sass

@@ -196,6 +196,14 @@
         color: $color-text-alt
         display: block
 
+@mixin post-time-author-flex
+    .post-meta
+        display: flex
+        flex-wrap: wrap
+    .post-author p::before
+        content: ' • '
+
+
 @mixin list-section
     @include list-reset
     > li

assets/sass/_theme/blocks/posts.sass

@@ -17,6 +17,8 @@
                 margin-top: $spacing0
             .media
                 margin-top: 0
+        @include post-time-author-flex
+
     &--grid
         @include media-breakpoint-down(desktop)
             article + article
@@ -40,25 +42,21 @@
             article
                 position: relative
                 padding-bottom: half($spacing3)
-                // display: flex
-                // flex-direction: row
                 + article
                     margin-top: half($spacing3)
                 .post-content
                     display: flex
                     flex-direction: column
-                    // width: 70%
+                    padding-top: $spacing0
                     h3
                         margin-bottom: 0
-                    time
-                        margin-top: half($spacing0)
-                        order: 2
-                    p
+                    .post-categories
+                        margin-bottom: 0
+                    p[itemprop="articleBody"]
                         margin-top: half($spacing0)
-                        order: 4
                 .media
-                    display: none
-                    order: 3
+                    order: -1
+                    max-width: 33%
 
         @include in-page-with-sidebar
             article
@@ -88,7 +86,7 @@
                         margin-left: $grid-gutter
                     + article
                         margin-top: $spacing3
-                    time
+                    .post-meta
                         position: absolute
                         right: 0
                         top: 0
@@ -131,19 +129,24 @@
                         grid-column: 1 / 7
                     .post-categories
                         grid-column: 1 / 7
-                    time
+                    .post-meta
                         grid-row: 1
                         grid-column: 7 / 9
                         text-align: right
                         order: 2
+                        display: block
                         margin-top: 0
-                    p
+                        .post-author p::before
+                            content: ''
+                    p[itemprop="articleBody"]
                         grid-column: 1 / 7
                         order: 3
         
         @include media-breakpoint-down(desktop)
             .list
                 border-top: 1px solid $color-border
+                p[itemprop="articleBody"]
+                    margin-top: 0
 
         @include media-breakpoint-up(desktop)
             .highlight

assets/sass/_theme/sections/posts.sass

@@ -2,6 +2,8 @@
     @include article($post-media-background)
     time
         color: $post-time-color
+        display: inline-block
+        vertical-align: middle
     .post-categories
         @include meta
         margin-top: $spacing0
@@ -15,12 +17,14 @@
             @include link($color-accent)
         li
             margin: 0
+    .post-author
+        @include meta
+        color: $color-text-alt
 
 .posts__section,
 .authors__term,
 .categories__term,
 .persons__page
-
     .posts--list
         article
             border-bottom: 1px solid $color-border
@@ -34,7 +38,7 @@
                 @include grid
                 margin-bottom: $spacing3
                 padding-bottom: $spacing3
-            div:not(.media)
+            .post-content
                 grid-column: 4/13
                 @include media-breakpoint-down(desktop)
                     flex: 1
@@ -52,19 +56,25 @@
                 &, img
                     aspect-ratio: auto
             @include media-breakpoint-up(desktop)
-                time 
-                    font-size: $h5-size
+                .post-meta
                     position: absolute
                     right: 0
+                    text-align: right
                     top: 0
-                div:not(.media)
+                    time
+                        font-size: $h5-size
+                .post-content
                     h2, h3,
-                    p
+                    > p
                         max-width: col(6, 9)
     .posts--grid
         @include grid(1)
         @include grid(2, desktop)
         @include grid($posts-grid-columns, xxl)
+        .post
+            @include post-time-author-flex
+            .post-meta
+                margin-top: $spacing0
 
 .posts__page
     @include media-breakpoint-down(desktop)

config.yaml

@@ -9,6 +9,7 @@ params:
   posts:
     index:
       show_categories: false
+      show_author: false
       truncate_description: 200 # Set to 0 to disable truncate
       layout: list # grid | list
   pages:

layouts/partials/blocks/templates/posts.html

@@ -28,7 +28,6 @@
                 "link" $title_link
                 ) }}
             {{ end -}}
-
           </div>
         {{- end }}
 

layouts/partials/blocks/templates/posts/highlight.html

@@ -34,7 +34,13 @@
                   <p itemprop="articleBody">{{ partial "PrepareText" .Params.summary }}</p>
                 {{ end }}
               {{- end -}}
-              <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format ":date_long" }}</time>
+
+              <div class="post-meta">
+                <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format ":date_long" }}</time>
+                {{ if site.Params.posts.index.show_author }}
+                  {{- partial "posts/author" . -}}
+                {{ end }}
+              </div>
             </article>
           {{ end }}
         {{ end }}

layouts/partials/posts/author.html

+{{ range .GetTerms "authors" }}
+  {{- $person := site.GetPage (printf "/persons/%s" .Slug) -}}
+  {{ with $person }}
+    <div class="post-author" itemscope itemtype="https://schema.org/Person" itemprop="author">
+      <p itemprop="name">{{ partial "PrepareText" .Title }}</p>
+    </div>
+  {{ end }}
+{{ end }}
\ No newline at end of file

layouts/partials/posts/post.html

@@ -17,6 +17,7 @@
     {{ if site.Params.posts.index.show_categories }}
       {{- partial "posts/categories" . -}}
     {{ end }}
+
     {{- if (partial "GetTextFromHTML" .Params.summary) -}}
       {{ if site.Params.posts.index.truncate_description }}
         <p itemprop="articleBody">{{ partial "GetTruncateContent" ( dict 
@@ -28,7 +29,14 @@
       {{ end }}
     {{- end -}}
     
-    <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format ":date_long" }}</time>
+    <div class="post-meta">
+      <time itemprop="datePublished" datetime="{{ .Date.Format "2006-01-02T15:04" }}">{{ .Date | time.Format ":date_long" }}</time>
+      {{ if site.Params.posts.index.show_author }}
+        {{- partial "posts/author" . -}}
+      {{ end }}
+    </div>
+
+
   </div>
   <div class="media">
     {{- if .Params.image -}}