$corner-radius: 10px;
$vertical-offset: -14px;

.sidebar-toggle {
  position: absolute;
  display: block;
  height: 35px;
  top: 3.25rem;
  z-index: 100;
  &:hover {
    cursor: pointer;
    &:before, &:after { cursor: default; }
    a { color: rgba($article-text, 1); }
  }

  &:before, &:after {
    display: block;
    position: absolute;
    width: $corner-radius;
    height: $corner-radius;
  }
  &:before {
    top: $vertical-offset;
  }
  &:after {
    bottom: $vertical-offset;
    transform: rotateX(180deg);
  }

  & > a {
    font-family: "icomoon-v2";
    color: rgba($article-text, .5);
    text-decoration: none;
  }
}

.sidebar-toggle {
  padding: 0.4rem 0.6rem;
  width: 35px;
  & > a {
    font-size: 1rem;
  }
}

.content-wrapper .sidebar-toggle {
  display: none;
  left: 0;
  background-color: $body-bg;
  border-radius: 0 $radius $radius 0;
  &:before, &:after {
    content: url("data:image/svg+xml;charset=UTF-8,
      <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 10 10' xml:space='preserve'>
      <path fill='"+rgba($body-bg, .9999)+"' d='M0,10h10V0C10,5.52,5.52,10,0,10z'/>
      </svg>");
    left: 0;
  }
  &:before { transform: rotateY(180deg); }
  &:after { transform: rotate(180deg); }
}

.sidebar .sidebar-toggle {
  right: 0;
  background-color: $article-bg;
  border-radius: $radius 0 0 $radius;
  &:before, &:after {
    content: url("data:image/svg+xml;charset=UTF-8,
      <svg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 10 10' xml:space='preserve'>
      <path fill='"+rgba($article-bg, .9999)+"' d='M0,10h10V0C10,5.52,5.52,10,0,10z'/>
      </svg>");
    right: 0;
  }
}

////////////////////////////////////////////////////////////////////////////////
///////////////////////////////// MEDIA QUERIES ////////////////////////////////
////////////////////////////////////////////////////////////////////////////////

@include media(medium) {
  .sidebar-toggle{
    display: none;
  }
}