Search progress 🔎

This commit is contained in:
Eduardo Gomez 2019-02-20 13:13:59 +01:00
parent 4d4059bb1a
commit 73a21a3bac
4 changed files with 62 additions and 10 deletions

File diff suppressed because one or more lines are too long

View file

@ -22,6 +22,9 @@
{{{body}}} {{{body}}}
</main> </main>
{{!-- Search form --}}
{{> search}}
{{!-- The footer --}} {{!-- The footer --}}
{{> footer}} {{> footer}}

View file

@ -20,8 +20,8 @@
<section class="m-recent-articles"> <section class="m-recent-articles">
<h3 class="m-submenu-title in-recent-articles">Recent articles</h3> <h3 class="m-submenu-title in-recent-articles">Recent articles</h3>
<div class="js-recent-articles"> <div class="js-recent-articles">
{{#get "posts" limit="4" order="published_at desc" as |post|}} {{#get "posts" limit="4" order="published_at desc"}}
{{#post}} {{#foreach posts}}
<div> <div>
<a href="{{url}}" class="m-recent-article"> <a href="{{url}}" class="m-recent-article">
<div class="m-recent-article__picture"> <div class="m-recent-article__picture">
@ -31,21 +31,25 @@
<span class="m-recent-article__date">{{date published_at timeago="true"}}</span> <span class="m-recent-article__date">{{date published_at timeago="true"}}</span>
</a> </a>
</div> </div>
{{/post}} {{else}}
<div class="m-no-found in-recent-articles">No recent articles found :(</div>
{{/foreach}}
{{/get}} {{/get}}
</div> </div>
</section> </section>
<section class="m-tags"> <section class="m-tags">
<h3 class="m-submenu-title">Tags</h3> <h3 class="m-submenu-title">Tags</h3>
{{#get "tags" limit="10"}}
<ul> <ul>
{{#get "tags" limit="10" as |tag|}} {{#foreach tags}}
{{#tag}}
<li> <li>
<a href="{{url}}">{{name}}</a> <a href="{{url}}">{{name}}</a>
</li> </li>
{{/tag}} {{else}}
{{/get}} <li class="m-no-found">No tags found :(</li>
{{/foreach}}
</ul> </ul>
{{/get}}
</section> </section>
</div> </div>
</div> </div>

45
partials/search.hbs Normal file
View file

@ -0,0 +1,45 @@
<section class="m-search js-search">
<button class="m-icon-button outlined as-close-search js-close-search" aria-label="Close search">
<span class="icon-close"></span>
</button>
<div class="m-search__content">
<form class="m-search__form">
<fieldset>
<span class="icon-search m-search-icon"></span>
<input type="text" class="m-input in-search js-input-search" placeholder="Type to search">
</fieldset>
</form>
<article class="m-result">
<a href="#" class="m-result__link">
<h3 class="m-result__title">
Creating Remarkable Poster Prints Through 4 Color Poster Printing
</h3>
<span class="m-result__date">15 Mar 2018</span>
</a>
</article>
<article class="m-result">
<a href="#" class="m-result__link">
<h3 class="m-result__title">
A Beginners Guide To Chinese Cookery
</h3>
<span class="m-result__date">12 Jun 2018</span>
</a>
</article>
<article class="m-result">
<a href="#" class="m-result__link">
<h3 class="m-result__title">
How To Become Top Fashion Designer
</h3>
<span class="m-result__date">20 Mar 2018</span>
</a>
</article>
<article class="m-result last">
<a href="#" class="m-result__link">
<h3 class="m-result__title">
Change Your Mind Change Your Luck
</h3>
<span class="m-result__date">12 Dec 2018</span>
</a>
</article>
</div>
</section>