Consider showing ESM releases

[Christian Ehrhardt ]

The code already processes and renders the ESM releases, like right now Trusty, Xenial and Bionic.
But to avoid visual clutter those have usually been removed from the search overview
  e.g.: https://manpages.ubuntu.com/cgi-bin/search.py?q=ua
As well as in the top NavBar

The content is there, if you exchange the release in
  https://manpages.ubuntu.com/manpages/focal/en/man1/ua.1.html
to trusty like
  https://manpages.ubuntu.com/manpages/trusty/en/man1/ua.1.html
you get the right content

We might need a tweaked UI, the search and nav bar currently have:
- up to 3 active LTS (two released, one in the making)
- up to 2 -dev releases

Interim releases that go end of life are fine to be removed IMHO.
But LTS that go into ESM should stay.

Thereby adding potentially up to 3 more EMS-LTS.

I'm not sure if the search results and nav bar would work well with up to 8 entries ... :-/ ?
Sorting that is the actual effort to unblock and act on this.

[Anthony Dillon (ya-bo-ng)]

I do have some ideas. Maybe we could collapse the type of release under a dropdown. Documented here:
https://vanillaframework.io/docs/patterns/navigation#dropdown

To achieve this we would need to upgrade the version of Vanilla used to the latest one. Which would involve changing the header of the site from:
<link rel="stylesheet" href="https://assets.ubuntu.com/v1/vanilla-framework-version-1.8.1.min.css">
to
<link rel="stylesheet" href="https://assets.ubuntu.com/v1/vanilla-framework-version-4.7.0.min.css">

This would result in the site looking like the attachment screenshot.

The code to replicate the attached screenshot:
```
<header id="navigation" class="p-navigation is-dark">
  <div class="p-navigation__row--25-75">
    <div class="p-navigation__banner">
      <div class="p-navigation__tagged-logo">
        <a class="p-navigation__link" href="#">
          <div class="p-navigation__logo-tag">
            <img class="p-navigation__logo-icon" src="https://assets.ubuntu.com/v1/82818827-CoF_white.svg" alt="">
          </div>
          <span class="p-navigation__logo-title">Ubuntu</span>
        </a>
      </div>
      <ul class="p-navigation__items">
        <li class="p-navigation__item">
          <button class="js-search-button p-navigation__link--search-toggle">
            <span class="p-navigation__search-label">Search</span>
          </button>
        </li>
        <li class="p-navigation__item">
          <button class="js-menu-button p-navigation__link">Menu</button>
        </li>
      </ul>
    </div>
    <nav class="p-navigation__nav" aria-label="Example main">
      <ul class="p-navigation__items">
        <nav class="p-navigation__nav" aria-label="Example main">
      <ul class="p-navigation__items">
        <li class="p-navigation__item">
          <button href="#" class="p-navigation__link">20.04 LTS</button>

        </li><li class="p-navigation__item">
          <button href="#" class="p-navigation__link">22.04 LTS</button>

        </li><li class="p-navigation__item">
          <button href="#" class="p-navigation__link">20.04 LTS</button>

        </li><li class="p-navigation__item">
          <button href="#" class="p-navigation__link">23.10</button>

        </li>
        <li class="p-navigation__item--dropdown-toggle is-active" id="link-3">
          <button href="#link-3-menu" aria-controls="link-3-menu" class="p-navigation__link">ESM-LTS</button>
          <ul class="p-navigation__dropdown" id="link-3-menu" aria-hidden="false">
            <li>
              <a href="#" class="p-navigation__dropdown-item">##.## LTS</a>
            </li>
            <li>
              <a href="#" class="p-navigation__dropdown-item">##.## LTS</a>
            </li>
            <li>
              <a href="#" class="p-navigation__dropdown-item">##.## LTS</a>
            </li>
          </ul>
        </li>
      </ul>
      </nav></ul>
      <ul class="p-navigation__items">
        <li class="p-navigation__item">
          <button class="js-search-button p-navigation__link--search-toggle">
            <span class="p-navigation__search-label">Search</span>
          </button>
        </li>
      <...