JYAML - Joomla! Templates mit Yaml

rtlsupport.gifRTL-Support

RTL means "Right to Left". This refers to the read direction of the active language in Joomla!. You find this language direction for example in Arabian.

No customizations exist in the YAML-Framework for this themselves yet. However, these became JYAML-Template expandedly in this now.

The base RTL-Sytlesheet is the base-rtl.css in the directory yaml/core. A base_slim-rtl.css which was optimized for productive use with regard to the file size also exists. The slim file is then loaded also automatically if a RTL language is active. 

Of course it simply does not suffice to change only the base Stylesheet. Any horizontal alignment carried out must be adapted correspondingly. For this, of course JYAML-Template is integratedly a special function in it. You must observe the YAML rules, though and use the basemod.css and content.css for the arrangement of the contents for this. 

Operation

All RTL-Stylesheetss are considered a modification and not represent any complete stylesheet.

The JYAML-System-Plugin looks in the directory css/[design]/screen in first place for the files basemod-rtl.css and content-rtl.css automatically. These are bound automatically at last position in the <head> of the HTML document.

All Stylesheets which were inserted in the configuration are searched in second place. All files with the suffix "-rtl" be containedly in the file name added automatically. This search at the nav_shinybuttons.css to nav_shinybuttons-rtl.css, for example. These are bound automatically at last position in the <head> of the HTML document, too.

We still take a look into the base-rtl.css now.
You find the description of the base.css in the YAML-Framework documentation of base Stylesheets.  

/* (en) Set direction in Right-to-Left. */
/* (de) Setze Leserichtung nach Rechts-zu-Links. */
* { direction: rtl; }

/* (en) Correction: margin/padding reset caused too small select boxes. */
/* (de) Korrektur: Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
option {
  padding-left: 0;
  padding-right: 0.4em;
}

body {
  /* (en) Standard values for text alignment */
  /* (de) Vorgabe der Textausrichtung */
  text-align: right;
}

/* (en) New standard values for lists, blockquote and cite */
/* (de) Neue Standardwerte für Listen & Zitate */
ul, ol, dl { margin: 0 1em 1em 0; }
li { 
  margin-left:auto;
  margin-right: 1.5em;
}

dd { margin: 0 2em 1em 0; }

blockquote, cite { 
  font-style: normal;  /* FF corrupts italic text with RTL fonts */
  margin: 0 1.5em 1em 0; 
}

/*------------------------------------------------------------------------------------------------------*/

/**
* @section base layout | Basis Layout
* @see     http://www.yaml.de/en/documentation/css-components/base-stylesheet.html
*/
#topnav {
  right:auto;
  left: 10px;

  /* (en) Essential for correct right alignment of absolute positioned element in IE ! */
  /* (de) Erforderlich, damit im IE das absolut positionierte Element wirklich rechts plaziert ! */
  right: auto;

  /* (en) essential for correct right alignment in Opera 6 ! */
  /* (de) Erforderlich, damit im Opera 6 wirklich right plaziert ! */
  text-align: right;
}