Fix alignment of replies in RTL languages

`<li>` elements have a default style of `text-align: match-parent`. This
resulted in a computed `text-align: left` style for paragraphs in replies, which
have an `<li>` ancestor. As a result replies written in RTL languages (eg.
Hebrew) were rendered left-to-right, instead of right-to-left as intended. Fix
this by adding a `text-align: start` on the `<li>`. This sets the alignment for
descendants to match the computed `direction` property. The `direction` for
replies is computed based on their content due to a `dir="auto"` attribute on
`StyledText` components.

Fixes https://github.com/hypothesis/client/issues/4705

src/sidebar/components/Thread.js

@@ -205,7 +205,15 @@ function Thread({ thread, threadsService }) {
             data-testid="thread-children"
           >
             {visibleChildren.map(child => (
-              <li key={child.id} className="mt-2">
+              <li
+                key={child.id}
+                className={classnames(
+                  'mt-2',
+                  // Ensure correct rendering of replies with RTL content.
+                  // See https://github.com/hypothesis/client/issues/4705.
+                  '[text-align:start]'
+                )}
+              >
                 <Thread thread={child} threadsService={threadsService} />
               </li>
             ))}