[Feature Request] Add RTL layout support to the sidebar

[WiseFerret]

Abstract

RTL users can move the sidebar to the right hand side of the firefox window, but its inner layout is still LTR, which is uncomfortable and unintuitive. We need an RTL layout support for the sidebar.

Steps to see the situation

1. Use RTL system interface (Arabic, Farsi, Hebrew, Urdu, Amharic, etc.) on linux or windows (haven't tested macOS).
2. Start Firefox with clean profile.
3. Install TST.

Expected result

The pinned tabs should be aligned to the right.
The icon on each tab should be on its right.
The triangle for spreading a parent tab should be on its right.
Nested tabs should be moved slightly to the left.
The X closing button on each tab should be on its left.

Actual (present) result

The pinned tabs are aligned to the left.
The icon on each tab is on its left.
The triangle for spreading a parent tab is on its left.
Nested tabs are moved slightly to the right.
The X closing button on each tab is on its right.

Environment

• Platform (OS): Ubuntu 24.10, Windows 11
• Version of Firefox: 133.03
• Version (or revision) of Tree Style Tab: 4.0.25

[piroor]

Could you try this?

1. Go to TST options.
2. Appearance => Style of contents for the sidebar position => choose "Right side"
3. Advanced => User Style Sheet => set as:

   .tabs.pinned,
   tab-item-substance .caption {
     direction: rtl;
   }
   tab-item-substance .caption > * {
     order: 0;
   }

This workaround should be added to the code snippets for now, if it is effective enough,

[piroor]

And I hope to put this code into TST as a built-in, if it is possible to detect the global direction of the browser UI. Hmm, how should we do that...?

[WiseFerret]

The addition to the user style sheet seems to solve the problem! Thank you.
I'm sure that firefox gives an environment variable regarding global direction - doesn't it?

[WiseFerret]

Two bugs I noticed with this implementation, though:

1. Dragging and dropping pinned tabs brings unexpected results. The tabs are moved to a location different than that of the mouse cursor.
2. The spacing between the icons and the beginning of text (when the tab title is in rtl language or is ltr but very short) is too tight,