feat: recent posts section/partial

Jacky Zhao

2022-05-24 0293c122177bf8c595cda8b4dfb513d90b1e6b03

feat: recent posts section/partial

 assets/styles/base.scss

@@ -171,35 +171,6 @@
    opacity: 0.7;
  }

  & > .tags {
    list-style: none;
    padding-left: 0;

    & .meta {
      & > h1 {
        margin: 0;
      }
      & > p {
        margin: 0;
      }
    }

    & > li {
      display: inline-block;
      margin: 0.4em 0;
    }
    & > li > a {
      border-radius: 8px;
      border: var(--outlinegray) 1px solid;
      padding: 0.2em 0.5em;
      &::before {
        content: "#";
        margin-right: 0.3em;
        color: var(--outlinegray);
      }
    }
  }

  & a {
    font-family: Source Sans Pro;
    font-weight: 600;
@@ -223,6 +194,36 @@
  }
}

.tags {
  list-style: none;
  padding-left: 0;

  & .meta {
    & > h1 {
      margin: 0;
    }
    & > p {
      margin: 0;
    }
  }

  & > li {
    display: inline-block;
    margin: 0.4em 0;
  }

  & > li > a {
    border-radius: 8px;
    border: var(--outlinegray) 1px solid;
    padding: 0.2em 0.5em;
    &::before {
      content: "#";
      margin-right: 0.3em;
      color: var(--outlinegray);
    }
  }
}

.backlinks a {
  font-weight: 600;
  font-size: 0.9rem;
@@ -590,3 +591,5 @@
    padding: 0 1em;
  }
}



 data/config.yaml

@@ -5,6 +5,7 @@
enableLatex: true
enableSPA: true
enableContextualBacklinks: true
enableRecentNotes: false
description:
  Host your second brain and digital garden for free. Quartz features extremely fast full-text search,
  Wikilink support, backlinks, local graph, tags, and link previews.

 layouts/index.html

@@ -15,6 +15,9 @@
    <article>
        {{partial "toc.html" .}}
        {{partial "textprocessing.html" . }}
        {{if $.Site.Data.config.enableRecentNotes}}
          {{partial "recent.html" . }}
        {{end}}
    </article>
    {{partial "footer.html" .}}
</div>

 layouts/partials/page-list.html

@@ -4,11 +4,17 @@
        <div class="section">
            <div class="desc">
                <h3><a href="{{ .Permalink }}">{{- .Title -}}</a></h3>
                <ul class="tags">
                    {{ range (.GetTerms "tags") }}
                    <li><a href="{{ .Permalink }}">{{ .LinkTitle | title}}</a></li>
                    {{ end }}
                </ul>
                <p>{{- .Summary -}}{{if .Truncated}}...{{end}}</p>
            </div>
            <p class="meta">
                {{ .ReadingTime }} minute read. Last updated {{if ne .Date .Lastmod}}{{ .Lastmod.Format "January 2, 2006" }}{{else}}Unknown{{end}}
            </p>

        </div>
    </li>
    {{- end -}}

 layouts/partials/recent.html

New file
@@ -0,0 +1,12 @@
<div class="content-list">
  <h2>Recent Notes</h2>
  <!--
  You can also configure this to find related pages!
  All you need to pass into the "page-list.html" partial
  is a collection of pages.
  https://gohugo.io/content-management/related/
  -->
  {{$notes := .Site.RegularPages}}
  {{partial "page-list.html" (first 3 $notes)}}
</div>