Просмотр исходного кода

feat(page): add author profile

The following boolean (true/false) page params control page features:

- share
- comments
- reading_time
- profile
George Cushen 6 лет назад
Родитель
Сommit
3358904dc3

+ 1 - 0
layouts/_default/single.html

@@ -12,6 +12,7 @@
     </div>
 
     {{ partial "tags.html" . }}
+    {{ partial "page_author.html" . }}
 
     {{ $related := .Site.RegularPages.Related . | first 5 }}
     {{ with $related }}

+ 70 - 4
layouts/partials/css/academic.css

@@ -540,25 +540,28 @@ a[data-fancybox] img {
   margin: 0px 0 10px 0;
 }
 
-#profile ul.network-icon {
+ul.network-icon {
   display: inline-flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: center;
   list-style: none;
   padding: 0;
+}
+
+#profile .network-icon {
   margin-top: 30px;
 }
 
-#profile .network-icon li {
+.network-icon li {
   margin-right: 10px;
 }
 
-#profile .network-icon li:last-of-type {
+.network-icon li:last-of-type {
   margin-right: 0;
 }
 
-#profile .network-icon li:hover {
+.network-icon li:hover {
   transform: scale(1.2)
 }
 
@@ -869,6 +872,69 @@ article .article-metadata {
   }
 }
 
+/*************************************************
+ *  Author profile card
+ **************************************************/
+
+.author-card {
+  margin-top: 1rem;
+  padding-top: 1rem;
+  border-top: 1px solid rgba(0,0,0,.05);
+}
+
+.dark .author-card {
+  border-top: 1px solid rgba(255,255,255,.05);
+}
+
+.author-card .portrait {
+  width: 60px;
+  height: 60px;
+  margin: 0 auto;
+  border-radius: 50%;
+  object-fit: cover;
+}
+
+.author-card .card-title {
+  margin-top: 0;
+  margin-bottom: 15px;
+  font-weight: 600;
+  color: rgba(0, 0, 0, 0.84);
+}
+
+.author-card .card-title a {
+  color: rgba(0, 0, 0, 0.84);
+}
+
+.dark .author-card .card-title,
+.dark .author-card .card-title a {
+  color: rgba(255, 255, 255, 0.84);
+}
+
+.author-card p {
+  margin-bottom: 5px;
+}
+
+.author-card .card-subtitle {
+  font-weight: 300;
+  font-size: 0.8rem;
+  color: rgba(0, 0, 0, 0.54);
+  margin-bottom: 7px;
+}
+
+.dark .author-card .card-subtitle {
+  color: rgba(255, 255, 255, 0.54);
+}
+
+.author-card .card-text {
+  color: rgba(0, 0, 0, 0.76);
+  font-size: 0.8rem;
+  margin-bottom: 4px;
+}
+
+.dark .author-card .card-text {
+  color: rgba(255, 255, 255, 0.76);
+}
+
 /*************************************************
  *  Publications
  **************************************************/

+ 37 - 0
layouts/partials/page_author.html

@@ -0,0 +1,37 @@
+{{ if not (or (eq .Site.Params.profile false) (eq .Params.profile false)) }}
+
+{{ $author := "" }}
+{{ if .Params.authors }}
+  {{ $author = index .Params.authors 0 }}
+{{ end }}
+
+{{/* Display site author if page authors not explicitly specified or if first page author is site author. */}}
+{{ if or (not .Params.authors) (eq $author $.Site.Params.name) }}
+<div class="media author-card" itemscope itemtype="http://schema.org/Person">
+  {{ if $.Site.Params.gravatar }}
+  <img class="portrait mr-3" src="https://s.gravatar.com/avatar/{{ md5 $.Site.Params.email }}?s=200')" itemprop="image" alt="Avatar">
+  {{ else if $.Site.Params.avatar }}
+  <img class="portrait mr-3" src="{{ (printf "img/%s" $.Site.Params.avatar) | relURL }}" itemprop="image" alt="Avatar">
+  {{ end }}
+  <div class="media-body">
+    <h5 class="card-title" itemprop="name"><a href="{{ "/" | relLangURL }}">{{ $.Site.Params.name }}</a></h5>
+    {{ with $.Site.Params.role }}<h6 class="card-subtitle">{{.}}</h6>{{end}}
+    {{ with $.Site.Params.bio }}<p class="card-text" itemprop="description">{{. | markdownify | emojify}}</p>{{end}}
+    <ul class="network-icon" aria-hidden="true">
+      {{ range $.Site.Params.social }}
+      {{ $pack := or .icon_pack "fas" }}
+      {{ $pack_prefix := $pack }}
+      {{ if in (slice "fab" "fas" "far" "fal") $pack }}
+      {{ $pack_prefix = "fa" }}
+      {{ end }}
+      <li>
+        <a itemprop="sameAs" href="{{ .link | safeURL }}" target="_blank" rel="noopener">
+          <i class="{{ $pack }} {{ $pack_prefix }}-{{ .icon }}"></i>
+        </a>
+      </li>
+      {{ end }}
+    </ul>
+  </div>
+</div>
+{{end}}
+{{end}}

+ 3 - 3
layouts/partials/page_metadata.html

@@ -6,7 +6,7 @@
   {{ if $.Params.authors }}
   {{ $authorLen := len $.Params.authors }}
   <div>
-    {{ range $k, $v := $.Params.authors }}
+    {{ range $k, $v := $.Params.authors -}}
     <span itemscope itemprop="author" itemtype="http://schema.org/Person">
       <span itemprop="name">{{- $v -}}</span>
     </span>
@@ -32,14 +32,14 @@
     <meta itemprop="name" content="{{ $.Site.Params.name }}">
   </span>
 
-  {{ if ne $.Site.Params.reading_time false }}
+  {{ if not (or (eq .Site.Params.reading_time false) (eq .Params.reading_time false)) }}
   <span class="middot-divider"></span>
   <span class="article-reading-time">
     {{ $.ReadingTime }} {{ i18n "minute_read" }}
   </span>
   {{ end }}
 
-  {{ $comments_enabled := and $.Site.DisqusShortname (not (or $.Site.Params.disable_comments $.Params.disable_comments)) }}
+  {{ $comments_enabled := and $.Site.DisqusShortname (not (or $.Site.Params.disable_comments (eq $.Params.comments false))) }}
   {{ if and $comments_enabled ($.Site.Params.comment_count | default true) }}
   <span class="middot-divider"></span>
   <a href="{{ $.RelPermalink }}#disqus_thread"><!-- Count will be inserted here --></a>

+ 1 - 1
layouts/partials/share.html

@@ -1,4 +1,4 @@
-{{ if .Site.Params.sharing }}
+{{ if and .Site.Params.sharing (ne .Params.share false) }}
 <div class="share-box" aria-hidden="true">
   <ul class="share">
     <li>

+ 1 - 0
layouts/project/single.html

@@ -15,6 +15,7 @@
     </div>
 
     {{ partial "tags.html" . }}
+    {{ partial "page_author.html" . }}
 
     {{ $page := . }}
     {{ $project := .Slug }}

+ 1 - 0
layouts/publication/single.html

@@ -80,6 +80,7 @@
     <div class="article-style">{{ .Content }}</div>
 
     {{ partial "tags.html" . }}
+    {{ partial "page_author.html" . }}
 
   </div>
 </div>

+ 1 - 0
layouts/talk/single.html

@@ -91,6 +91,7 @@
     </div>
 
     {{ partial "tags.html" . }}
+    {{ partial "page_author.html" . }}
 
   </div>
 </div>