Merge pull request #9 from UCLH-Foundry/fix-search-cards

Fix project cards in search
SAFEHR-data · Dec 15, 2023 · a127482 · a127482
2 parents 6a062ef + 010a9a8
commit a127482
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 10 deletions.
diff --git a/assets/js/search.js b/assets/js/search.js
@@ -12,7 +12,8 @@
           var context = {
             title: item.title,
             url: item.url,
-            summary: item.content.substring(0, 200)
+            summary: item.content.substring(0, 200),
+            authors: item.authors
           };
           var html = template(context);
           searchResults.innerHTML += html

diff --git a/search.html b/search.html
@@ -10,7 +10,7 @@
     {%- for project in site.projects -%}
       "{{ project.url | slugify }}": {
         "title": "{{ project.title | xml_escape }}",
-        "authors": "{{ project.authors | join | replace: '_', ' ' | xml_escape }}",
+        "authors": "{{ project.authors | join: ", " | xml_escape }}",
         "category": "{{ project.category | xml_escape }}",
         "content": {{ project.content | strip_html | strip_newlines | jsonify }},
         "url": "{{ project.url | xml_escape }}"
@@ -22,14 +22,23 @@
 {% raw %}
 <script id="resultTemplate" type=""text/x-handlebars-template">
     <div class="col">
-    <div class="card mb-3" style="height: 18rem;">
-        <h5 class="card-header">{{title}}</h5>
-        <div class="card-body">
-            <p class="card-text">{{summary}}</p>
-        </div>
-        <div class="card-footer">
-            <a href="{{url}}" class="btn btn-outline-primary">Details</a>
-        </div>
+    <div class="card mb-3 project-card" style="height: 18rem;">
+      <div class="card-header">
+			  <h5>{{title}}</h5>
+        <small class="text-muted">
+          {{#if authors}}
+            <span itemprop="author" itemscope itemtype="http://schema.org/Person">
+					    <span class="p-author h-card" itemprop="name">{{ authors }}</span>
+            </span>
+          {{/if}}
+			  </small>
+      </div>
+      <div class="card-body">
+          <p class="card-text">{{summary}}</p>
+      </div>
+      <div class="card-footer">
+          <a href="{{url}}" class="btn btn-outline-primary">Details</a>
+      </div>
     </div>
     </div>
 </script>