RTL support for user content in the app

[magicznyleszek]

Checklist

1. If you've added code that should be tested, add tests
2. If you've changed APIs, update (or create!) the documentation
3. Ensure the tests pass
4. Make sure that your code lints and that you've followed our coding style
5. Write a title and, if necessary, a description of your work suitable for publishing in our release notes
6. Mention any related issues in this repository (as #ISSUE) and in other repositories (as kobotoolbox/other#ISSUE)
7. Open an issue in the docs if there are UI/UX changes

Description

Almost all the places that display user-generated content will now correctly display RTL text (regardless of the app language selected in settings, i.e. Arabic text in English UI will be displayed as RTL).

Notes

Good reading on styling RTL: https://rtlstyling.com/

Things changed:

• Basically every place in UI that displays asset name or description, or question name
• Added dir="auto" to a lot of places - it makes the browser built-in functionality decide how to render the contents of given HTML node. Some notable components (that will handle RTL out of the box now):
  • KoboTagsInput
  • KoboSelect
  • MultiCheckbox
  • TextBox (this was already done in [TASK-548] NLP add rtl script support #4904)
  • partially ToggleSwitch: it now works correctly when parent gives it dir="auto"
• Migrated few margin-* to margin-inline-*, as the first doesn't changed when RTL direction kicks in, and the latter does it awesomely (Note: we should most probably migrate much more margins in future)
• Migrated few text-align: left to text-align: initial, as only the latter supports RTL
• KoboSelect component now supports placement (the more generic KoboDropdown already supports placement, so we only had to pass it on)
• Fixed few UI issues in the Project → Form → Manage Translations modal
  • Add language form button was misaligned
  • Pending status of button was behaving weirdly and inconsistently
• CopyTeamPermissions component (from project sharing modal) now uses our KoboSelect component
• Removed accidently duplicated code in jsapp/scss/libs/react-tagsinput.scss

Testing tips:

• Create some content using arabic text. I've used https://www.branah.com/arabic to write some random text (note that the tool hijacks the cmd+c shortcut so best to use rightclick→copy). At least have:
  • A project with submissions
  • A collection with something inside
  • Some library items
• It would be hard to list all the places touched by this issue, best way for testing would be finding in the UI all the dir="auto" changes. But for sure these places are improved:
  • Public Collections/My Library/Single collection tables
  • Projects table
  • Project Data tabs (all of them, except Map)
  • Account → Usage → Per Project
  • Form Builder
  • Header project title editor
  • Project → Form → Manage Translations

Related issues

Related to #4904

[RuthShryock]

Looks good! Just two comments :)