2023-06-15

king

2023-06-15 a29d9d644a2a30e9ef4afcc6d728c20c218dc359

 src/assets/css/main.scss

@@ -17,6 +17,17 @@
  }
}

.table-col-1, .table-col-2, .table-col-3, .table-col-4 {
  .ant-table colgroup > col.ant-table-selection-col {
    width: 40px!important;
  }
}
.table-col-5, .table-col-6, .table-col-7 {
  .ant-table colgroup > col.ant-table-selection-col {
    width: 50px!important;
  }
}

/* 设置iconfont标签font-family */ 
[class^="icon-"],[class*=" icon-"] {
  font-family: "iconfont";
@@ -36,6 +47,7 @@

/*背景色*/
html, body {
  --mk-sys-color: #1890ff;
  width: 100%;
  font-size: 14px;
}
@@ -71,7 +83,7 @@
  background-color: unset;
  color: unset;
}
.side-menu.ant-menu-dark .ant-menu-item.ant-menu-item-selected {
.mk-side-menu.ant-menu-dark .ant-menu-item.ant-menu-item-selected {
  background-color: unset;
  color: unset;
}
@@ -120,30 +132,33 @@
}

// 重置时间插件时间滚动条
.ant-calendar-time-picker-select:hover::-webkit-scrollbar {
  width: 7px;
.ant-calendar-time-picker-select {
  overflow-y: auto!important;
}
.ant-calendar-time-picker-select:hover::-webkit-scrollbar-thumb {
.ant-calendar-time-picker-select::-webkit-scrollbar {
  width: 6px;
}
.ant-calendar-time-picker-select::-webkit-scrollbar-thumb {
  border-radius: 5px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13);
  background: rgba(0, 0, 0, 0.13);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.08);
  background: rgba(0, 0, 0, 0.08);
}
.ant-calendar-time-picker-select:hover::-webkit-scrollbar-track {
.ant-calendar-time-picker-select::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
  border: 1px solid rgba(0, 0, 0, 0.07);
  background: rgba(0, 0, 0, 0);
}
// 重置模态框滚动条
.ant-modal-wrap::-webkit-scrollbar {
.ant-modal-wrap::-webkit-scrollbar, .ant-drawer-wrapper-body::-webkit-scrollbar {
  width: 7px;
}
.ant-modal-wrap::-webkit-scrollbar-thumb {
.ant-modal-wrap::-webkit-scrollbar-thumb, .ant-drawer-wrapper-body::-webkit-scrollbar-thumb {
  border-radius: 5px;
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13);
  background: rgba(0, 0, 0, 0.13);
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
  background: rgba(0, 0, 0, 0.1);
}
.ant-modal-wrap::-webkit-scrollbar-track {
.ant-modal-wrap::-webkit-scrollbar-track, .ant-drawer-wrapper-body::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05);
  border-radius: 3px;
  border: 1px solid rgba(0, 0, 0, 0.07);
@@ -160,7 +175,7 @@
  width: 100%;
  display: inline-block;
  .ant-calendar-picker {
    width: 100%;
    width: 100%!important;
  }
}
.ant-calendar-picker-container {
@@ -174,9 +189,9 @@
  z-index: 1090!important;
}

.ant-dropdown {
  z-index: 1090!important;
}
// .ant-dropdown {
//   z-index: 1090!important;
// }

.mk-normal-dropdown {
  .ant-dropdown-menu {
@@ -210,6 +225,9 @@
// 气泡确认框
.ant-popover.popover-confirm {
  z-index: 1080!important;
}
.ant-message {
  z-index: 1110!important;
}

.ant-notification-notice.notification-custom-error {
@@ -255,10 +273,12 @@
  }
}

.ant-modal.popview-modal {
  top: 80px;
.ant-modal-wrap.popview-modal {
  .ant-modal {
    top: 70px;
  }
  .ant-modal-body {
    min-height: 250px;
    min-height: 200px;
    max-height: calc(100vh - 210px);
    overflow-y: auto;
  }
@@ -278,6 +298,41 @@
  }
}

// 设置模态框样式，规定最大最小高度，重置滚动条
.action-modal {
  .ant-modal {
    max-width: 95vw;
    top: 70px;
  }
  .ant-modal-body {
    max-height: calc(100vh - 205px);
    min-height: 150px;
    overflow-y: auto;
    padding-bottom: 35px;
  }
  .ant-modal-body::-webkit-scrollbar {
    width: 7px;
    height: 7px;
  }
  .ant-modal-body::-webkit-scrollbar-thumb {
    border-radius: 5px;
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.13);
    background: rgba(0, 0, 0, 0.13);
  }
  .ant-modal-body::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
    border: 1px solid rgba(0, 0, 0, 0.07);
    background: rgba(0, 0, 0, 0);
  }
}
.moveable-modal {
  overflow-x: hidden!important;
  .ant-modal-header {
    cursor: move;
  }
}

.ant-drawer {
  z-index: 1080!important;
}
@@ -291,7 +346,7 @@
    }
    .mk-popover-control {
      white-space: nowrap;
      i {
      i, span.anticon {
        padding: 5px 8px;
        cursor: pointer;
        font-size: 16px;
@@ -331,4 +386,131 @@
      padding: 5px 20px;
    }
  }
}

.ant-input[disabled] {
  background-color: #fafafa!important;
}
.ant-btn[disabled] {
  background-color: transparent!important;
  border-color: rgba(0, 0, 0, 0.35)!important;
  color: rgba(0, 0, 0, 0.35)!important;
}
.ant-btn.ant-btn-link {
  border-width: 0;
}
.button-list {
  .ant-btn.ant-btn-link {
    border-width: 1px;
  }
}

.ant-tabs .ant-tabs-top-content.ant-tabs-content-animated { // 去除切换时的动画效果
  transition: margin-left 0s cubic-bezier(0.645, 0.045, 0.355, 1)!important;
}

.ant-progress-line.square {
  .ant-progress-inner {
    border-radius: 0;
    .ant-progress-bg {
      border-radius: 0;
    }
  }
}

.mk-form-tip {
  color: #c49f47;
  margin-right: 3px;
}

div.ant-input-number {
  width: 100%;
}

.ant-progress {
  .ant-progress-circle-trail {
    stroke: inherit!important;
  }
  .ant-progress-text {
    color: inherit!important;
  }
}
.ant-table.ant-table-mini .ant-table-thead > tr > th {
  padding: 8px 8px!important;
}
.ant-table.ant-table-mini .ant-table-tbody > tr > td {
  padding: 2px 8px!important;
  line-height: 1.5;
}
.mk-date-picker.minute {
  .ant-calendar-time-picker-combobox {
    .ant-calendar-time-picker-select {
      width: 50%;
    }

    >.ant-calendar-time-picker-select:last-child {
      display: none;
    }
  }
}
.mk-date-picker.hour {
  .ant-calendar-time-picker-combobox {
    .ant-calendar-time-picker-select {
      width: 100%;
    }

    >.ant-calendar-time-picker-select:not(:first-child) {
      display: none;
    }
  }
}
.mk-button-progress {
  position: fixed!important;
  top: 0px;
  left: 0px;
  z-index: 1100;
  width: 100vw!important;
  .ant-progress-outer {
    .ant-progress-inner {
      vertical-align: top;
      background-color: transparent;
      .ant-progress-bg {
        height: 4px!important;
        background-color: var(--mk-sys-color);
      }
    }
  }
}

.video-wrap {
  overflow: hidden;
  .video-react .video-react-poster {
    background-size: cover;
  }
}

.table-vertical-top {
  table td {
    vertical-align: top;
  }
}
.table-vertical-bottom {
  table td {
    vertical-align: bottom;
  }
}

// 系统色设置
.mk-main-view {
  display: flex;
  flex: auto;
  min-height: 100%;
}

.component-wrap >.ant-col {
  min-height: 0;
}

.ant-col.ant-col-0 {
  display: inline-block;
}