Updating latest

Adding cards to search layout
Finishing cards to homepage
This commit is contained in:
2020-06-11 23:21:56 +01:00
parent bd8888720f
commit 220801930c
8 changed files with 100 additions and 58 deletions

View File

@@ -19,27 +19,22 @@
</form>
</div>
</div>
<!-- <div class="search-input-wrap">
<form id="search-form" method="get" action="">
<input id="search" name="q" type="text" />
<br>
<button id="search-button" type="submit" class="button">Search</button>
<a id="search-clear" href="/search/">Clear</a>
</form>
</div> -->
<br>
<div id="app-search" class="row listrecent"></div>
</div>
</div>
<div id="app-search" class="row listrecent"></div>
<div class="">
<div id="app-search" class="row d-flex justify-content-center justify-content-md-between align-content-between">
</div>
</div>
</div>
<div class="row">
{{ $p := slice }}
{{ range (where .Site.RegularPages "Section" "==" "post") }}
{{ $.Scratch.Set "image" .RelPermalink }}
{{ $.Scratch.Add "image" (index .Params.images 0) }}
{{ $post := dict "link" .RelPermalink "author" (index .Params.authors 0) "tags" .Params.tags "title" .Title "date" (.Params.date.Format "January 2, 2006") "image" ($.Scratch.Get "image") "content" (substr .Plain 0 200) -}}
{{ $post := dict "link" .RelPermalink "author" (index .Params.authors 0) "tags" .Params.tags "title" .Title "date" (.Params.date.Format "January 2, 2006") "image" ($.Scratch.Get "image") "content" (substr .Plain 0 200) "readingtime" .ReadingTime -}}
{{ $p = $p | append $post -}}
{{ end }}
</div>
@@ -73,32 +68,29 @@
console.log(matchPosts[0].tags)
try {
$target.innerHTML = matchPosts.map(p => {
return `<br><div class="col-lg-4 col-md-6 mb-30px card-group">
<div class="card h-100">
<div class="maxthumb">
<a href="${p.link}">
<img class="img-fluid" src="${p.image}" alt="An thumbnail image.">
</a>
</div>
<div class="card-body">
<h2 class="card-title"><a class="text-dark" href="${p.link}">${p.title}</a></h2>
<h5 class="card-text">${p.content}...</h5>
</div>
<div style="padding-right: 10px; padding-left: 10px;" class=>
${
p.tags.map(function (tag) {
return "<span style='white-space: nowrap;'>" + '<i class="fas fa-tag mr-2" style="margin-right: 4px !important; font-size: 0.8em !important;"></i>' + tag + " </span>"}).join('')
}
</div>
<div class="wrapfooter">
<span class="author-meta">
<span class="post-name"><a href="/author/${p.authorurlized}">${p.author}</a></span><br/>
<span class="post-date">${p.date}</span>
</span>
</div>
</div>
</div>
</div>`;
return `
<div class="d-flex flex-column card-regular card-regular-width my-2 my-md-5 mx-0 px-0 align-items-stretch">
<div class="card-regular-image-parent">
<div class="ma-0 pa-0 card-regular-image" style="background-image: url('${p.image}');"></div>
</div>
<div class="mx-3 my-3">
<h5 class="created text-muted text-uppercase font-weight-bold mb-0">${p.date}</h5>
<p class="text-muted">${p.readingtime} min read</p>
<h2><a class="card-title-gray" href="${p.link}">${p.title}</a></h2>
<p>${p.content}...</p>
<div>
<div class="d-flex justify-content-start align-items-stretch">
<div class="tags">
${
p.tags.map(function (tag) {
return "<a class='badge badge-dark mr-2' href='/tags/" + tag.toLowerCase() +"'>" + "<i class='fas fa-tag mr-2'></i>" + tag + "</a>"
}).join('')
}
</div>
</div>
</div>
</div>
</div>`;
}).join('');
} catch (TypeError) {
$target.innerHTML = `<div>No search results found.</div>`;