Support for auto-detection of direction for component with varying content
This commit is contained in:
parent
cf98e65a3f
commit
2ae3484363
4 changed files with 7 additions and 7 deletions
|
@ -94,11 +94,11 @@ const Button = forwardRef<any, {}>((props: Props, ref: any) => {
|
|||
<span className="button__content">
|
||||
{icon && <Icon icon={icon} iconColor={iconColor} size={iconSize} />}
|
||||
|
||||
{!largestLabel && label && <span className="button__label">{label}</span>}
|
||||
{!largestLabel && label && <span dir="auto" className="button__label">{label}</span>}
|
||||
|
||||
{/* largestLabel is used when a single button has two different labels based on hover state */}
|
||||
{largestLabel && (
|
||||
<div className="button__label" style={{ position: 'relative' }}>
|
||||
<div dir="auto" className="button__label" style={{ position: 'relative' }}>
|
||||
<div
|
||||
style={{
|
||||
position: 'relative',
|
||||
|
|
|
@ -128,7 +128,7 @@ const MarkdownPreview = (props: MarkdownProps) => {
|
|||
// Remove new lines and extra space
|
||||
remarkOptions.remarkReactComponents.p = SimpleText;
|
||||
return (
|
||||
<span className="markdown-preview">
|
||||
<span dir="auto" className="markdown-preview">
|
||||
{
|
||||
remark()
|
||||
.use(remarkStrip)
|
||||
|
@ -140,7 +140,7 @@ const MarkdownPreview = (props: MarkdownProps) => {
|
|||
}
|
||||
|
||||
return (
|
||||
<div className="markdown-preview">
|
||||
<div dir="auto" className="markdown-preview">
|
||||
{
|
||||
remark()
|
||||
.use(remarkAttr, remarkAttrOpts)
|
||||
|
|
|
@ -57,7 +57,7 @@ class UriIndicator extends React.PureComponent<Props> {
|
|||
return null;
|
||||
}
|
||||
|
||||
return <span className={classnames('channel-name', { 'channel-name--inline': inline })}>Anonymous</span>;
|
||||
return <span dir="auto" className={classnames('channel-name', { 'channel-name--inline': inline })}>Anonymous</span>;
|
||||
}
|
||||
|
||||
const channelClaim = isChannelClaim ? claim : claim.signing_channel;
|
||||
|
@ -66,7 +66,7 @@ class UriIndicator extends React.PureComponent<Props> {
|
|||
const { name } = channelClaim;
|
||||
const channelLink = link ? channelClaim.canonical_url || channelClaim.permanent_url : false;
|
||||
|
||||
const inner = <span className={classnames('channel-name', { 'channel-name--inline': inline })}>{name}</span>;
|
||||
const inner = <span dir="auto" className={classnames('channel-name', { 'channel-name--inline': inline })}>{name}</span>;
|
||||
|
||||
if (!channelLink) {
|
||||
return inner;
|
||||
|
|
|
@ -87,7 +87,7 @@ class ReportPage extends React.Component {
|
|||
title={__('Developer?')}
|
||||
actions={
|
||||
<Fragment>
|
||||
<div className="markdown-preview">
|
||||
<div dir="auto" className="markdown-preview">
|
||||
<p>{__('You can also:')}</p>
|
||||
<ul>
|
||||
<li>
|
||||
|
|
Loading…
Reference in a new issue