2020-07-01

king

2020-07-01 9a16cb432ed0a597caf9ba78c9dda63ad2134207

 src/tabviews/zshare/cardcomponent/index.scss

@@ -9,6 +9,29 @@
      margin-right: 0px;
    }
  }
  > .chart-card-box {
    margin-bottom: 20px;
  }
  .ant-btn {
    padding: 0;
    color: rgba(0,0,0,.45);
    > .anticon + span {
      margin-left: 4px;
    }
  }
  .ant-btn:hover, .ant-btn.active, .ant-btn:focus {
    color: #40a9ff;
  }

  .chart-card-box:hover {
    .ant-card.chart-card {
      .ant-card-head {
        .ant-card-extra {
          opacity: 1;
        }
      }
    }
  }

  .chart-card-box:not(.ant-col) {
    display: inline-block;
@@ -60,24 +83,58 @@
    }
  }

  .ant-card.chart-card.insert {
    .ant-card-head {
      border-color: transparent;
    }
    .ant-card-actions {
      border-color: transparent;
      background: transparent;
    }
    .mk-card-insert {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;

      .mk-btn-wrap {
        width: 100%;
        height: 100%;
        .ant-btn {
          border: 0;
          width: 100%;
          height: 100%;
          color: rgb(38, 194, 129);
        }
      }
    }
  }

  .ant-card.chart-card {
    transition: all 0.3s;

    .ant-card-head {
      min-height: 40px;
      min-height: 45px;
      line-height: 2;
      .ant-card-head-title {
        font-weight: 500;
      }
      .ant-card-extra {
        color: #1890ff;
        .action-cell {
          cursor: pointer;
        }
        padding: 0px;
        opacity: 0;
        transition: opacity 0.3s;
      }
    }
    .ant-card-actions {
      height: 48px;
      > li {
        margin: 8px 0;

        .ant-btn > .anticon + span {
          vertical-align: top;
        }
      }
    }
  }

@@ -110,26 +167,31 @@
      white-space: normal;

      .ant-card-meta-avatar {
        position: relative;
        height: 0;
        padding-top: 0px;
        padding-left: 0px;
        float: unset;
        overflow: hidden;
        margin: 0 10px 15px 0px;
      }

      .ant-avatar-image {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        font-variant: tabular-nums;
        line-height: 1.5;
        list-style: none;
        font-feature-settings: 'tnum';
        position: relative;
        display: inline-block;
        overflow: hidden;
        color: #fff;
        white-space: nowrap;
        text-align: center;
        vertical-align: middle;
        border-radius: 50%;

        img {
          width: 100%;
@@ -138,12 +200,61 @@
          background: transparent;
        }
      }
      .ant-card-meta-title {
      .ant-card-meta-title, .ant-card-meta-description {
        font-size: 14px;
        div {
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          word-break: break-all;
        }
      }
      .ant-card-meta-detail > div {
        height: 23px;
        vertical-align: top;
      .ant-card-meta-detail {
        .mk-card-detail-item {
          line-height: 1.5;
          vertical-align: top;
          display: inline-block;
          color: rgba(0, 0, 0, 0.85);
        }
        .line1 {
          overflow: hidden;
          word-break: break-word;
          white-space: nowrap;
          text-overflow: ellipsis;
        }
        .mk-card-detail-item:not(.line1) {
          word-break: break-word;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          overflow: hidden;
        }
        .line2 {
          -webkit-line-clamp: 2;
        }
        .line3 {
          -webkit-line-clamp: 3;
        }
        .line4 {
          -webkit-line-clamp: 4;
        }
        .line5 {
          -webkit-line-clamp: 5;
        }
        .line6 {
          -webkit-line-clamp: 6;
        }
        .line7 {
          -webkit-line-clamp: 7;
        }
        .line8 {
          -webkit-line-clamp: 8;
        }
        .line9 {
          -webkit-line-clamp: 9;
        }
        .line10 {
          -webkit-line-clamp: 10;
        }
      }
      .ant-card-meta-detail > div:not(:last-child) {
        margin-bottom: 2px;
@@ -180,17 +291,10 @@
          word-break: break-word;
          white-space: nowrap;
          text-overflow: ellipsis;
          cursor: default;
        }
        .anticon {
          width: unset;
          margin-right: 3px;
          color: rgba(0, 0, 0, 0.45);
        }
      }
      li:hover {
        color: #1890ff;
        .anticon {
          color: #1890ff;
        }
      }
    }