@aplus-frontend/ui 0.3.13 → 0.4.0

package/theme/antd-global-overwrite/aplus/alert.less

@@ -0,0 +1,62 @@
+.ant-alert {
+  align-items: flex-start;
+  width: 100%;
+  padding: 6px 12px;
+  border-radius: 4px;
+
+  .ant-alert-close-icon {
+    line-height: 18px;
+  }
+
+  .ant-alert-icon {
+    font-size: 16px;
+    transform: translateY(1px);
+    margin-inline-end: 8px;
+  }
+
+  .ant-alert-message {
+    color: #182948;
+    font-weight: normal !important;
+    font-size: 12px;
+    line-height: 18px;
+
+    .href {
+      color: #0070ff;
+      cursor: pointer;
+    }
+  }
+
+  .ant-alert-description {
+    color: #182948;
+    font-weight: normal;
+    font-size: 12px;
+    line-height: 18px;
+  }
+}
+
+.ant-alert-with-description {
+  .ant-alert-message {
+    margin-bottom: 4px;
+    font-weight: bold !important;
+  }
+}
+
+.ant-alert-warning {
+  background: rgba(255, 169, 64, 0.1);
+  border: 1px solid rgba(255, 169, 64, 0.4);
+}
+
+.ant-alert-info {
+  background: rgba(0, 112, 255, 0.1);
+  border: 1px solid rgba(0, 112, 255, 0.4);
+}
+
+.ant-alert-success {
+  background: rgba(46, 209, 163, 0.1);
+  border: 1px solid rgba(46, 209, 163, 0.4);
+}
+
+.ant-alert-error {
+  background: rgba(255, 77, 79, 0.1);
+  border: 1px solid rgba(255, 77, 79, 0.4);
+}

package/theme/antd-global-overwrite/aplus/button.css

@@ -0,0 +1,27 @@
+.ant-btn {
+  box-shadow: none;
+}
+.ant-btn-primary[disabled],
+.ant-btn-primary[disabled]:hover {
+  color: #ffffff !important;
+  background: #cce2ff !important;
+  border-color: #cce2ff !important;
+}
+.ant-btn-dangerous[disabled],
+.ant-btn-dangerous[disabled]:hover {
+  color: #ffffff !important;
+  background: #ffdbdc !important;
+  border-color: #ffdbdc !important;
+}
+.ant-btn-default[disabled],
+.ant-btn-default[disabled]:hover {
+  color: #abb7cc !important;
+  background: #f9f9fa !important;
+  border-color: #dee4ed !important;
+}
+.ant-btn-link[disabled],
+.ant-btn-link[disabled]:hover,
+.ant-btn-text[disabled],
+.ant-btn-text[disabled]:hover {
+  color: #cce2ff !important;
+}

package/theme/antd-global-overwrite/aplus/button.less

@@ -0,0 +1,31 @@
+.ant-btn {
+  box-shadow: none;
+}
+
+.ant-btn-primary[disabled],
+.ant-btn-primary[disabled]:hover {
+  color: #ffffff !important;
+  background: #cce2ff !important;
+  border-color: #cce2ff !important;
+}
+
+.ant-btn-dangerous[disabled],
+.ant-btn-dangerous[disabled]:hover {
+  color: #ffffff !important;
+  background: #ffdbdc !important;
+  border-color: #ffdbdc !important;
+}
+
+.ant-btn-default[disabled],
+.ant-btn-default[disabled]:hover {
+  color: #abb7cc !important;
+  background: #f9f9fa !important;
+  border-color: #dee4ed !important;
+}
+
+.ant-btn-link[disabled],
+.ant-btn-link[disabled]:hover,
+.ant-btn-text[disabled],
+.ant-btn-text[disabled]:hover {
+  color: #cce2ff !important;
+}

package/theme/antd-global-overwrite/aplus/form.css

@@ -0,0 +1,87 @@
+.ant-form .ant-form-item label {
+  font-weight: normal;
+}
+.ant-form .ant-form-item label svg {
+  color: #0070ff;
+}
+.ant-form .ant-form-item-control {
+  padding-left: 0;
+}
+.ant-form .ant-form-item-control .ant-form-item-explain-error {
+  font-size: 12px;
+}
+.ant-input::-moz-placeholder {
+  color: #abb7cc;
+}
+.ant-input::placeholder {
+  color: #abb7cc;
+}
+.ant-select .ant-select-selection-placeholder {
+  color: #abb7cc;
+}
+.ant-picker .ant-picker-input > input::-moz-placeholder {
+  color: #abb7cc;
+}
+.ant-picker .ant-picker-input > input::placeholder {
+  color: #abb7cc;
+}
+.ant-input-number .ant-input-number-input-wrap > input::-moz-placeholder {
+  color: #abb7cc;
+}
+.ant-input-number .ant-input-number-input-wrap > input::placeholder {
+  color: #abb7cc;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item {
+  margin-bottom: 16px;
+  /** 适配Aplus UI */
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation {
+  border: 1px solid #dee4ed;
+  border-radius: 4px;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-label,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-label {
+  padding-left: 12px;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-label label,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-label label {
+  height: 30px;
+  color: #182948;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input {
+  min-height: 30px;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-select-selector,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-select-selector,
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-input-affix-wrapper,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-input-affix-wrapper,
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-input-number,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-input-number,
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-picker,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-picker {
+  height: 30px;
+  border: none;
+  border-color: #dee4ed;
+  box-shadow: none;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-input-number,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-input-number,
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-picker,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] .ant-form-item.aplus-ui-adaptation .ant-form-item-control-input .ant-picker {
+  width: 100%;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] div.ant-col[tableaction] .ant-form-item-control-input-content button.submit,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] div.ant-col[tableaction] .ant-form-item-control-input-content button.submit {
+  margin-right: 0.5rem;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] div.ant-col[tableaction] .ant-form-item-control-input-content button.reset,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] div.ant-col[tableaction] .ant-form-item-control-input-content button.reset {
+  margin-right: 0;
+}
+div[class$='-basic-table-form-container'] form[class$='-basic-form--compact'] div.ant-col[tableaction] .ant-form-item-control-input-content button.collapse,
+div[class$='-basic-table-form-container ap-table--sticky'] form[class$='-basic-form--compact'] div.ant-col[tableaction] .ant-form-item-control-input-content button.collapse {
+  margin-left: 0.5rem;
+}

package/theme/antd-global-overwrite/aplus/form.less

@@ -0,0 +1,133 @@
+@import '../../mixins/config.less';
+@ad: ~'@{ns}-ui-adaptation';
+
+.ant-form {
+  .ant-form-item {
+    // label style
+    label {
+      font-weight: normal;
+
+      svg {
+        color: #0070ff;
+      }
+    }
+  }
+
+  .ant-form-item-control {
+    padding-left: 0;
+    // error style
+    .ant-form-item-explain-error {
+      font-size: 12px;
+    }
+    // Radio style
+    // .ant-radio-wrapper .ant-radio {
+    //   &.ant-radio-checked {
+    //     .ant-radio-inner {
+    //       background-color: #ffffff;
+    //       border-color: #0070ff;
+
+    //       &::after {
+    //         background-color: #0070ff;
+    //       }
+    //     }
+    //   }
+    // }
+    // Select style
+    // .ant-select {
+    //   &.ant-select-disabled {
+    //     .ant-select-selector {
+    //       color: #526a90;
+    //       background-color: #f2f6f9;
+    //     }
+    //   }
+    // }
+  }
+}
+
+// placeholder style
+.ant-input::placeholder {
+  color: #abb7cc;
+}
+
+.ant-select .ant-select-selection-placeholder {
+  color: #abb7cc;
+}
+
+.ant-picker .ant-picker-input > input::placeholder {
+  color: #abb7cc;
+}
+
+.ant-input-number .ant-input-number-input-wrap > input::placeholder {
+  color: #abb7cc;
+}
+
+// input disabled styles
+// input.ant-input[disabled] {
+//   color: #526a90;
+// }
+
+// span.ant-input-affix-wrapper-disabled {
+//   background-color: #f2f6f9;
+// }
+
+// 兼容 table 里面 过滤器样式
+// 新增对sticky表格的样式类型
+div[class$='-basic-table-form-container'],
+div[class$='-basic-table-form-container ap-table--sticky'] {
+  form[class$='-basic-form--compact'] {
+    .ant-form-item {
+      margin-bottom: 16px;
+
+      /** 适配Aplus UI */
+      &.@{ad} {
+        border: 1px solid #dee4ed;
+        border-radius: 4px;
+
+        .ant-form-item-label {
+          padding-left: 12px;
+
+          label {
+            height: 30px;
+            color: #182948;
+          }
+        }
+
+        .ant-form-item-control-input {
+          min-height: 30px;
+          // Select Input InputNumber Picker
+          .ant-select-selector,
+          .ant-input-affix-wrapper,
+          .ant-input-number,
+          .ant-picker {
+            height: 30px;
+            border: none;
+            border-color: #dee4ed;
+            box-shadow: none;
+          }
+
+          .ant-input-number,
+          .ant-picker {
+            width: 100%;
+          }
+        }
+      }
+    }
+
+    // 按钮布局调整
+    div.ant-col[tableaction] {
+      .ant-form-item-control-input-content {
+        button.submit {
+          margin-right: 0.5rem;
+        }
+
+        button.reset {
+          margin-right: 0;
+        }
+
+        button.collapse {
+          margin-left: 0.5rem;
+        }
+      }
+    }
+  }
+}