$bs5-sidebar-transition: all .2s cubic-bezier(.7,0,.3,1) !default;
$bs5-sidebar-zindex: $zindex-fixed + 1 !default;
$bs5-sidebar-width: 250px !default;
$bs5-sidebar-height: 100vh !default;
$bs5-sidebar-max-height: $bs5-sidebar-height !default;

bs5-sidebar {
  display: block;
  height: $bs5-sidebar-height;
  max-height: $bs5-sidebar-max-height;
  position: fixed;
  width: $bs5-sidebar-width;
  top: 0;
  bottom: 0;
  z-index: $bs5-sidebar-zindex;
  transition: $bs5-sidebar-transition;

  &[position="right"] {
    right: 0;
    // Changeable values
    transform: translateX(100%);
  }

  &:not([position="right"]) {
    left: 0;
    // Changeable values
    transform: translateX(-100%);
  }

}