diff --git a/migrate-from-v2.md b/migrate-from-v2.md index cb1ec0b797..c6767727ad 100644 --- a/migrate-from-v2.md +++ b/migrate-from-v2.md @@ -152,12 +152,7 @@ plugins: [ #### Button -- 移除 `plain`,通过 `fill="outline"` 实现 -- 增加 `ref`,对外暴露组件内 `button` 元素 -- CSS 变量中,对 `type` 类型对应的色值的定义,不在暴露到文档中,建议使用默认值,或修改主题变量 -- 增加 `fill` 模式类型,`dashed`,修改 `fill` 默认值为 `outline`。 -- 增加 `rightIcon`,可满足同时设置左右两个icon的情况。 -- 修改 `size` 为 `large` 时的默认 `width` 为 `100%` 的值,如果使用通栏的 `button`,可搭配 `block` 来使用。 +- 去掉一些样式变量。如 `$button-default-font-weight` `$button-large-font-weight` 等。 #### Cell @@ -550,21 +545,9 @@ plugins: [ #### Dialog -- `okText` 重命名为 `confirmText`,规范命名。 -- `mask` 重命名为 `overlay`,组件库中统一使用 Overlay 组件作为遮罩层,并使用 overlay 作为是否展示遮罩层的属性值。 -- `closeOnClickOverlay` 重命名为 `closeOnOverlayClick`,组件库统一到该属性。 -- `noOkBtn` 重命名为 `hideConfirmButton`,初始值不变,依然表示是否隐藏确认按钮,主要是为了语义化更强。 -- `noCancelBtn` 重命名为 `hideCancelButton`,初始值不变,依然表示是否隐藏取消按钮,主要是为了语义化更强。 -- `okBtnDisabled` 重命名为 `disableConfirmButton`,初始值不变,依然表示是否禁用确认按钮,主要是为了语义化更强。 -- 移除 `noFooter`,使用 footer 统一处理,当 footer 为空时,及可替代该值。目前 noFooter 也需要手动声明是否为 noFooter;修改后需手动指出 footer={null} -- 移除 `textAlign`,改用样式变量 `--nutui-dialog-content-text-align` 或 SCSS 变量 `$dialog-content-text-align` 控制,默认值为 center。 -- 移除 `cancelAutoClose`,改为 `beforeCancel` 和 `beforeClose` 来实现,在点击关闭或取消时,可先触发这两个方法,以确定是否要关闭弹框,如返回true,则关闭;否则不关闭。 -- `onOk` 重命名为 `onConfirm`,规范命名。 -- `onClosed` 重命名为 `onClose`,规范命名,关闭时触发。 -- `onClickSelf` 重命名为 `onClick`,语义不变,仍表示点击弹框自身时触发事件。 -- 增加 `overlayStyle` 和 `overlayClassName`,用来配置 Overlay 组件样式。 -- 增加 `onOverlayClick`,支持点击overlay时,触发事件。 -- `onCancel` 回调不会自动关闭弹层,需主动调用 `Dialog.close(xx)` +- 修改了操作按钮上下布局的样式; +- 当只有一个主操作按钮时,主操作按钮样式撑开; +- 增加了底部icon的大小设置的样式变量;修改右侧按钮的默认值为 16 px; #### Drag diff --git a/src/config.json b/src/config.json index f1e59064e0..e8eb1400d3 100644 --- a/src/config.json +++ b/src/config.json @@ -817,6 +817,7 @@ "sort": 12, "show": true, "taro": true, + "v15": true, "author": "yangjinjun3", "dd": true }, diff --git a/src/packages/button/button.scss b/src/packages/button/button.scss index dc39cbfee2..5792e1a66b 100644 --- a/src/packages/button/button.scss +++ b/src/packages/button/button.scss @@ -17,7 +17,7 @@ padding: 0; height: $button-default-height; font-size: $button-default-font-size; - font-weight: $button-default-font-weight; + font-weight: $font-weight; text-align: center; cursor: pointer; transition: $button-transition; @@ -155,7 +155,6 @@ height: $button-xlarge-height; padding: $button-xlarge-padding; font-size: $button-xlarge-font-size; - font-weight: $button-large-font-weight; border-radius: $radius-base; .nut-button-text { @@ -172,7 +171,6 @@ } &-children { font-size: $button-xlarge-font-size; - font-weight: $button-large-font-weight; } } @@ -180,7 +178,6 @@ height: $button-large-height; padding: $button-large-padding; font-size: $button-large-font-size; - font-weight: $button-large-font-weight; border-radius: $radius-s; .nut-button-text { @@ -198,7 +195,6 @@ &-children { font-size: $button-large-font-size; - font-weight: $button-large-font-weight; } } diff --git a/src/packages/button/doc.en-US.md b/src/packages/button/doc.en-US.md index 56e42adc88..5228a54ed1 100644 --- a/src/packages/button/doc.en-US.md +++ b/src/packages/button/doc.en-US.md @@ -136,7 +136,6 @@ The component provides the following CSS variables, which can be used to customi | \--nutui-button-default-disabled-color | Disabled text color for buttons of type default | `$color-text-help` | | \--nutui-button-default-padding | Padding for buttons of type default | `0 12px` | | \--nutui-button-default-font-size | The font size of the button with type default | `$font-size-s` | -| \--nutui-button-default-font-weight | The font weight of the button with type default | `$font-weight` | | \--nutui-button-large-height | The height of the button with size large | `40px` | | \--nutui-button-large-font-size | The font size of the button with size large | `$font-size-base` | | \--nutui-button-large-border-radius | Rounded corners for buttons with size large | `12px` | diff --git a/src/packages/button/doc.md b/src/packages/button/doc.md index 932b840d50..8593e5cc01 100644 --- a/src/packages/button/doc.md +++ b/src/packages/button/doc.md @@ -135,7 +135,6 @@ import { Button } from '@nutui/nutui-react' | \--nutui-button-default-disabled-color | type 为 default 的按钮的禁用文本色 | `$color-text-help` | | \--nutui-button-default-padding | type 为 default 的按钮的内边距 | `0 12px` | | \--nutui-button-default-font-size | type 为 default 的按钮的字号 | `$font-size-s` | -| \--nutui-button-default-font-weight | type 为 default 的按钮的字重 | `$font-weight` | | \--nutui-button-large-height | size 为 large 的按钮的高度 | `40px` | | \--nutui-button-large-font-size | size 为 large 的按钮的字号 | `$font-size-base` | | \--nutui-button-large-border-radius | size 为 large 的按钮的圆角 | `12px` | diff --git a/src/packages/button/doc.taro.md b/src/packages/button/doc.taro.md index bf86abe76f..bb6bd7603a 100644 --- a/src/packages/button/doc.taro.md +++ b/src/packages/button/doc.taro.md @@ -148,7 +148,6 @@ import { Button } from '@nutui/nutui-react-taro' | \--nutui-button-default-disabled-color | type 为 default 的按钮的禁用文本色 | `$color-text-help` | | \--nutui-button-default-padding | type 为 default 的按钮的内边距 | `0 12px` | | \--nutui-button-default-font-size | type 为 default 的按钮的字号 | `$font-size-s` | -| \--nutui-button-default-font-weight | type 为 default 的按钮的字重 | `$font-weight` | | \--nutui-button-large-height | size 为 large 的按钮的高度 | `40px` | | \--nutui-button-large-font-size | size 为 large 的按钮的字号 | `$font-size-base` | | \--nutui-button-large-border-radius | size 为 large 的按钮的圆角 | `12px` | diff --git a/src/packages/button/doc.zh-TW.md b/src/packages/button/doc.zh-TW.md index 9bfe6d2105..72226ca296 100644 --- a/src/packages/button/doc.zh-TW.md +++ b/src/packages/button/doc.zh-TW.md @@ -136,7 +136,6 @@ import { Button } from '@nutui/nutui-react' | \--nutui-button-default-disabled-color | type 為 default 的按鈕的停用文字色 | `$color-text-help` | | \--nutui-button-default-padding | type 為 default 的按鈕的內邊距 | `0 12px` | | \--nutui-button-default-font-size | type 為 default 的按鈕的字號 | `$font-size-s` | -| \--nutui-button-default-font-weight | type 為 default 的按鈕的字重 | `$font-weight` | | \--nutui-button-large-height | size 為 large 的按鈕的高度 | `40px` | | \--nutui-button-large-font-size | size 為 large 的按鈕的字號 | `$font-size-base` | | \--nutui-button-large-border-radius | size 為 large 的按鈕的圓角 | `12px` | diff --git a/src/packages/dialog/demos/taro/demo2.tsx b/src/packages/dialog/demos/taro/demo2.tsx index d4c162c862..bfae016cde 100644 --- a/src/packages/dialog/demos/taro/demo2.tsx +++ b/src/packages/dialog/demos/taro/demo2.tsx @@ -19,7 +19,7 @@ const Demo2 = () => { setVisible2(true)} /> > & { } } + const btnClass = + hideCancelButton || hideConfirmButton ? `${classPrefix}-footer-block` : '' + return ( footer || ( <> - {!hideCancelButton && ( - - )} + {!hideCancelButton && + (footerDirection === 'vertical' ? ( + handleCancel(e as any)} + > + {cancelText || locale.cancel} + + ) : ( + + ))} + {!hideConfirmButton && ( - )} + {!hideCancelButton && + (footerDirection === 'vertical' ? ( +
handleCancel(e)} + > + {cancelText || locale.cancel} +
+ ) : ( + + ))} {!hideConfirmButton && (