Allow for filtering by categories in the home page

[bartekpacia]

This will probably require ejecting from ssb :( Hugo sounds the least insane and most stable. If I could use TailwindCSS it'd be even better.

In <article class="centered-content"> in index.html add:

<div class="tags-container rainbow">
  <ul class="tags-ul">
    <li class="rainbow-tile">#all</li>
    <li class="rainbow-tile">#tech</li>
    <li class="rainbow-tile">#long</li>
  </ul>
</div>

CSS:

.rainbow {
  background: linear-gradient(
    to right,
    #eb5252,
    #f78f2f,
    #f4c151,
    #75d850,
    #6284ff,
    #eb5252
  ) repeat-x;
  animation: rainbow 10s linear infinite;
  background-size: 200% 100% !important;
}

@keyframes rainbow {
  0% {
    background-position: 0;
  }
  100% {
    background-position: 800% 0;
  }
}

.tags-container {
  display: inline-block;
}

.tags-ul {
  list-style: none;
  padding: 0;
  display: flex;
  margin: 0 1em 0 0;
}

.rainbow-tile {
  background-color: var(--color-background);
  padding: 0.2em 0.4em;
  border-radius: 0.4em;
}

.rainbow-tile:hover {
  background-color: transparent;
}