xrpl-dev-portal/styles/_side-nav.scss

/* Left/right nav color scheme ------------------------------- */
aside li a {
  color: $white;
  text-decoration: none;
  font-size: 1.05rem;
}
aside .sidenav_cat_title {
  color: $white;
}
aside a:hover,
aside .sidenav_cat_title:hover {
  color: $primary;
}

aside a.active,
aside a.active:hover,
aside .active > a,
aside .active > a:hover {
  color: $primary;
  font-weight: 700;
}
aside a.active-parent {
  font-weight: 700;
}

.command-list li a,
.page-toc li a {
  display: block;
  margin-top: 5px;
  padding: 4px 15px 4px 35px;
  text-indent: -20px;
  font-size: 0.9rem;
}

#page-toc-wrapper .card-body,
.command-list {
  border-left: 1px solid $white;
}

.page-toc .level-1 a {
  color: $white;
}

.page-toc .level-3 {
  padding-left: 16px;
  border-left: 1px solid $white;
  margin-bottom: 0;
  padding-bottom: 5px;
}

.page-toc .level-3 a {
  margin-top: 0;
  padding-bottom: 5px;
}

.command-list li a:hover,
.page-toc li a:hover {
  text-decoration: none;
  border-left: 1px solid $primary;
  padding-left: 34px;
}
.command-list .active a {
  border-left: 2px solid $primary;
  padding-left: 33px;
}

.right-sidebar {
  padding: 44px 0 24px 48px;
}

/* Left navigation -----------------------------------------------------------*/

.nav-toggler {
  position: absolute;
  @include caret(down);
  width: 1.75em;
  height: 1.75em;
  line-height: 0;
  display: grid;
  justify-content: center;
  align-content: center;

  &::after {
    transition-duration: 0.3s;
  }
  &.collapsed::after {
    transform: rotate(-90deg);
  }
}

.dactyl-tree-nav {
  padding: 44px 24px 48px 0;
  position: relative;

  nav {
    margin-left: 1rem;
    padding-left: 0;
    border-left: 1px solid $white;

    .nav-link:hover,
    .nav-link:active {
      border-left: 1px solid $primary;
      margin-left: -1px;
    }

    .active > .nav-link, {
      border-left: 2px solid $primary;
      margin-left: -1px;
      padding-left: calc(1rem - 1px);
    }
  }

  .nav-item {
    position: relative;

    .nav-link {
      padding: 0.25rem 1rem;
      font-size: 0.9rem;
    }
    &.nav-parent .nav-link {
      padding-left: 0;
      font-size: 1.125rem;
    }

    .nav-toggler + .nav-link {
      padding-left: 2rem;
    }
  }

  > .nav-item {
    padding: .5rem 0;
    font-size: 1.125rem;

    > .nav-link {
      font-weight: bold;
    }
  }

  .collapsing.nav {
    // Fix for weird folding behavior in collapse animation.
    flex-wrap: unset;
  }
}


/* Right navigation --------------------------------------------------------- */

#page-toc-wrapper .card {
  position: sticky;
  max-height: 85vh;
  top: 48px;
  overflow: auto;
  padding: 44px 0 48px 24px;
  border: none;
}
.command-list {
  padding: 16px;
}

#page-toc-wrapper .card-header {
  border-bottom: none;
  font-weight: bold;
  font-size: 14px;
  padding: 10px 0;
}

#page-toc-wrapper .card-header h4 {
  line-height: 20px;
  font-size: 1.2em;
  padding: 0;
  margin: 0;
}

#page-toc-wrapper .card-body {
  padding: 0 0 0 16px;
  list-style-type: none;
}

.page-toc li,
.command-list li {
  list-style-type: none;
  margin-bottom: 8px;
  margin-left: 0;
}

.page-toc .level-1 a,
.command-list .separator {
  font-weight: 700;
  font-family: "Space Mono", monospace;
}
.page-toc .level-2,
.command-list .method {
  margin-left: 0;
}