on master help sign in
search result item is now fully an anchor so you can click anywhere in the designated area to go to the destination of the url
commit3bc3e72f916e8902bcc5d919705ff24121a156b8 authorfriederjanmoerman <hijbrid@gmail.com> dateTue 4 Jun 2019, 22:54 (7 years ago) parent5d2f898
2 files changed+11−7
sass/_main.scss+5−2 static/scripts.js+6−5
sass/_main.scss+5−2
@@ -325,10 +325,14 @@ iframe {
325325
326326.search-results {
327327 max-height: 400px;
328− &__item, &__header {
328+ &__item, &__item a, &__header {
329329 color: #B1B2B3;
330330 }
331331 &__item {
332+ a {
333+ text-decoration: none;
334+ display: block;
335+ }
332336 position: relative;
333337 transition: all 0.1s linear;
334338 padding: 2rem 7rem;
@@ -367,7 +371,6 @@ iframe {
367371 color: #B1B2B3;
368372 font-size: 6rem;
369373 text-transform: capitalize;
370− text-decoration: none;
371374 &__slug-end {
372375 color: #000;
373376 }
static/scripts.js+6−5
@@ -223,20 +223,21 @@ function formatSearchResultTitle(path) {
223223 var lastPartTitle = slugArray.splice(slugArray.length - 2, slugArray.length).join('');
224224 var firstPartTitle = slugArray.join(' / ');
225225
226− console.log(lastPartTitle + " lastPartTitle");
227−
228226 var fullTitle = firstPartTitle + ' / ' + '<span class="search-results__item__title__slug-end">' + lastPartTitle + '</span>';
229− console.log(fullTitle + " fullPartTitle");
230227
231228 return fullTitle;
232229}
233230
234231function formatSearchResultItem(item, terms) {
235232 var li = document.createElement("li");
233+ var createA = document.createElement("a");
234+ li.appendChild(createA);
236235 var teaserTitle = formatSearchResultTitle(item.ref);
237236 li.classList.add("search-results__item");
238− li.innerHTML = `<a class="search-results__item__title" href="${item.ref}">${teaserTitle}</a>`;
239− li.innerHTML += `<div class="search-results__teaser">${makeTeaser(item.doc.body, terms)}</div>`;
237+ var hrefA = item.ref;
238+ createA.setAttribute('href', hrefA);
239+ createA.innerHTML = `<span class="search-results__item__title">${teaserTitle}</span>`;
240+ createA.innerHTML += `<div class="search-results__teaser">${makeTeaser(item.doc.body, terms)}</div>`;
240241 return li;
241242}
242243