style: add rtl.less of InputNumber (#22434)

* seyle: add rtl.less of InputNumber

* fix: snap
This commit is contained in:
xrkffgg 2020-03-20 14:43:32 +08:00 committed by GitHub
parent c9927b9b8d
commit 1f79c76b80
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 29 additions and 2 deletions

View File

@ -2,7 +2,7 @@
exports[`InputNumber rtl render component should be rendered correctly in RTL direction 1`] = `
<div
class="ant-input-number"
class="ant-input-number ant-input-number-rtl"
>
<div
class="ant-input-number-handler-wrap"

View File

@ -54,7 +54,7 @@ export default class InputNumber extends React.Component<InputNumberProps, any>
this.inputNumberRef.blur();
}
renderInputNumber = ({ getPrefixCls }: ConfigConsumerProps) => {
renderInputNumber = ({ getPrefixCls, direction }: ConfigConsumerProps) => {
const { className, size: customizeSize, prefixCls: customizePrefixCls, ...others } = this.props;
const prefixCls = getPrefixCls('input-number', customizePrefixCls);
const upIcon = <UpOutlined className={`${prefixCls}-handler-up-inner`} />;
@ -68,6 +68,7 @@ export default class InputNumber extends React.Component<InputNumberProps, any>
{
[`${prefixCls}-lg`]: mergeSize === 'large',
[`${prefixCls}-sm`]: mergeSize === 'small',
[`${prefixCls}-rtl`]: direction === 'rtl',
},
className,
);

View File

@ -182,3 +182,5 @@
color: @disabled-color;
}
}
@import './rtl';

View File

@ -0,0 +1,24 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@import '../../input/style/mixin';
@input-number-prefix-cls: ~'@{ant-prefix}-input-number';
.@{input-number-prefix-cls} {
&-handler-wrap {
.@{input-number-prefix-cls}-rtl & {
right: auto;
left: 0;
border-right: @border-width-base @border-style-base @input-number-handler-border-color;
border-left: 0;
border-radius: @border-radius-base 0 0 @border-radius-base;
}
}
&-input {
.@{input-number-prefix-cls}-rtl & {
direction: rtl;
text-align: right;
}
}
}