@import (optional, reference) '../../style/themes/index';

@iconList-prefix-cls: ~'@{mega-prefix}-icon-list';

.@{iconList-prefix-cls} {
  &-wrapper {
    width: 100%;
    max-height: 650px;
    overflow-y: auto;
  }
  &-item {
    padding: 5px;
    margin: 0 5px;
    cursor: pointer;
    border-radius: 5px;
    &:hover {
      color: #fff;
      background: rgba(100, 100, 100, 0.6);
    }
    &-active {
      color: #fff;
      background: rgba(100, 100, 100, 0.6);
    }
  }
  &__modal {
    .icon-list {
      margin: 0;
      padding: 0;
      .icon-item {
        display: inline-block;
        width: 5%;
        margin: 3px 0;
        border-radius: 4px;
        background-color: #fff;
        overflow: hidden;
        padding: 10px 0 0;
        text-align: center;
        .extra-icon {
          border: 1px solid #f1f1f1;
          padding: 0.2rem;
          cursor: pointer;
          &:hover {
            border-color: #4a4a48;
            background-color: #4a4a48;
            color: #fff;
          }
        }
      }
    }
  }
}