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 %}&nbsp;{% 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 %}&nbsp;{% 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>