.widget-container {
  background-color: #fff;
  h2 {
    margin-top: 12px;
    color: rgba(0, 0, 0, 0.85);
  }
  .widget-content {
    display: flex;
    flex-wrap: wrap;
    row-gap: 12px;
    column-gap: 12px;
    .icon {
      width: 24px;
      height: 24px;
    }
  }
  .widget-box {
    width: calc(33% - 8px);
    height: 80px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border: 1px solid #e6e6e6;
    border-radius: 4px;

    &:hover {
      background-color: #e4f2e4;
      .icon {
        color: inherit;
      }
      .widget-name {
        color: rgba(0, 0, 0, 0.65);
      }

      .widget-desc {
        color: rgba(0, 0, 0, 0.45);
      }
    }

    .widget-name {
      font-size: 12px;
      color: rgba(0, 0, 0, 0.65);
    }

    .widget-desc {
      font-size: 12px;
      color: rgba(0, 0, 0, 0.45);
      transform: scale(0.9);
    }
  }
  .yee-tabs {
    .yee-tabs-ink-bar,
    .yee-tabs-tab-active {
      width: 100% !important;
    }
  }
}