ci4sManagement-cloud/react-ui/src/components/MenuIconSelector/index.less

.menu-icon-selector {
  display: grid;
  grid-template-columns: repeat(4, 80px);
  gap: 20px;
  justify-content: space-between;
  width: 100%;

  &__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border: 1px solid transparent;
    border-radius: 4px;
    cursor: pointer;

    &:hover {
      border-color: @primary-color;
    }

    &__icon {
      display: block;
    }

    &__icon--active {
      display: none;
    }

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

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