Orchardcore: Support RTL admin

[khoshroomahdi]

I suggest for a default admin font changer module. I guess it is a goid option for localization because default font is suitable for engliash but its not good for other languages.

[khoshroomahdi]

It would have an option to upload custome font.

[Skrypt]

I think this is too specific and this can be changed easily with a CSS file. You can create your own admin theme for that matter. Though the debate here is : should a culture change the default font of the admin and/or website or should we use a more proper font that would suit everyones needs.

[sebastienros]

TheAdmin needs to be able to support RTL, and this should be done with the rtl class that is already automatically applied. We can also use the language attribute. Then the font can be changed to match it, if a custom font is necessary.

[hishamco]

@sebastienros can I implement this as TagHelperComponent? I already did that in SimplCommerce before, so all the pages will display as correct direction based on the current selected culture

[sebastienros]

It doesn't have to be a tag helper component, so I prefer to just change the css for that. Or use the thread culture if custom html is necessary (shouldn't be). But we would really appreciate it if you worked on it.

[hishamco]

The TagHelperComponent will automatically register itself at startup, so when every page hit, the direction attribute will be evaluated based on the current culture, so no need to include or change CSS in this case

[sebastienros]

I know how it works. Still not a good reason to use it. More work, more magic, doesn't work with liquid, failing to see any advantage that would counter these issues. For what? Just adding an attribute to a tag?

[hishamco]

I disagree, it will be created once and will be applied for all the Web Apps with out adding a line of code, furthermore why it will not applicable for liquid while the TagHelperComponent will target the body tag?!!

[sebastienros]

There is a single Admin theme today, a single body tag in this theme, with a single rtl attribute. Whatever you mean with "all the Web Apps" is not correct.

[sebastienros]

Also this tag is already generated, there is no point is spending more time finding better ways to add it. Some useful work would be to actually make use of it and work on the RTL css itself.

[hishamco]

No problem ..

make use of it and work on the RTL css itself.

Is this for the available themes? if YES what about the new themes?

[sebastienros]

[hishamco]

Unrelated to related thing .. regarding the language translation is there any guidance or docs for that, or shall I file a new issue for that

[sebastienros]

We are using Crowdin to gather language files. I think there is some doc explaining where to place these files, @agriffard can you point us to where these are ?

[hishamco]

I got your point about the Support `RTL admin 😄 but I'm thinking for non default themes too, hope you got my point

[agriffard]

https://orchardcore.readthedocs.io/en/dev/OrchardCore.Modules/OrchardCore.Localization/#po-files-locations

https://crowdin.com/project/orchard-core

[sebastienros]

http://bootstrap.rtlcss.com/

[hishamco]

Yep, there's a bootstrap version that support RTL. Hope I will work on this ASAP coz I was busy little bit with Arabic translation and some localization docs

[hishamco]

@sebastienros after digging into this, it's not simple as adding rtl class to make this happen!! there're many styles and some scripts are designed for LTR design, so either we add TheAdmin-rtl.css or revise the TheAdmin.css and modify it to make RTL ready

FYI I will consult a web designer to check if we can simplify the process

[hishamco]

I come up with a solution that will generate the rtl style via gulp, but I'm not sure how to write custom gulp steps while we have Assets.json

[sebastienros]

https://labs.spotify.com/2019/04/15/right-to-left-the-mirror-world/

[hishamco]

I'm experimenting something similar, this need to respect and change all the margins, padding, text-alignments .. let me test this and I will update my PR

thank

[hishamco]

@sebastienros I saw the link before, but this need to changes the SCSS files for boostrap too, which is the thing I dislike because if we upgrade the package we will lose what we did .. Again I see the current approach is doable and works fine, but we need to find away to avoid execute gulp rtl