3bc3e72 · urbit.org · git.iko.soy

git.iko.soy/urbit.org

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

3bc3e72friederjanmoerman7 years ago

sass/_main.scss+5−2

compare with master

unifiedsplit

@@ -325,10 +325,14 @@ iframe {

325

326.search-results {

327 max-height: 400px;

328− &__item, &__header {

328+ &__item, &__item a, &__header {

329 color: #B1B2B3;

330 }

331 &__item {

332+ a {

333+ text-decoration: none;

334+ display: block;

335+ }

332 position: relative;

336 position: relative;

333 transition: all 0.1s linear;

337 transition: all 0.1s linear;

334 padding: 2rem 7rem;

338 padding: 2rem 7rem;

@@ -367,7 +371,6 @@ iframe {

367 color: #B1B2B3;

371 color: #B1B2B3;

368 font-size: 6rem;

372 font-size: 6rem;

369 text-transform: capitalize;

373 text-transform: capitalize;

370− text-decoration: none;

371 &__slug-end {

374 &__slug-end {

372 color: #000;

375 color: #000;

373 }

376 }

static/scripts.js+6−5

@@ -223,20 +223,21 @@ function formatSearchResultTitle(path) {

223 var lastPartTitle = slugArray.splice(slugArray.length - 2, slugArray.length).join('');

224 var firstPartTitle = slugArray.join(' / ');

225

226− console.log(lastPartTitle + " lastPartTitle");

227−

228 var fullTitle = firstPartTitle + ' / ' + '<span class="search-results__item__title__slug-end">' + lastPartTitle + '</span>';

226 var fullTitle = firstPartTitle + ' / ' + '<span class="search-results__item__title__slug-end">' + lastPartTitle + '</span>';

229− console.log(fullTitle + " fullPartTitle");

230

227

231 return fullTitle;

228 return fullTitle;

232}

229}

233

230

234function formatSearchResultItem(item, terms) {

231function formatSearchResultItem(item, terms) {

235 var li = document.createElement("li");

232 var li = document.createElement("li");

233+ var createA = document.createElement("a");

234+ li.appendChild(createA);

236 var teaserTitle = formatSearchResultTitle(item.ref);

235 var teaserTitle = formatSearchResultTitle(item.ref);

237 li.classList.add("search-results__item");

236 li.classList.add("search-results__item");

238− li.innerHTML = `<a class="search-results__item__title" href="${item.ref}">${teaserTitle}</a>`;

237+ var hrefA = item.ref;

238+ createA.setAttribute('href', hrefA);

239+ createA.innerHTML = `<span class="search-results__item__title">${teaserTitle}</span>`;

239− li.innerHTML += `<div class="search-results__teaser">${makeTeaser(item.doc.body, terms)}</div>`;

240+ createA.innerHTML += `<div class="search-results__teaser">${makeTeaser(item.doc.body, terms)}</div>`;

240 return li;

241 return li;

241}

242}

242

243