[Feature] Right-To-Left (RTL) css for arabic users

Hello Friends,

we are developing a feature for the ERPNEXT,where the the arabic users can see the ERPNEXT in the Right-To-Left (RTL) format.

we already have the coding completed for the RTL, but we need your suggestions to improvise our code.

earlier, we had 2 sets of CSS , one for the LTR and other one for the RTL, but later we have changed this approach and implemented a new approach,

we still maintain 2 sets of CSS .. one for LTR and other one is for RTL, but in this approach we dont replicate the complete LTR code , but instead we only overrides the css which does the website RTL.

for example LTR :
.case-wrapper {
    position: relative;
    margin: 24px;
    float: left;
    width: 100px;
    height: 100px;
}



and the RTL css for this above code will be like :

.case-wrapper {
    float: right;
}


so guys, we need your suggestions or ideas to tell us , on how we can improvise our code.



Note:

 

If you are posting an issue,

  1. We should be able to replicate it at our end. So please give us as much information as you can. Please see it from the point of view of the person receiving the communication.
  2. Paste your code at http://pastebin.com or http://gist.github.com and send only the URL via email
  3. For sending images, use http://imgur.com or other similar services. Do not send images as attachments. Links are good. Same goes for any file you are going to send.

     

    End of Note



    You received this message because you are subscribed to the Google Groups “ERPNext Developer Forum” group.

    To unsubscribe from this group and stop receiving emails from it, send an email to erpnext-developer-forum+un...@googlegroups.com.

    For more options, visit https://groups.google.com/groups/opt_out.
Please read this document on best practices for bi-directional HTML pages

http://www.w3.org/International/geo/html-tech/tech-bidi.html

I think we should follow these standards.

best,
Rushabh


On Sunday, December 15, 2013 4:22:30 PM UTC+5:30, Syed Qadeer wrote:
Hello Friends,

we are developing a feature for the ERPNEXT,where the the arabic users can see the ERPNEXT in the Right-To-Left (RTL) format.

we already have the coding completed for the RTL, but we need your suggestions to improvise our code.

earlier, we had 2 sets of CSS , one for the LTR and other one for the RTL, but later we have changed this approach and implemented a new approach,

we still maintain 2 sets of CSS .. one for LTR and other one is for RTL, but in this approach we dont replicate the complete LTR code , but instead we only overrides the css which does the website RTL.

for example LTR :
.case-wrapper {
    position: relative;
    margin: 24px;
    float: left;
    width: 100px;
    height: 100px;
}



and the RTL css for this above code will be like :

.case-wrapper {
    float: right;
}


so guys, we need your suggestions or ideas to tell us , on how we can improvise our code.



Note:

 

If you are posting an issue,

  1. We should be able to replicate it at our end. So please give us as much information as you can. Please see it from the point of view of the person receiving the communication.
  2. Paste your code at http://pastebin.com or http://gist.github.com and send only the URL via email
  3. For sending images, use http://imgur.com or other similar services. Do not send images as attachments. Links are good. Same goes for any file you are going to send.

     

    End of Note



    You received this message because you are subscribed to the Google Groups “ERPNext Developer Forum” group.

    To unsubscribe from this group and stop receiving emails from it, send an email to erpnext-developer-forum+un...@googlegroups.com.

    For more options, visit https://groups.google.com/groups/opt_out.
Hello, Syed and Rushabh

Bootstrap 3 already have suporte to RLT languages, please look the thread and repository below.


https://github.com/twbs/bootstrap/issues/9913

https://github.com/AbdullahDiaa/Bootstrap-RTL



2013/12/16 rushabh <rm...@gmail.com>
Please read this document on best practices for bi-directional HTML pages


I think we should follow these standards.

best,
Rushabh


On Sunday, December 15, 2013 4:22:30 PM UTC+5:30, Syed Qadeer wrote:
Hello Friends,

we are developing a feature for the ERPNEXT,where the the arabic users can see the ERPNEXT in the Right-To-Left (RTL) format.

we already have the coding completed for the RTL, but we need your suggestions to improvise our code.


earlier, we had 2 sets of CSS , one for the LTR and other one for the RTL, but later we have changed this approach and implemented a new approach,

we still maintain 2 sets of CSS … one for LTR and other one is for RTL, but in this approach we dont replicate the complete LTR code , but instead we only overrides the css which does the website RTL.


for example LTR :
.case-wrapper {
position: relative;
margin: 24px;
float: left;
width: 100px;
height: 100px;
}



and the RTL css for this above code will be like :


.case-wrapper {
float: right;
}


so guys, we need your suggestions or ideas to tell us , on how we can improvise our code.



Note:



If you are posting an issue,

  1. We should be able to replicate it at our end. So please give us as much information as you can. Please see it from the point of view of the person receiving the communication.
  2. Paste your code at http://pastebin.com or http://gist.github.com and send only the URL via email
  3. For sending images, use http://imgur.com or other similar services. Do not send images as attachments. Links are good. Same goes for any file you are going to send.



    End of Note



    You received this message because you are subscribed to the Google Groups “ERPNext Developer Forum” group.

    To unsubscribe from this group and stop receiving emails from it, send an email to erpnext-developer-forum+un…@googlegroups.com.

For more options, visit https://groups.google.com/groups/opt_out.




--

Maxwell Morais
Tecnologia da Informação
+55 11 3931-1412 Ramal 31

www.realizemodulados.com.br



Note:

 

If you are posting an issue,

  1. We should be able to replicate it at our end. So please give us as much information as you can. Please see it from the point of view of the person receiving the communication.
  2. Paste your code at http://pastebin.com or http://gist.github.com and send only the URL via email
  3. For sending images, use http://imgur.com or other similar services. Do not send images as attachments. Links are good. Same goes for any file you are going to send.

     

    End of Note



    You received this message because you are subscribed to the Google Groups “ERPNext Developer Forum” group.

    To unsubscribe from this group and stop receiving emails from it, send an email to erpnext-developer-forum+un...@googlegroups.com.

    For more options, visit https://groups.google.com/groups/opt_out.