@import '~antd/lib/style/themes/default.less';

@gate-global-apps: doreamonjs-design-gate-global-apps;

.@{gate-global-apps}.apps {
  :global {
    .ant-drawer-close {
      display: none;
    }

    .ant-drawer-header {
      background-color: @primary-color  !important;
      height: 64px !important;
      display: flex;
      justify-content: center;
      align-items: center;

      .ant-drawer-title {
        font-size: 20px !important;
        color: #fff !important;
        text-align: center;
      }
    }

    .ant-drawer-body {
      margin: 0;
      padding: 0;
      padding: 20px 0;
    }
  }

  .close {
    font-size: 22px;
    transition: transform .5s ease;

    &:hover {
      transform: rotate(180deg);
    }
  }
}

.app {
  // width: 100%;
  cursor: pointer;
  height: 52px;
  line-height: 52px;
  padding-left: 20px;
  margin-right: 20px;
  overflow: hidden;
  border-radius: 0 26px 26px 0;
  transition: all .3s ease-in-out;
  margin-bottom: 12px;

  &:hover {
    background-color: #e6e6e6;
  }

  &.active {
    color: @primary-color;

    .wrap {
      color: inherit;
    }
  }

  .wrap {
    height: 100%;
    color: #616161;
    line-height: 52px;
    display: flex;
    flex-flow: row wrap;
    align-items: center;

    .logo {
      display: inline-block;
      margin-right: 8px;
      display: flex;
      align-items: center;
    }

    .name {
      display: inline-block;
      line-height: 22px;
      font-size: 16px;
      font-weight: 700;
    }
  }
}