test/ant-design
1
0
Fork 0
mirror of https://gitee.com/ant-design/ant-design.git synced 2024-12-01 11:39:28 +08:00
Code Issues Actions 69 Packages Projects Releases Wiki Activity

style: add anchor rtl (#22875)

Browse Source
This commit is contained in:
xrkffgg 2020-04-07 10:55:36 +08:00 committed by GitHub
parent 8dbaf66c2b
commit 934fe16690
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 46 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
components/anchor/Anchor.tsx
View File

@ -274,7 +274,7 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
}
};
renderAnchor = ({ getPrefixCls }: ConfigConsumerProps) => {
renderAnchor = ({ getPrefixCls, direction }: ConfigConsumerProps) => {
const {
prefixCls: customizePrefixCls,
className = '',
@ -298,7 +298,9 @@ export default class Anchor extends React.Component<AnchorProps, AnchorState> {
visible: activeLink,
});
const wrapperClass = classNames(className, `${prefixCls}-wrapper`);
const wrapperClass = classNames(className, `${prefixCls}-wrapper`, {
[`${prefixCls}-rtl`]: direction === 'rtl',
});
const anchorClass = classNames(prefixCls, {
fixed: !affix && !showInkInFixed,

2
components/anchor/style/index.less
View File

@ -80,3 +80,5 @@
padding-bottom: 5px;
}
}
@import './rtl';

40
components/anchor/style/rtl.less Normal file
View File

@ -0,0 +1,40 @@
@import '../../style/themes/index';
@import '../../style/mixins/index';
@anchor-border-width: 2px;
.@{ant-prefix}-anchor {
&-rtl {
direction: rtl;
}
&-wrapper {
.@{ant-prefix}-anchor-rtl& {
margin-right: -4px;
margin-left: 0;
padding-right: 4px;
padding-left: 0;
}
}
&-ink {
.@{ant-prefix}-anchor-rtl & {
right: 0;
left: auto;
}
&-ball {
.@{ant-prefix}-anchor-rtl & {
right: 50%;
left: 0;
transform: translateX(50%);
}
}
}
&-link {
.@{ant-prefix}-anchor-rtl & {
padding: 7px 16px 7px 0;
}
}
}