Working with Bidirectional Languages and Fluid

If you follow the guidelines for HTML areas and style sheets to create pages, the pages will also render correctly for bidirectional languages. See Customizing PeopleSoft Pure Internet Architecture Pages for Bidirectionality.

But for few cases in the FreeForm Style Sheet used for Fluid pages you need to follow some special guidelines related to margin, padding, border, translate, skew, rotate, matrix, radius, shadow, and clip.

These can be supported by using selectors beginning with :root.psc_dir-rtl.

For example, to set the box-shadow in the CSS selectors .ps-button:not([disabled]):active and .ps-button:not([disabled]):hover:active, the box-shadow:inset parameters should have a different order between ltr and rtl sessions:

:root.psc_dir-rtl .ps-button:not([disabled]):active,
:root.psc_dir-rtl .ps-button:not([disabled]):hover:active
{
 %BP(box-shadow:inset -1px 2px 2px #fff); /* BYPASSRTL scan */
}

You can automate some replacement patterns, as shown by the Perl regular expressions below. This is an example from Perl script which you can adapt to check and transform a set of files (Freeform style sheets in Application Designer, exported to CSS files), to have rtl support. In this script example, BYPASSRTL is a keyword used to prevent certain cases of automatic processing from occurring twice.

# cssrtl.pl

print ("CssRtl 1.9\n");

$workdir = $ARGV[0];$cssdir = "$workdir\\cssrtl\\css";$warndir = "$workdir\\cssrtl\\warn";$rtldir = "$workdir\\cssrtl\\rtl";
opendir(DH, $cssdir);my @files = grep {/\.css$/} readdir DH;closedir(DH);
if (! -d $warndir) { 	mkdir $warndir;}
if (! -d $rtldir) { 	mkdir $rtldir;}
die "no files found in $cssdir\n" if (! @files);
foreach my $file (@files){   	print "$file\n";   	open(INFILE, " $cssdir\\$file");    	open(OUTFILE, "> $rtldir\\$file");    	open(WARNFILE, "> $warndir\\$file");  
$line_cnt = 0; 
while(<INFILE>)  {	 $line_cnt ++; 	if(!/BYPASSRTL/ && /left|right/) { # only process if comment not present to BYPASSRTL processing and contains left/right
	        #Pre-process Exclusion
	      	 #Handle CSS Selectors
	      	 s/\.([^\.\,\s\{]*)left/.\1%%L%%/g;
	        s/\.([^\.\,\s\{]*)right/.\1%%R%%/g;
	        #Handle image names        
			s/(%image\s*\(\s*[^\(\)\s]*)left/\1%%L%%/g;       
			s/(%image\s*\(\s*[^\(\)\s]*)right/\1%%R%%/g;       
			#Handle quoted strings      
			 s/("[^.\"]*?)left([^.\"]*?")/\1%%L%%\2/g;        
			s/("[^.\"]*?)right([^.\"]*?")/\1%%R%%\2/g;       
			s/('[^.\']*?)left([^.\']*?')/\1%%L%%\2/g;       
			s/('[^.\']*?)right([^.\']*?')/\1%%R%%\2/g;       

			# Do replacement
		     s/\bleft\b/%AlignStart/g;
			 s/\bright\b/%AlignEnd/g;

         # Revert exclusion
		      s/%%L%%/left/g;
		      s/%%R%%/right/g;
 }
if (!/BYPASSRTL/ && /(margin|padding|border-color|border-width|border-style)\s*:\s*([^\s;]+)\s+([^\s;]+)\s+([^\s;]+)\s+([^\s;]+)\s*;/) {    	 if ($3 ne $5) {	     if ($5 ne '') {
		print WARNFILE "line ($line_cnt): $_";       
		print WARNFILE "RTL: add BYPASSRTL at the end of line $line_cnt, and append the following two lines\n";       my($res,$endval,$startval) = ($1,$3,$5);      my $res1, $res2;       if ($res =~ /border/) {      ($res1= $res) =~ s/border-(style|width|color)/border-%AlignStart-$1/g;      ($res2= $res) =~ s/border-(style|width|color)/border-%AlignEnd-$1/g;    }else {		       $res1 ="$res-%AlignStart";	                $res2 ="$res-%AlignEnd";       }      print WARNFILE "$res1: $startval;\n";     print WARNFILE "$res2: $endval;\n\n";      }    } } if(!/BYPASSRTL/ && (/translate[^YZ\(]*\(/ || /skew[^YZ\(]*\(/ || /rotate[^\(]*\(/ || /matrix[^\(]*\(/) ) {   print WARNFILE "line ($line_cnt): $_";  print WARNFILE "RTL: Add :root.psc_dir-rtl <your css selector here> { } and transform inverting the sign of the X direction parameter\n\n"; } if(!/BYPASSRTL/ && (/radius\s*:\s*([^\s;]+)\s+([^\s;]+)\s+([^\s;]+)\s+([^\s;]+)\s*;/) ) { if ($2 ne $4) {	  my($p1,$p2,$p3,$p4) = ($1,$2,$3,$4);	  $p4 =~ s/\)//g;	  my ($s1,$s2) = ("$p1 $p2 $p3 $p4","$p2 $p1 $p4 $p3");   if ($s1 ne $s2) {		    print WARNFILE "line ($line_cnt): $_";		    print WARNFILE "RTL: Add :root.psc_dir-rtl <your css selector here> { } and move radius inner numbers to outer position and vice versa eg $s1 becomes $s2\n\n";  } } } if(!/BYPASSRTL/ && (/(shadow\s*|clip[^:]*):\s*(\S+)/) ) {  if ($2 !~ /^none/) {	   	 print WARNFILE "line ($line_cnt): $_";	     print WARNFILE "RTL: Add :root.psc_dir-rtl <your css selector here> { } and adjust the horizontal positioning as appropriate\n\n";  } }  print OUTFILE "$_"; }  close(INFILE); close(OUTFILE); close(WARNFILE);}