Skip to Content
0

SAPUI5 - how to load separate RTL stylesheet?

Mar 21, 2017 at 04:39 AM

39

avatar image
Former Member

Hi.

If I check developer tools, we either download library.css or library-RTL.css for right-to-left (RTL) languages. I also tested out this openui5 plugin used to create a theme, and it took my css and created a normal css file and a mirrored RTL css file; https://github.com/SAP/grunt-openui5

That's all great. Perfect. But the problem is that I'm not trying to create a theme. My problem is that we have a lot of custom controls and whatnot which has a lot of associated styles. We've written some code to take a css stylesheet and mirror it to give me the RTL version. But how do I apply it? I though if I put the css file in the manifest, then the SAPUI5 framework would automatically append "-RTL" and load the RTL version when such a language is set, ie same as what it's doing for the theme stylesheets. That doesn't however seem to be the case. Is there some config I can add to get this behaviour? It seems really strange that I can't do this since it's what is already being done for theming.

The current workaround we have is to NOT load the CSS files through the manifest and instead load them dynamically through javascript, ie something like this :

if (RTL) {
styleSheetPath = styleSheetPath + "-RTL.css" }
var link = '<link rel="stylesheet" type="text/css" href="' + styleSheetPath+ '">';
$('head').append(link);

This is obviously a bit of a hack. What is the correct way to handle this? We don't want to have to manually maintain this by adding dir=rtl attributes in css, we just want to automatically create RTL versions of our stylesheets and _somehow_ apply them when using an RTL language (again, same as theming).

Thank you
Tommy

10 |10000 characters needed characters left characters exceeded
* Please Login or Register to Answer, Follow or Comment.

1 Answer

avatar image
Former Member
May 16, 2017 at 12:01 AM
0

Been a couple of months now with no replies. Is it just a hard question, or did I post it in the wrong spot?

Share
10 |10000 characters needed characters left characters exceeded