1

Say I have a "style.css" file for a module, and that file contains the following syntax:

.myCalss1 {
  right: 10px;
  margin: 0 5px 0 0;
}

I then create an extra file, "style-rtl.css" with the following syntax (flipping of the previous):

.myClass1 {
  right: initial;
  left: 10px;
  margin: 0 0 0 5px;
}

How can I make the system prefer the RTL file?

1

Solution

Create the flipped rtl css (for example, based on the structure I've described above) and then go to your theme's or module's folder, and there go to the libraries file (like libraries.yml) and create a reference in the end of the library ---> To your new file. Here is an example from the libraries file of one of my modules (admin toolbar):

enter image description here


Note:

The file might not work correctly if you will indent your syntax using the tab key or the space key. If there is a problem try the other of these two indenting options (some files can't work well when you pick a specific method for indenting them - It has to do with the structure of the file types themselves).

7
  • Are you saying that Drupal will still automatically include the -rtl.css file ONLY when the current language is RTL ? – Nic Apr 27 '16 at 9:25
  • I think you forgot to answer the previous comment (= an attempt to hijack your question via a comment, instead of posting a followup question) ... right? – Pierre.Vriens Aug 17 '16 at 20:01
  • 1
    Nic, I know that at least in the past it has been done if the file name included the phrase rtl or -rtl or something like that; Either way, Drupal will take it to account if it's last in the CSS files hierarchy. – user16289 Aug 17 '16 at 20:21
  • I saw this comment only today... @Pierre.Vriens... – user16289 Aug 17 '16 at 20:22
  • Don't worry you missed that ... after all, drupal.SE is not a Drupal site, where you could use the Rules module to produce some sort of reminders/notifications about such situations ... Something to remember to ever add as an extra feature to the Drupal Answers distro ... – Pierre.Vriens Aug 17 '16 at 20:26

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy