@import '../../style/themes/default.less';

/* 侧栏彩色图标 */
.ele-admin-side-colorful {
  .ele-admin-sidebar .ele-admin-sidebar-menus > .ant-menu > li {
    & > .ant-menu-item-icon,
    & > .ant-menu-submenu-title > .ant-menu-item-icon {
      color: @sidebar-colorful-font-color;
      background: @sidebar-colorful-color-1;
      width: @sidebar-colorful-icon-width;
      height: @sidebar-colorful-icon-width;
      line-height: @sidebar-colorful-line-height;
      font-size: @sidebar-colorful-icon-size;
      vertical-align: -0.05em;
      border-radius: 50%;
      text-align: center;
    }

    &:nth-child(even) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-2;
      }
    }

    &:nth-child(3) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-3;
      }
    }

    &:nth-child(4) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-4;
      }
    }

    &:nth-child(5) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-5;
      }
    }

    &:nth-child(6) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-6;
      }
    }

    &:nth-child(7) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-7;
      }
    }

    &:nth-child(8) {
      & > .ant-menu-item-icon,
      & > .ant-menu-submenu-title > .ant-menu-item-icon {
        background: @sidebar-colorful-color-8;
      }
    }
  }

  .ele-admin-sidebar .ant-menu-submenu > .ant-menu > li {
    & > .ant-menu-item-icon,
    & > .ant-menu-submenu-title > .ant-menu-item-icon {
      display: none;

      & + .ant-menu-title-content {
        margin-left: 0;
      }
    }

    &:not(.ant-menu-submenu):before,
    & > .ant-menu-submenu-title:before {
      content: '';
      width: @sidebar-colorful-dot-size;
      height: @sidebar-colorful-dot-size;
      margin: @sidebar-colorful-dot-margin;
      position: static;
      border-radius: 50%;
      display: inline-block;
      vertical-align: 0.05em;
      background: @normal-color;
      transition: background-color 0.3s @ease-in-out;
    }

    &:not(.ant-menu-submenu):hover:before,
    &:not(.ant-menu-submenu).ant-menu-item-selected:before,
    &.ant-menu-submenu:hover > .ant-menu-submenu-title:before {
      background: @primary-color;
    }
  }

  &.ele-admin-side-dark:not(.ele-admin-side-mix) .ele-admin-sidebar {
    .ant-menu-submenu > .ant-menu > li {
      &:not(.ant-menu-submenu):before,
      & > .ant-menu-submenu-title:before {
        background: @menu-dark-color;
      }

      &:not(.ant-menu-submenu):hover:before,
      &:not(.ant-menu-submenu).ant-menu-item-selected:before,
      &.ant-menu-submenu:hover > .ant-menu-submenu-title:before {
        background: @menu-dark-selected-item-text-color;
      }
    }
  }

  &.ele-admin-collapse .ele-admin-sidebar {
    .ant-menu > .ant-menu-item,
    .ant-menu > .ant-menu-submenu > .ant-menu-submenu-title {
      padding: 0
        calc(calc(@sidebar-collapse-width - @sidebar-colorful-icon-width) / 2) !important;
    }
  }
}