consul/website/source/assets/stylesheets/_docs.scss

#docs-sidebar {
  margin-bottom: 30px;
  margin-top: 50px;

  ul.nav.docs-sidenav {
    display: block;
    padding-bottom: 15px;

    li {
      a {
        color: $sidebar-link-color;
        font-size: $sidebar-font-size;
        padding: 10px 0 10px 15px;

        &:before {
          color: $sidebar-link-color-active;
          content: '\203A';
          font-size: $font-size;
          left: 0;
          line-height: 100%;
          opacity: 0.4;
          position: absolute;

          height: 100%;
          width: 8px
        }

        &:focus,
        &:hover {
          background-color: transparent;
          color: $sidebar-link-color-hover;

          &:before {
            opacity: 1;
          }
        }
      }

      // For forcing sub-navs to appear - in the long term, this should not
      // be a thing anymore...
      > ul.nav-visible {
        display: block;
      }
    }

    li.active {
      > a {
        color: $sidebar-link-color-active;

        &:before {
          opacity: 1;
        }
      }

      // Open nested navigations
      > ul.nav {
        display: block;
      }
    }

    // subnav
    ul.nav {
      display: none;
      margin: 10px;

      li {
        margin-left: 10px;

        a {
          padding: 6px 15px;
        }
      }
    }
  }
}

#docs-tiles {
  display: grid;
  grid-template-columns: auto auto auto;
  grid-column-gap: 2em;

  .docs-tiles-tile {
    border: 1px solid lightgray;
    border-radius: 3px;
    box-shadow: 0px 4px 8px rgba(0, 0, 0, .05);
    padding: 0 40px;

    h3 {
      margin-top: 25px;
    }
  }
}