@import (reference) '../extend.less';
.yo-icon-selector {
  .ant-drawer-wrapper-body {
    display: flex;
    flex-direction: column;
  }
  .ant-drawer-body {
    position: relative;

    flex: 1 1 100%;

    padding: 0;
  }
  .ant-tabs {
    height: 100%;
    .ant-tabs-content-left {
      position: relative;

      height: 100%;
      .ant-tabs-tabpane {
        position: absolute;
        top: 0;
        left: 0;

        overflow-y: auto;

        width: 100%;
        height: 100%;
        padding: @padding-lg;
      }
    }
  }
  .ant-card {
    margin: 0;
  }
  .ant-card-grid {
    width: 25%;

    text-align: center;
    >span {
      font-size: @font-size-sm;

      display: block;

      margin: @padding-xxs -@padding-lg 0;

      white-space: nowrap;

      color: fade(@black, 50%);
    }
    &.yo-icon--selected {
      color: @white;
      background-color: @primary-color;
      >span {
        color: fade(@white, 50%);
      }
    }
  }
}