daniel/Personal_Website
0
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Refactor and add list of snippets

Browse Source
This commit is contained in:
Daniel_I_Am 2022-06-11 16:48:58 +02:00
parent 8f9c3137e7
commit c1783b4a10
3 changed files with 57 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
layouts/index.html
View File

@ -1,24 +1,6 @@
{{ define "main" }}
<section class="blog-recent">
<div class="header">
<h3>Latest Articles</h3>
<div class="all-articles">
<a href="javascript:void(0)">All articles</a>
</div>
</div>
<div class="list">
<ul class="blog-items">
{{ range ( first 3 (where .Site.RegularPages "Type" "snippets").ByDate.Reverse ) }}
<li class="blog-item" data-href="{{ .Permalink }}">
<img class="article-image" src="//via.placeholder.com/128" alt="Article Topic">
<div class="article-text">
<h4 class="article-title">{{ .Title }}</h4>
<span class="article-date">{{ .Date.Format "January 2, 2006" }}</span>
</div>
</li>
{{ end }}
</ul>
</div>
{{ partial "snippet-list" (dict "showAllArticles" true) }}
</section>
{{ end }}
@ -48,4 +30,4 @@
</li>
</ul>
</section>
{{ end }}
{{ end }}

22
layouts/partials/snippet-list.html Normal file
View File

@ -0,0 +1,22 @@
<div class="header">
<h3>Latest Articles</h3>
{{ if index $ "showAllArticles" }}
<div class="all-articles">
<a href="javascript:void(0)">All articles</a>
</div>
{{ end }}
</div>
<div class="list">
<ul class="blog-items">
{{ range ( first 3 (where site.RegularPages "Type" "snippets").ByDate.Reverse ) }}
<li class="blog-item" data-href="{{ .Permalink }}">
<img class="article-image" src="//via.placeholder.com/128" alt="Article Topic">
<div class="article-text">
<h4 class="article-title">{{ .Title }}</h4>
<span class="article-date">{{ .Date.Format "January 2, 2006" }}</span>
</div>
</li>
{{ end }}
</ul>
</div>

33
layouts/snippets/list.html Normal file
View File

@ -0,0 +1,33 @@
{{ define "main" }}
<section class="blog-recent">
{{ partial "snippet-list" (dict) }}
</section>
{{ end }}
{{ define "aside" }}
<section class="blog-popular">
<h3>Popular content</h3>
<ul class="popular-items">
<li>
<span class="arrow"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span>
<a class="link" href="#">Lorem ipsum dolor sit, amet consectetur adipisicing.</a>
</li>
<li>
<span class="arrow"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span>
<a class="link" href="#">Lorem ipsum dolor sit.</a>
</li>
<li>
<span class="arrow"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span>
<a class="link" href="#">Lorem ipsum dolor sit, amet consectetur adipisicing.</a>
</li>
<li>
<span class="arrow"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span>
<a class="link" href="#">Lorem ipsum dolor sit, amet consectetur adipisicing.</a>
</li>
<li>
<span class="arrow"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="5" y1="12" x2="19" y2="12"></line><polyline points="12 5 19 12 12 19"></polyline></svg></span>
<a class="link" href="#">Lorem ipsum dolor sit, amet consectetur adipisicing.</a>
</li>
</ul>
</section>
{{ end }}