diff --git a/devtools/client/inspector/compatibility/components/IssueItem.js b/devtools/client/inspector/compatibility/components/IssueItem.js index cad46e6213b2..f4622b725254 100644 --- a/devtools/client/inspector/compatibility/components/IssueItem.js +++ b/devtools/client/inspector/compatibility/components/IssueItem.js @@ -101,7 +101,15 @@ class IssueItem extends PureComponent { { className: "compatibility-issue-item__aliases", }, - aliases.map(alias => dom.li({ key: alias }, alias)) + aliases.map(alias => + dom.li( + { + key: alias, + className: "compatibility-issue-item__alias", + }, + alias + ) + ) ); } diff --git a/devtools/client/inspector/compatibility/test/node/components/__snapshots__/components-compatibility-IssueItem.test.js.snap b/devtools/client/inspector/compatibility/test/node/components/__snapshots__/components-compatibility-IssueItem.test.js.snap index 52f6d6f7d41b..924c47673b73 100644 --- a/devtools/client/inspector/compatibility/test/node/components/__snapshots__/components-compatibility-IssueItem.test.js.snap +++ b/devtools/client/inspector/compatibility/test/node/components/__snapshots__/components-compatibility-IssueItem.test.js.snap @@ -59,11 +59,13 @@ exports[`IssueItem component renders a prefixNeeded issue of CSS property 1`] = className="compatibility-issue-item__aliases" >
  • test-alias-1
  • test-alias-2 @@ -131,11 +133,13 @@ exports[`IssueItem component renders an issue which has deprecated and experimen className="compatibility-issue-item__aliases" >
  • test-alias-1
  • test-alias-2 @@ -174,11 +178,13 @@ exports[`IssueItem component renders an issue which has deprecated and prefixNee className="compatibility-issue-item__aliases" >
  • test-alias-1
  • test-alias-2 @@ -217,11 +223,13 @@ exports[`IssueItem component renders an issue which has deprecated, experimental className="compatibility-issue-item__aliases" >
  • test-alias-1
  • test-alias-2 @@ -260,11 +268,13 @@ exports[`IssueItem component renders an issue which has experimental and prefixN className="compatibility-issue-item__aliases" >
  • test-alias-1
  • test-alias-2 diff --git a/devtools/client/themes/compatibility.css b/devtools/client/themes/compatibility.css index 93fae5c79043..789f0f81cde5 100644 --- a/devtools/client/themes/compatibility.css +++ b/devtools/client/themes/compatibility.css @@ -114,6 +114,7 @@ .compatibility-issue-item__mdn-link { color: var(--theme-highlight-blue); text-decoration: none; + unicode-bidi: plaintext; } .compatibility-issue-item__aliases { @@ -124,6 +125,10 @@ padding-block-end: var(--compatibility-base-unit); } +.compatibility-issue-item__alias { + unicode-bidi: plaintext; +} + .compatibility-unsupported-browser-list { list-style: none; padding: 0;