@zat-design/sisyphus-react 3.2.1 → 3.2.2-beta.10

package/lib/style/theme/antd.less

@@ -1,115 +1,120 @@
+@root-entry-name: 'default';
+@import (reference) '~antd/es/style/themes/index.less';
 @import './index';
 
-@zat-disabled-color : #BCBCBC;
+@zat-disabled-color: #bcbcbc;
 
 /* antd 默认样式重置 */
 
 // 表单
-.ant-form,
-.ant-drawer,
-.ant-modal {
-  .ant-input-textarea-show-count.ant-input-textarea-in-form-item {
+.@{ant-prefix}-form,
+.@{ant-prefix}-drawer,
+.@{ant-prefix}-modal {
+  .@{ant-prefix}-input-textarea-show-count.@{ant-prefix}-input-textarea-in-form-item {
     &::after {
       background: transparent;
     }
   }
 
-  .ant-form-item {
-    &.ant-form-item-with-help {
+  .@{ant-prefix}-form-item {
+    &.@{ant-prefix}-form-item-with-help {
       transition: none;
     }
 
     // label 超过130px换行
-    .ant-form-item-label {
-      flex         : 0 0 @zaui-form-label-width;
-      overflow     : initial;
-      line-height  : 1;
-      text-align   : @zaui-form-align;
-      white-space  : pre-wrap;
+    .@{ant-prefix}-form-item-label {
+      flex: 0 0 @zaui-form-label-width;
       padding-right: @zaui-space-size-sm;
+      overflow: initial;
+      line-height: 1;
+      white-space: pre-wrap;
+      text-align: @zaui-form-align;
 
-      .ant-form-item-required {
+      .@{ant-prefix}-form-item-required {
         &::after {
           display: block;
         }
       }
 
-      &>label {
+      & > label {
         word-break: break-word;
 
         &::after {
-          margin : 0;
           display: none;
+          margin: 0;
         }
       }
 
-      & .ant-form-item-required::before {
+      & .@{ant-prefix}-form-item-required::before {
         display: inline-block;
       }
 
-      &.ant-form-item-label-left {
-        &>.ant-form-item-required::before {
+      &.@{ant-prefix}-form-item-label-left {
+        & > .@{ant-prefix}-form-item-required::before {
           display: none;
         }
 
-        &>.ant-form-item-required::after {
-          margin-top : 1px;
-          color      : #ff4d4f;
-          font-size  : var(--zaui-font-size, 14px);
+        & > .@{ant-prefix}-form-item-required::after {
+          margin-top: 1px;
+          color: #ff4d4f;
+          font-size: var(--zaui-font-size, 14px);
           line-height: 1;
-          content    : '*';
+          content: '*';
         }
       }
 
-      &:not(.ant-form-item-label-left) {
-        &>.ant-form-item-required::after {
+      &:not(.@{ant-prefix}-form-item-label-left) {
+        & > .@{ant-prefix}-form-item-required::after {
           display: none;
         }
       }
     }
 
-    .ant-form-item-explain-error {
+    .@{ant-prefix}-form-item-explain-error {
       .set-text-size();
     }
   }
 
   // 字体颜色
-  .ant-form-item-label>label,
-  .ant-picker-input>input,
-  .ant-input,
-  .ant-input-number,
-  .ant-select,
-  .ant-select-dropdown {
+  .@{ant-prefix}-form-item-label > label,
+  .@{ant-prefix}-picker-input > input,
+  .@{ant-prefix}-input,
+  .@{ant-prefix}-input-number,
+  .@{ant-prefix}-select,
+  .@{ant-prefix}-select-dropdown {
     .set-text-color();
     .set-text-size();
   }
 
-  .ant-form-item {
+  .@{ant-prefix}-form-item {
     margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1)) !important;
   }
 }
 
-.ant-input[disabled],
-.ant-select-disabled,
-.ant-select-disabled.ant-select:not(.ant-select-customize-input) .ant-select-selector,
-.ant-input-number-disabled,
-.ant-picker-input>input[disabled],
-.ant-select-disabled.ant-select-multiple .ant-select-selection-item {
+.@{ant-prefix}-input[disabled],
+.@{ant-prefix}-select-disabled,
+.@{ant-prefix}-select-disabled.@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input) .@{ant-prefix}-select-selector,
+.@{ant-prefix}-input-number-disabled,
+.@{ant-prefix}-picker-input > input[disabled],
+.@{ant-prefix}-select-disabled.@{ant-prefix}-select-multiple .@{ant-prefix}-select-selection-item {
   .set-disabled-color();
 }
 
 // ant-table
-.ant-table {
+.@{ant-prefix}-table {
+  .@{ant-prefix}-empty-normal {
+    margin: calc(var(--zaui-space-size-lg; 32px) * var(--zaui-size; 1)) 0;
+  }
   &.pro-table-no-stripe {
-    .ant-table-tbody {
-      .ant-table-row {
+    .@{ant-prefix}-table-tbody {
+      .@{ant-prefix}-table-row {
         background: #fff !important;
       }
     }
   }
 
   // 空态图白色
-  .ant-table-placeholder {
+  .@{ant-prefix}-table-placeholder {
     td {
       background: #ffffff !important;
     }
@@ -118,27 +123,27 @@
   .set-text-size();
   color: @zaui-text;
 
-  .ant-table-thead {
-    .ant-table-cell {
+  .@{ant-prefix}-table-thead {
+    .@{ant-prefix}-table-cell {
       &::before {
         display: none;
       }
     }
   }
 
-  .ant-table-thead>tr>th {
-    background   : @zaui-table-header-bg;
+  .@{ant-prefix}-table-thead > tr > th {
+    background: @zaui-table-header-bg;
     border-bottom: none;
 
-    .ant-dropdown-trigger {
+    .@{ant-prefix}-dropdown-trigger {
       .anticon-down {
-        width       : 0;
-        height      : 0;
-        margin      : 0 0 1px 4px;
-        border-top  : 6px solid #909090;
+        width: 0;
+        height: 0;
+        margin: 0 0 1px 4px;
+        border-top: 6px solid #909090;
         border-right: 5px solid transparent;
-        border-left : 5px solid transparent;
-        transition  : transform 0.8s;
+        border-left: 5px solid transparent;
+        transition: transform 0.8s;
 
         svg {
           display: none;
@@ -147,21 +152,21 @@
     }
   }
 
-  .ant-table-tbody {
-    .ant-table-row:nth-child(even) {
+  .@{ant-prefix}-table-tbody {
+    .@{ant-prefix}-table-row:nth-child(even) {
       background-color: @zaui-table-strip-bg;
     }
 
-    tr.ant-table-row:hover td {
-      background-color: @zaui-table-hover-bg  !important;
+    tr.@{ant-prefix}-table-row:hover td {
+      background-color: @zaui-table-hover-bg !important;
     }
 
-    &>tr>td {
+    & > tr > td {
       border-bottom: none;
     }
 
-    tr.ant-table-row-selected {
-      &:hover>td {
+    tr.@{ant-prefix}-table-row-selected {
+      &:hover > td {
         background: @zaui-table-selected-hover-bg;
       }
 
@@ -171,72 +176,90 @@
     }
   }
 
-  .ant-table-thead>tr>th,
-  .ant-table-footer {
+  .@{ant-prefix}-table-thead > tr > th,
+  .@{ant-prefix}-table-footer {
     .set-text-color();
     .set-text-size();
   }
 
-  .ant-table-tbody>tr>td {
+  .@{ant-prefix}-table-tbody > tr > td {
     .set-text-size();
 
-    .ant-btn {
+    .@{ant-prefix}-btn {
       .set-text-size();
     }
   }
 
   // 表格空显示-
-  .ant-table-content {
-    .ant-table-tbody {
-      .ant-table-cell:empty:before {
+  .@{ant-prefix}-table-content {
+    .@{ant-prefix}-table-tbody {
+      .@{ant-prefix}-table-cell:empty:before {
         content: '-';
       }
     }
 
-    .ant-table-cell-fix-right {
-      &.ant-table-cell:empty:before {
+    .@{ant-prefix}-table-cell-fix-right {
+      &.@{ant-prefix}-table-cell:empty:before {
         content: none;
       }
     }
   }
 
-  &.ant-table-scroll-horizontal {
-    table .ant-table-tbody .ant-table-row:nth-child(even) td {
+  &.@{ant-prefix}-table-scroll-horizontal {
+    table .@{ant-prefix}-table-tbody .@{ant-prefix}-table-row:nth-child(even) td {
       background: @zaui-table-strip-bg;
     }
   }
 
-  &.ant-table-scroll-horizontal table {
+  & table {
+    .@{ant-prefix}-table-thead > tr > th,
+    .@{ant-prefix}-table-tbody > tr > td,
+    .@{ant-prefix}-table tfoot > tr > th,
+    .@{ant-prefix}-table tfoot > tr > td {
+      padding: calc(4px + var(--zaui-size) * 8px);
+    }
+    .@{ant-prefix}-table-tbody > tr > td > .@{ant-prefix}-table-wrapper:only-child .@{ant-prefix}-table,
+    .@{ant-prefix}-table-tbody
+      > tr
+      > td
+      > .@{ant-prefix}-table-expanded-row-fixed
+      > .@{ant-prefix}-table-wrapper:only-child
+      .@{ant-prefix}-table {
+      margin-top: calc(var(--zaui-size) * -16px);
+      margin-bottom: calc(var(--zaui-size) * -16px);
+    }
+  }
 
-    .ant-table-thead>tr>th,
-    .ant-table-tbody>tr>td,
-    .ant-table tfoot>tr>th,
-    .ant-table tfoot>tr>td {
-      padding: calc(5px + var(--zaui-size) * 8px) 16px;
+  &.@{ant-prefix}-table-scroll-horizontal table {
+    .@{ant-prefix}-table-thead > tr > th,
+    .@{ant-prefix}-table-tbody > tr > td,
+    .@{ant-prefix}-table tfoot > tr > th,
+    .@{ant-prefix}-table tfoot > tr > td {
+      padding: calc(4px + var(--zaui-size) * 8px);
     }
 
     // 偶数行背景色设置
-    .ant-table-tbody {
-      .ant-table-row:nth-child(even) {
+    .@{ant-prefix}-table-tbody {
+      .@{ant-prefix}-table-row:nth-child(even) {
         background-color: @zaui-table-strip-bg;
 
-        & td.ant-table-cell-fix-right,
-        & td.ant-table-cell-fix-left {
+        & td.@{ant-prefix}-table-cell-fix-right,
+        & td.@{ant-prefix}-table-cell-fix-left {
           background-color: @zaui-table-strip-bg;
         }
       }
 
-      .ant-table-row:hover>td {
+      .@{ant-prefix}-table-row:hover > td {
         background-color: @zaui-table-strip-bg;
       }
 
-      tr.ant-table-row-selected {
-        &:hover>td {
-          background: @zaui-table-selected-bg  !important;
+      tr.@{ant-prefix}-table-row-selected {
+        &:hover > td {
+          background: @zaui-table-selected-bg !important;
         }
 
         td {
-          background: @zaui-table-selected-bg  !important;
+          background: @zaui-table-selected-bg !important;
         }
       }
 
@@ -247,18 +270,18 @@
   }
 
   // 开启scroll时，会新增一行tr影响偶数行底色
-  &.ant-table-scroll-horizontal {
+  &.@{ant-prefix}-table-scroll-horizontal {
     table {
-      .ant-table-tbody {
-        .ant-table-row:nth-child(even) {
+      .@{ant-prefix}-table-tbody {
+        .@{ant-prefix}-table-row:nth-child(even) {
           &:hover td {
             background-color: @zaui-table-hover-bg;
           }
 
           & td,
-          & td.ant-table-cell-fix-right,
-          & td.ant-table-cell-fix-left {
-            background-color: #fff;
+          & td.@{ant-prefix}-table-cell-fix-right,
+          & td.@{ant-prefix}-table-cell-fix-left {
+            background-color: #fff !important;
           }
 
           & td {
@@ -266,40 +289,39 @@
           }
         }
 
-        .ant-table-row:nth-child(odd) {
-          background-color: @zaui-table-strip-bg;
+        .@{ant-prefix}-table-row:nth-child(odd) {
+          background-color: @zaui-table-strip-bg !important;
 
           & td {
-            background-color: @zaui-table-strip-bg;
+            background-color: @zaui-table-strip-bg !important;
           }
         }
       }
     }
   }
 
-  .ant-table-cell {
-    .ant-btn-link {
-      padding    : 0;
-      height     : auto;
+  .@{ant-prefix}-table-cell {
+    .@{ant-prefix}-btn-link {
+      height: auto;
+      padding: 0;
       user-select: text;
     }
 
     a {
+      color: var(--zaui-brand, #006aff);
       user-select: text;
-      color      : var(--zaui-brand, #006aFF);
     }
   }
 
-  &.ant-table-fixed-header {
-    .ant-table-tbody {
-      .ant-table-row:nth-child(even) {
-
+  &.@{ant-prefix}-table-fixed-header {
+    .@{ant-prefix}-table-tbody {
+      .@{ant-prefix}-table-row:nth-child(even) {
         td {
           background: #ffffff !important;
         }
       }
 
-      .ant-table-row:nth-child(odd) {
+      .@{ant-prefix}-table-row:nth-child(odd) {
         background-color: @zaui-table-strip-bg;
 
         td {
@@ -311,90 +333,95 @@
 }
 
 // ant-tabs
-.ant-tabs {
+.@{ant-prefix}-tabs {
   overflow: inherit !important;
   .set-text-color();
 
-  .ant-tabs-nav-list {
-    &.ant-tabs-card {
-      .ant-tabs-tab {
-        padding     : 8px var(--zaui-space-size-md, 16px);
+  .@{ant-prefix}-tabs-nav-list {
+    &.@{ant-prefix}-tabs-card {
+      .@{ant-prefix}-tabs-tab {
         margin-right: 10px;
+        padding: 8px var(--zaui-space-size-md, 16px);
       }
     }
 
-    .ant-tabs-tab {
+    .@{ant-prefix}-tabs-tab {
       .set-text-size();
-      padding    : 12px var(--zaui-space-size-md, 16px);
       margin-left: 0;
+      padding: 12px var(--zaui-space-size-md, 16px);
     }
   }
 
-  .ant-tabs-nav {
+  .@{ant-prefix}-tabs-nav {
     margin-bottom: calc(var(--zaui-space-size-md; 16px) * var(--zaui-size; 1));
   }
 
-  .ant-tabs-nav .ant-tabs-tab-btn {
+  .@{ant-prefix}-tabs-nav .@{ant-prefix}-tabs-tab-btn {
     font-size: var(--zaui-font-size-lg, 16px);
   }
 
-  &.ant-tabs-card {
-    .ant-tabs-nav .ant-tabs-tab-btn {
+  &.@{ant-prefix}-tabs-card {
+    .@{ant-prefix}-tabs-tab {
+      margin-right: 10px !important;
+      padding: 8px calc(var(--zaui-space-size-md, 16px) * var(--zaui-size, 1)) !important;
+    }
+
+    .@{ant-prefix}-tabs-nav .@{ant-prefix}-tabs-tab-btn {
       font-size: var(--zaui-font-size, 14px);
     }
   }
 }
 
 // 按钮
-.ant-btn {
+.@{ant-prefix}-btn {
   .set-text-color();
   font-size: @zaui-font-size;
 
-  .ant-btn-primary {
-    color       : #fff;
-    background  : @zaui-brand;
+  .@{ant-prefix}-btn-primary {
+    color: #fff;
+    background: @zaui-brand;
     border-color: @zaui-brand;
   }
 
-  &.ant-btn-primary[disabled],
-  &.ant-btn-primary[disabled]:hover,
-  &.ant-btn-primary[disabled]:focus,
-  &.ant-btn-primary[disabled]:active {
-    color       : #fff;
-    text-shadow : none;
-    background  : @zaui-brand;
+  &.@{ant-prefix}-btn-primary[disabled],
+  &.@{ant-prefix}-btn-primary[disabled]:hover,
+  &.@{ant-prefix}-btn-primary[disabled]:focus,
+  &.@{ant-prefix}-btn-primary[disabled]:active {
+    color: #fff;
+    text-shadow: none;
+    background: @zaui-brand;
     border-color: @zaui-brand;
-    box-shadow  : none;
-    opacity     : 0.6;
+    box-shadow: none;
+    opacity: 0.6;
   }
 
-  &.ant-btn-link[disabled],
-  &.ant-btn-link[disabled]:hover,
-  &.ant-btn-link[disabled]:focus,
-  &.ant-btn-link[disabled]:active {
-    color       : @zat-disabled-color;
-    text-shadow : none;
-    background  : none;
+  &.@{ant-prefix}-btn-link[disabled],
+  &.@{ant-prefix}-btn-link[disabled]:hover,
+  &.@{ant-prefix}-btn-link[disabled]:focus,
+  &.@{ant-prefix}-btn-link[disabled]:active {
+    color: @zat-disabled-color;
+    text-shadow: none;
+    background: none;
     border-color: none;
-    box-shadow  : none;
-    opacity     : 0.6;
+    box-shadow: none;
+    opacity: 0.6;
   }
 
-  &.ant-btn-link {
+  &.@{ant-prefix}-btn-link {
     .set-brand-color();
   }
 }
 
 // 分割线
-.ant-divider {
-  .ant-divider-inner-text {
+.@{ant-prefix}-divider {
+  .@{ant-prefix}-divider-inner-text {
     .set-text-color();
     .set-text-size();
   }
 }
 
 // 卡片
-.ant-card {
+.@{ant-prefix}-card {
   margin-bottom: @zaui-space-size-md;
 
   &:last-child {
@@ -403,23 +430,23 @@
 }
 
 // 分页
-.ant-pagination {
-  color    : @zaui-text  !important;
-  font-size: @zaui-font-size  !important;
+.@{ant-prefix}-pagination {
+  color: @zaui-text !important;
+  font-size: @zaui-font-size !important;
 
-  &.ant-table-pagination {
+  &.@{ant-prefix}-table-pagination {
     margin: @zaui-height-size-md 0;
   }
 
-  .ant-pagination-item {
-    min-width       : 32px;
-    height          : 32px;
-    margin-right    : 8px;
-    font-size       : @zaui-font-size;
-    line-height     : 32px;
+  .@{ant-prefix}-pagination-item {
+    min-width: 32px;
+    height: 32px;
+    margin-right: 8px;
+    font-size: @zaui-font-size;
+    line-height: 32px;
     background-color: #f7f9fa;
-    border          : 0;
-    border-radius   : @zaui-border-radius;
+    border: 0;
+    border-radius: @zaui-border-radius;
 
     a {
       .set-text-color();
@@ -430,35 +457,35 @@
     }
   }
 
-  .ant-pagination-options-size-changer.ant-select-show-arrow {
+  .@{ant-prefix}-pagination-options-size-changer.@{ant-prefix}-select-show-arrow {
     margin-right: 5px;
   }
 
-  .ant-pagination-item-active a {
-    color        : #fff;
-    background   : @zaui-brand;
+  .@{ant-prefix}-pagination-item-active a {
+    color: #fff;
+    background: @zaui-brand;
     border-radius: @zaui-border-radius;
   }
 
-  .ant-pagination-item-active:focus-visible a,
-  .ant-pagination-item-active:hover a {
+  .@{ant-prefix}-pagination-item-active:focus-visible a,
+  .@{ant-prefix}-pagination-item-active:hover a {
     color: #fff;
   }
 
-  .ant-pagination-prev,
-  .ant-pagination-next,
-  .ant-pagination-jump-prev,
-  .ant-pagination-jump-next {
-    min-width       : 32px;
-    height          : 32px;
-    line-height     : 30px;
+  .@{ant-prefix}-pagination-prev,
+  .@{ant-prefix}-pagination-next,
+  .@{ant-prefix}-pagination-jump-prev,
+  .@{ant-prefix}-pagination-jump-next {
+    min-width: 32px;
+    height: 32px;
+    line-height: 30px;
     background-color: #f7f9fa;
-    border          : 0;
-    border-radius   : @zaui-border-radius;
+    border: 0;
+    border-radius: @zaui-border-radius;
   }
 
-  .ant-pagination-prev,
-  .ant-pagination-next {
+  .@{ant-prefix}-pagination-prev,
+  .@{ant-prefix}-pagination-next {
     svg {
       .set-text-color();
       .set-text-size();
@@ -471,86 +498,85 @@
     }
   }
 
-  .ant-pagination-prev .ant-pagination-item-link,
-  .ant-pagination-next .ant-pagination-item-link {
-    min-width       : 32px;
-    height          : 32px;
-    line-height     : 32px;
+  .@{ant-prefix}-pagination-prev .@{ant-prefix}-pagination-item-link,
+  .@{ant-prefix}-pagination-next .@{ant-prefix}-pagination-item-link {
+    min-width: 32px;
+    height: 32px;
+    line-height: 32px;
     background-color: #fafafa;
-    border          : 0;
-    border-radius   : @zaui-border-radius;
+    border: 0;
+    border-radius: @zaui-border-radius;
   }
 
-  .ant-select-single:not(.ant-select-customize-input) .ant-select-selector {
+  .@{ant-prefix}-select-single:not(.@{ant-prefix}-select-customize-input) .@{ant-prefix}-select-selector {
     .set-text-color();
     .set-text-size();
-    width  : 100%;
-    height : 32px;
+    width: 100%;
+    height: 32px;
     padding: 0 12px;
   }
 
-  .ant-select:not(.ant-select-customize-input) .ant-select-selector {
-    position        : relative;
+  .@{ant-prefix}-select:not(.@{ant-prefix}-select-customize-input) .@{ant-prefix}-select-selector {
+    position: relative;
     background-color: #fafafa;
-    border          : 0;
-    border-radius   : @zaui-border-radius;
+    border: 0;
+    border-radius: @zaui-border-radius;
   }
 
-  .ant-pagination-jump-prev .ant-pagination-item-container .ant-pagination-item-link-icon,
-  .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-link-icon {
+  .@{ant-prefix}-pagination-jump-prev .@{ant-prefix}-pagination-item-container .@{ant-prefix}-pagination-item-link-icon,
+  .@{ant-prefix}-pagination-jump-next .@{ant-prefix}-pagination-item-container .@{ant-prefix}-pagination-item-link-icon {
     color: @zaui-brand;
   }
 }
 
 // ant-descriptions
-.ant-descriptions {
-
-  .ant-descriptions-item-label,
-  .ant-descriptions-item-content {
+.@{ant-prefix}-descriptions {
+  .@{ant-prefix}-descriptions-item-label,
+  .@{ant-prefix}-descriptions-item-content {
     .set-text-color();
     .set-text-size();
   }
 }
 
 // ant-breadcrumb
-.ant-breadcrumb {
+.@{ant-prefix}-breadcrumb {
   .set-text-size();
 
-  .ant-breadcrumb-link {
+  .@{ant-prefix}-breadcrumb-link {
     .set-lg-text-size();
   }
 }
 
 // ant-menu
-.ant-menu {
-  color    : @zaui-text  !important;
-  font-size: @zaui-font-size  !important;
+.@{ant-prefix}-menu {
+  color: @zaui-text !important;
+  font-size: @zaui-font-size !important;
 
-  .ant-menu-item a {
+  .@{ant-prefix}-menu-item a {
     .set-text-color();
   }
 
-  .ant-menu-item-selected a,
-  .ant-menu-item-selected a:hover {
+  .@{ant-prefix}-menu-item-selected a,
+  .@{ant-prefix}-menu-item-selected a:hover {
     .set-brand-color();
   }
 }
 
-.ant-btn-primary {
+.@{ant-prefix}-btn-primary {
   color: #fff;
 }
 
 // 下拉框三角样式替换
-.ant-select {
-  .ant-select-arrow {
+.@{ant-prefix}-select {
+  .@{ant-prefix}-select-arrow {
     .anticon-down {
-      width         : 0;
-      height        : 0;
+      width: 0;
+      height: 0;
       vertical-align: middle;
-      border-top    : 6px solid #909090;
-      border-right  : 5px solid transparent;
-      border-left   : 5px solid transparent;
-      transition    : transform 0.3s;
+      border-top: 6px solid #909090;
+      border-right: 5px solid transparent;
+      border-left: 5px solid transparent;
+      transition: transform 0.3s;
 
       svg {
         display: none;
@@ -559,24 +585,24 @@
   }
 
   // 多选样式重置
-  &.ant-select-multiple {
-    .ant-select-selection-item {
-      align-items  : center;
+  &.@{ant-prefix}-select-multiple {
+    .@{ant-prefix}-select-selection-item {
+      align-items: center;
       padding-right: 7px;
-      background   : #f2f3f5;
+      background: #f2f3f5;
 
-      .ant-select-selection-item-remove {
-        display        : flex;
-        align-items    : center;
+      .@{ant-prefix}-select-selection-item-remove {
+        display: flex;
+        align-items: center;
         justify-content: center;
-        width          : 14px;
-        height         : 14px;
-        background     : #e0e1e7;
-        border-radius  : 100%;
+        width: 14px;
+        height: 14px;
+        background: #e0e1e7;
+        border-radius: 100%;
 
         .anticon-close {
           margin-top: 2px;
-          color     : #4e5969;
+          color: #4e5969;
         }
       }
     }
@@ -584,43 +610,42 @@
 }
 
 // 表格样式重置
-.ant-form {
+.@{ant-prefix}-form {
   .pro-form-control {
-    .ant-btn-primary {
+    .@{ant-prefix}-btn-primary {
       margin-right: @zaui-height-size-md;
     }
 
-    .ant-btn-default {
+    .@{ant-prefix}-btn-default {
       margin-left: 0;
     }
   }
 }
 
 // 弹窗
-.ant-modal {
-  .ant-modal-header {
+.@{ant-prefix}-modal {
+  .@{ant-prefix}-modal-header {
     border-bottom: none;
   }
 
-  .ant-modal-footer {
+  .@{ant-prefix}-modal-footer {
     border-top: none;
   }
 }
 
 // 数字输入框
-.ant-input-number {
+.@{ant-prefix}-input-number {
   width: 100%;
 }
 
-.ant-input-textarea {
+.@{ant-prefix}-input-textarea {
   position: relative;
 
-  textarea.ant-input {
+  textarea.@{ant-prefix}-input {
     padding-bottom: 20px;
   }
 
-
-  &.ant-input-textarea-show-count.ant-input-textarea-in-form-item {
+  &.@{ant-prefix}-input-textarea-show-count.@{ant-prefix}-input-textarea-in-form-item {
     &::after {
       background: transparent;
     }
@@ -632,52 +657,51 @@
     }
 
     &::after {
-      position     : absolute;
-      right        : 16px;
-      bottom       : 1px;
+      position: absolute;
+      right: 16px;
+      bottom: 1px;
+      width: calc(100% - 18px);
       margin-bottom: 0;
-      background   : #fff;
-      width        : calc(100% - 18px);
-      text-align   : right;
+      text-align: right;
+      background: #fff;
     }
   }
 }
 
 // 间隔
-.ant-space {
-  &.ant-space-vertical {
+.@{ant-prefix}-space {
+  &.@{ant-prefix}-space-vertical {
     display: flex;
-    width  : 100%;
+    width: 100%;
   }
 }
 
 // Cascader级联选择
-.ant-cascader {
-  .ant-cascader-menu {
-    height    : auto;
+.@{ant-prefix}-cascader {
+  .@{ant-prefix}-cascader-menu {
+    height: auto;
     max-height: 326px;
   }
 }
 
-.ant-select-dropdown {
-
+.@{ant-prefix}-select-dropdown {
   // tree select 样式重置
-  .ant-select-tree .ant-select-tree-node-content-wrapper {
-    min-height : 0px;
+  .@{ant-prefix}-select-tree .@{ant-prefix}-select-tree-node-content-wrapper {
+    min-height: 0px;
     line-height: initial;
   }
 
-  .ant-select-tree .ant-select-tree-treenode {
-    padding-top   : 4px;
+  .@{ant-prefix}-select-tree .@{ant-prefix}-select-tree-treenode {
+    padding-top: 4px;
     padding-bottom: 4px;
   }
 
-  .ant-select-tree .ant-select-tree-treenode {
+  .@{ant-prefix}-select-tree .@{ant-prefix}-select-tree-treenode {
     align-items: center;
   }
 }
 
 // 气泡框样式
-.ant-popover {
+.@{ant-prefix}-popover {
   width: max-content;
 }