layout: page
<style type=“text/css”>
#search-input { display: inline-block; color: #008989; background-color: #12161d; border-color: #223333; padding: .5em; width: 100%; font-size: 0.8em; } #search-input:focus { display: inline-block; color: #ddd; background-color: #12161d; border-color: #223333; border-width: thick; border-style: outset; box-shadow: -1px 1px 5px 5px #008989; outline: 0; width: 100%; font-size: 0.8em; } </style>
<!– Html Elements for Search –> <input type=“text” id=“search-input” placeholder=“Enter keywords…”> <ul id=“results-container” style=“list-style-type: none;”></ul>
<!– Script pointing to jekyll-search.js –> <script src=“{{ site.baseurl }}/assets/js/jekyll-search.js” type=“text/javascript”></script>
<script type="text/javascript"> SimpleJekyllSearch({ searchInput: document.getElementById('search-input'), resultsContainer: document.getElementById('results-container'), json: '{{ site.baseurl }}/search.json', searchResultTemplate: '<li><a href="{url}" title="{desc}">{title}</a></li>', noResultsText: 'No results found', limit: 10, fuzzy: true, exclude: ['Welcome'] }) </script>
<div id="tags"> <h5>tag cloud</h5> {% assign tags = site.tags | sort %}
{% for tag in tags %}
<span class="site-tag"> <a href="{{ site.baseurl }}/tag/{{ tag | first | slugify }}/" style="font-size: {{ tag | last | size | times: 4 | plus: 80 }}%"> {{ tag[0] | replace:'-', ' ' }} ({{ tag | last | size }}) </a>
</span>{% unless forloop.last %} {% endunless %}{% endfor %}
</div>
<style> .site-tag a {
display: inline-block; margin-right: 12px;
} </style>
<div id="categories"> <h5>categories</h5> {% assign categories = site.categories | sort %}
{% for category in categories %}
<span class="site-category"> <a href="{{ site.baseurl }}/{{ category | first | slugify }}/"> {{ category[0] | replace:'-', ' ' }} ({{ category | last | size }}) </a>
</span>{% unless forloop.last %} {% endunless %}{% endfor %}
</div>
<h6>Image Source: <a href=“UNSPLASHunsplash.com/photos/I_LgQ8JZFGE”>UNSPLASH>
<style> .site-category a {
display: inline-block; margin-right: 12px;
} </style>