$max-menu-width: 250px;

.armstrong-menu {
  &[data-position="left"] {
    left: 0;

    &[data-open=false] {
      transform: translateX(-100%);
    }

    &[data-open=true] {
      transform: translateX(0);
    }

    .armstrong-menu-button {
      &.close {
        right: $spacing-small;
      }
    }
  }

  &[data-position="right"] {
    right: 0;

    &[data-open=false] {
      transform: translateX(100%);
    }

    &[data-open=true] {
      transform: translateX(0);
    }

    .armstrong-menu-button {
      &.close {
        left: $spacing-small;
      }
    }
  }
}