Right To Left directional support for languages likes Arabic

[JavaTMP]

Hello,

Thank you for important and meaningful plugin.

How could I use it in language like Arabic whose direction start from right to left dir="rtl" instead of normal LTR.

Regards

[mistic100]

Do the whole layout needs to be reversed ?

If so, it's not possible without a bunch of CSS overrides, the lib does not offer this option.

[JavaTMP]

Yes, the whole layout needs to be reversed see the following page http://demo.javatmp.com/JavaTMP-Static-Ajax/index-rtl.html#pages/home.html

We will start customizing the css and sass files to support RTL and share them with you for you suggestions and support.

Thank you for quick and concise replay

[sndwav]

This should get you started:

.pull-right { float: left !important; }

.query-builder .rules-list { padding: 0 15px 0 0 !important; }

.query-builder .rules-list>:last-child::before { border-radius: 0 0 4px 0 !important; }

.query-builder .rules-list>:last-child::before { border-width: 0 2px 2px 0 !important; }

.query-builder .rules-list>::after, .query-builder .rules-list>::before { left: 0 !important; right: -10px !important; }

.query-builder .rules-list>::before { border-width: 0 2px 0 0 !important; }

.query-builder .rules-list>::after { border-width: 0 2px 0 0 !important; }

.btn { margin-right: 3px !important; }

.query-builder .drag-handle, .query-builder .error-container, .query-builder .rule-container .rule-filter-container, .query-builder .rule-container .rule-operator-container, .query-builder .rule-container .rule-value-container { margin: 0 0 0 5px !important; }

.query-builder .rule-value-container { border-left: none !important; border-right: 1px solid #DDD !important; padding-left: 0 !important; padding-right: 5px !important; }

.checkbox input[type=checkbox]:checked + label:after { content: "" !important; }

.form-inline .checkbox label, .form-inline .radio label { padding-right: 0 !important; padding-left: 20px !important; }

.query-builder .drag-handle, .query-builder .error-container, .query-builder .rule-container .rule-filter-container, .query-builder .rule-container .rule-operator-container, .query-builder .rule-container .rule-value-container { margin: 0 5px 0 0 !important; }

.query-builder .drag-handle { cursor: grab !important; }

.glyphicon { padding-left: 2px !important; }