Commit 61f53cfaed61de12e44d8cc2eea7b562bd75e3ea

Authored by 陈洋
1 parent cdc672d8

pref: modal 关闭图标修改 样式优化

... ... @@ -347,7 +347,7 @@ export const QxAppSelector: React.FC<QxAppSelectProps> = ({
347 347 closeIcon={
348 348 <QxBaseIcon
349 349 className={'qx-common__modal--close'}
350   - type={'icon-close'}
  350 + type={'qx-icon-close'}
351 351 />
352 352 }
353 353 keyboard={false}
... ...
... ... @@ -41,6 +41,8 @@ import { QxBaseIcon } from '@qx/common';
41 41 import Icon from '@ant-design/icons';
42 42 import { SubNodeIcon } from './sub-node-icon';
43 43
  44 +import '../style/reset.less';
  45 +
44 46 type ValueOptionProps = {
45 47 key: number | string;
46 48 value: string;
... ... @@ -724,6 +726,13 @@ const ParameterModal: React.FC<ParameterSettingProps> = (props) => {
724 726 // onOk={handleCancel}
725 727 onCancel={onCancel}
726 728 width={960}
  729 + wrapClassName={'qx-common__modal'}
  730 + closeIcon={
  731 + <QxBaseIcon
  732 + className={'qx-common__modal--close'}
  733 + type={'qx-icon-close'}
  734 + />
  735 + }
727 736 >
728 737 {isShowJson ? (
729 738 <Row>
... ...
1 1 @import '~@qx/ui/src/style/variable.less';
2 2
  3 +* {
  4 + scrollbar-width: thin;
  5 + font-variant-numeric: tabular-nums; // tabular-nums 可以达到数字等宽的效果
  6 + box-sizing: border-box;
  7 + outline: none;
  8 + // 覆盖 antd+CSS3 样式
  9 + // 当用户使用鼠标点击焦点元素或使用键盘的 Tab 键(或快捷键)触发焦点元素焦点环的样式
  10 + &.focus-visible {
  11 + outline: none;
  12 + }
  13 +}
  14 +
  15 +// 全局滚动条样式重设
  16 +::-webkit-scrollbar {
  17 + width: 9px;
  18 + height: 12px;
  19 + padding: 2px 0;
  20 + background-color: #fafafa;
  21 +}
  22 +
  23 +::-webkit-scrollbar-button,
  24 +::-webkit-scrollbar-corner {
  25 + display: none;
  26 + width: 0;
  27 + height: 0;
  28 +}
  29 +
  30 +::-webkit-scrollbar-thumb {
  31 + width: 6px;
  32 + height: 8px;
  33 + background: rgba(0, 0, 0, 0.1);
  34 + background-clip: padding-box;
  35 + border: 2px solid transparent;
  36 + border-radius: 6px;
  37 +}
  38 +
3 39 .qx-common__modal {
4 40 .ant-modal-content {
5 41 padding: 0;
... ... @@ -28,7 +64,7 @@
28 64 align-items: center;
29 65 justify-content: center;
30 66 width: 20px;
31   - height: 24px;
  67 + height: 20px;
32 68 padding: 0;
33 69
34 70 .qx-common__modal--close {
... ... @@ -36,9 +72,9 @@
36 72 align-items: center;
37 73 justify-content: center;
38 74 width: 20px;
39   - height: 24px;
  75 + height: 20px;
40 76 color: @N7;
41   - font-size: 12px !important;
  77 + font-size: 16px;
42 78
43 79 &:hover {
44 80 color: @N9;
... ...