// Copyright 2017 Palantir Technologies, Inc. All rights reserved.
// Licensed under the Apache License, Version 2.0.

@import "variables";
@import "../../../core/src/components/button/common";

$nav-divider-offset: $pt-grid-size * 5;

@mixin divider-gradient($color, $dark-color) {
  background-image: linear-gradient(to right, rgba($color, 0) 0%, $color 40%);

  .#{$ns}-dark & {
    background-image: linear-gradient(to right, rgba($dark-color, 0) 0%, $dark-color 40%);
  }
}

.docs-nav-button {
  @include pt-flex-container(row, $pt-grid-size + 4px);
  align-items: center;
  cursor: pointer;

  margin-left: -$nav-divider-offset;
  padding: $pt-grid-size $sidebar-padding;
  padding-left: $nav-divider-offset + 4px;

  &:hover {
    @include divider-gradient($content-background-color, $dark-content-background-color);
    color: inherit;
  }
}

.docs-nav-divider {
  @include divider-gradient($pt-divider-black, $pt-dark-divider-black);
  background-image: linear-gradient(to right, rgba($black, 0) 0%, $pt-divider-black 40%);
  height: 1px;
  margin-left: -$nav-divider-offset;
  padding: 0;
}
