|
23 | 23 |
|
24 | 24 | const hitTemplate = function(hit){
|
25 | 25 | let isCover = hit.cover;
|
26 |
| - let articleClass = "post-card"; |
| 26 | + let articleClass = "post-card home-template"; |
27 | 27 | if(!isCover) articleClass += " no-image";
|
28 | 28 |
|
29 | 29 | const title = hit._highlightResult.title.value;
|
30 | 30 | const content = hit._highlightResult.html.value;
|
31 | 31 | console.log(hit._highlightResult);
|
32 | 32 | let template = `<article class="${articleClass}">`
|
33 | 33 | if(isCover){
|
34 |
| - template += ` <a class="post-card-image-link" href="{{ site.baseurl }}${hit.url.substring(1)}"> |
35 |
| - <div class="post-card-image" style="background-image: url({{ site.baseurl }}${ hit.cover })"></div> |
36 |
| - </a>`; |
| 34 | + template += ` |
| 35 | + <a class="post-card-image-link" href="{{ site.baseurl }}${hit.url.substring(1)}"> |
| 36 | + <div class="post-card-image" style="background-image: url({{ site.baseurl }}${ hit.cover })"></div> |
| 37 | + </a>`; |
37 | 38 | }
|
38 |
| - |
39 |
| - template += `<div class="post-card-content"> |
40 |
| - <div class="post-card-content-link"> |
41 |
| - <header class="post-card-header">`; |
| 39 | + |
| 40 | + template += ` |
| 41 | + <div class="post-card-content"> |
| 42 | + <div class="post-card-content-link"> |
| 43 | + <header class="post-card-header">`; |
42 | 44 |
|
43 | 45 | let date = '';
|
44 | 46 | if (hit.date) {
|
45 |
| - date = moment.unix(hit.date).format('MMM D, YYYY'); |
46 |
| - template += `<time class="post-card-tags-date" datetime="{{ page.date | date:'%e %B %Y' }}">${date}</time>`; |
| 47 | + date = moment.unix(hit.date).format('D MMMM YYYY'); |
| 48 | + template += ` |
| 49 | + <time class="post-card-tags-date" datetime="{{ page.date | date:'%e %B %Y' }}">${date}</time>`; |
47 | 50 | }
|
48 |
| - |
| 51 | + |
49 | 52 | if('tags' in hit && hit.tags.length){
|
50 |
| - template += `<span class="post-card-tags-date">/</span>`; |
| 53 | + template += ` |
| 54 | + <span class="post-card-tags-date">/</span>`; |
51 | 55 | for(tag_index in hit.tags){
|
52 | 56 | if(tag_index == hit.tags.length-1)
|
53 |
| - template += `<a class="post-card-tags-date" href='{{ site.baseurl }}tag/${hit.tags[tag_index]}/'>${hit.tags[tag_index]}</a>`; |
| 57 | + template += ` |
| 58 | + <a class="post-card-tags-date" href='{{ site.baseurl }}tag/${hit.tags[tag_index]}/'>${hit.tags[tag_index]}</a>`; |
54 | 59 | else
|
55 |
| - template += `<a class="post-card-tags-date" href='{{ site.baseurl }}tag/${hit.tags[tag_index]}/'>${hit.tags[tag_index]},</a>`; |
56 |
| - |
| 60 | + template += ` |
| 61 | + <a class="post-card-tags-date" href='{{ site.baseurl }}tag/${hit.tags[tag_index]}/'>${hit.tags[tag_index]},</a>`; |
57 | 62 | }
|
58 | 63 | }
|
59 | 64 |
|
60 |
| - template += `</header> |
61 |
| - <header class="post-card-header"> |
62 |
| - <h2 class="post-card-title">${ title }</h2> |
63 |
| - </header> |
64 |
| - <section class="post-card-excerpt"> |
65 |
| - <p>${ content }...</p> |
66 |
| - </section> |
67 |
| - </div> |
68 |
| - <footer class="post-card-meta"> |
69 |
| - </footer> |
70 |
| - </div> |
71 |
| - </article>`; |
| 65 | + template += ` |
| 66 | + </header> |
| 67 | + <header class="post-card-header"> |
| 68 | + <h2 class="post-card-title">${ title }</h2> |
| 69 | + </header> |
| 70 | + <section class="post-card-excerpt"> |
| 71 | + ${ content } |
| 72 | + </section> |
| 73 | + </div> |
| 74 | + <footer class="post-card-meta"> |
| 75 | + </footer> |
| 76 | + </div> |
| 77 | + </article>`; |
72 | 78 |
|
73 | 79 | return template;
|
74 | 80 | };
|
75 |
| - |
| 81 | + |
76 | 82 | search.addWidget(
|
77 | 83 | instantsearch.widgets.hits({
|
78 |
| - container: '#search-hits', |
| 84 | + container: '#search-hits', |
79 | 85 | templates: {
|
80 | 86 | item: hitTemplate,
|
81 | 87 | empty: function(data){
|
|
0 commit comments