[Feature Request] Add class to HTML document root when translated

[BynariStar]

When using Chrome's native translation, a CSS class is added to the HTML element; for example, translated-ltr when translating to a left-to-right language or translated-rtl for right-to-left.

This comes in handy when creating userstyles for websites that may not appear correctly after being translated.

And of course thank you for your hard work. :)

[FilipePS]

Chrome does that, but for my tests this class does nothing. And the page direction is not changed. Basically chrome adds this for nothing. And there is a small problem with adding this feature, it can break the layout of some sites.

[Baft]

text-direction and text-alignment in popup dose not comply to destination language. for example translating an English technical text (LTR + left-Align) to Arabic (RTL + right-Align) ,make the result contain arabic word combined with technical english word .
incoherence text-direction and text-alignment of popup text with destination language , make the translated text to be messy(prev. example)

[iriman]

If anyone interested, I'm using another extension (ABC JS-CSS Injector) to apply correct text direction after translating. This is the code:

let nodeList1 = document.querySelectorAll("div");

for (let i = 0; i < nodeList1.length; i++) {
nodeList1[i].setAttribute("dir", "auto");
}

let nodeList2 = document.querySelectorAll("div,p,li,span,td,th,h1,h2,h3,h4,h5");

for (let i = 0; i < nodeList2.length; i++) {
   let cssObj = window.getComputedStyle(nodeList2[i],null);
   let align = cssObj.getPropertyValue("text-align");
   (align == "" || align == "center" || align=="start") ? "" : nodeList2[i].style.textAlign="start";
}

Yes, it may break layout of some websites but can be added as an optional option to the settings of TWP.