.menu-icon-selector {
  // grid 布局，每行显示 8 个图标
  display: grid;
  grid-auto-rows: 1fr;
  grid-template-columns: repeat(4, 1fr);

  &__item {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 80px;
    cursor: pointer;

    &__icon {
      display: block;
    }

    &__icon--active {
      display: none;
    }

    &:hover &__icon,
    &:active &__icon {
      display: none;
    }

    &:hover &__icon--active,
    &:active &__icon--active {
      display: block;
    }
  }
}
