// TODO: Only on small screens, otherwise put next to real content
// Call it sidebar
$sidebar-divider-color: #262930;

section.main {
  @media #{$medium-up} {
    @include grid-column(10);
  }
}

aside.sidebar {
  @media #{$small-only} {
    @include off-canvas-menu(left);
  }
  @media #{$medium-up} {
    @include grid-column(2);
    background-color: $off-canvas-bg;
  }

  h3 {
    color: $topbar-link-color;
  }

  input[type=submit] {
    background-color: $alert-color;
    color: white;
    font-weight: bold;
  }

  hr {
    background-color: $sidebar-divider-color;
    height: 20px;
    border-width: 0px;
  }
}

// Call it sidebar
$sidebar-divider-color: #262930;

section.main {
  @media #{$medium-up} {
    @include grid-column(10);
  }
}

aside.sidebar {
  @media #{$small-only} {
    @include off-canvas-menu(left);
  }
  @media #{$medium-up} {
    @include grid-column(2);
    background-color: $off-canvas-bg;
  }

  h3 {
    color: $topbar-link-color;
  }

  input[type=submit] {
    background-color: $alert-color;
    color: white;
    font-weight: bold;
  }

  hr {
    background-color: $sidebar-divider-color;
    height: 20px;
    border-width: 0px;
  }
}

Remove TODO comment that was done – thanks @bitboxer
Remove TODO comment that was done – thanks @bitboxer
