@layout-header-height: 48px;
@layout-trigger-height: 48px;

@scroller: {
  /* 设置滚动条的样式 */
  &::-webkit-scrollbar {
    width: 8px;
  }

  /* 滚动槽 */
  &::-webkit-scrollbar-track {
    border-radius: 10px;
  }

  /* 滚动条滑块 */
  &::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.1);
    border-radius: 10px;
  }
};

.fade-enter {
  transform: translateX(30px);
  opacity: 0;
}

.fade-enter-active {
  transform: translate(0, 0);
  opacity: 1;
  transition: all 300ms;
}

.fade-exit {
  transform: translate(0, 0);
  opacity: 1;
}

.fade-exit-active {
  transform: translate(30px, 0);
  opacity: 0;
  transition: all 300ms;
}