RTL Fixes

[Rahim]

Hi Harry,

The RTL Layout on the cart and cehckout page needs some text-align fixes.

Cart : http://take.ms/RsFa5

Checkout : http://take.ms/95Dlp

If you fixed the bugs, please share the codes with me.

Regards.

Rahim Vaziri
CEO & Founder at Look.ir

[Rahim]

Harry,

I realized the ” th.product-quantity ” on the cart page is not center aligned with the quantity button,

Thanks

Rahim Vaziri
CEO & Founder at Look.ir

[Harry]

Hi Rahim,

Please add below code

[dir="rtl"] table.shop_table_responsive tr td.product-price,
[dir="rtl"] table.shop_table_responsive tr td.product-subtotal,
[dir="rtl"] table.shop_table_responsive tr td.product-quantity {
	text-align: center;
}

On checkout page it still work well

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Rahim]

Hi Harry,

It’s fine on the desktop now, but on mobile the proce and total price no : http://take.ms/trt3H

and on the checkout, they are not center aligned! http://take.ms/lzPZxl

And after that, I realized when the order is done and the customer sees the confirmation tble of the order,

in the table if the product is a variable product, the variation comes after the quantity!

however first of all we should have the product title and the values of the variations and then quantity! http://take.ms/CS5zx

Rahim Vaziri
CEO & Founder at Look.ir

[Rahim]

I realized this happens when the variables are written in En.

Rahim Vaziri
CEO & Founder at Look.ir

[Rahim]

Hi Harry,

I see an unusual space between the name of the author and the category of the post on my magazine : Look.ir/mag

check this : http://take.ms/2vcFc

Rahim Vaziri
CEO & Founder at Look.ir

[Harry]

Hi Rahim,

1. Please add below code

@media only screen and (max-width: 736px) {
[dir="rtl"] table.shop_table_responsive tr td:not(.product-quantity) {
	text-align: center !important;
}
[dir="rtl"] table.shop_table_responsive .product-quantity .quantity {
	float: none !important;
	margin-left: 0;
}}

2. On checkout page, the thumbnail and heading text all align right. If you want center it like this http://take.ms/8wyD7 this issue because your product image have more white space around/

Please add below code

.woocommerce-checkout-review-order-table .product-thumb {
	text-align: center;
}

3. The issue with variation in English i don’t have idea to fix

4. Please add below code

[dir="rtl"] .post-meta span:not(:last-child) {
	margin-right: 0;
}

Regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Rahim]

Hi Harry,

For checkout page, I agree with you.

The cart page should be like this in RTL layout and mobile view :

http://take.ms/iHQlp

I changed the code you gave me to this and is working like the image :

@media only screen and (max-width: 736px) {
[dir="rtl"] table.shop_table_responsive tr td:not(.product-quantity) {
text-align: left !important;
}
/*[dir="rtl"] table.shop_table_responsive .product-quantity .quantity {
float: left !important;
margin-left: 0;
}}*/

Is the second part necessary for this view? I made it comment.

Harry, Is smaller resolutions the title of the part starts from the left at the second line, is there any chance to start from right like iphone 5? I am sure this will happen too on larger screens when the title is too much and this starting from left is bug in rtl. http://take.ms/aSwUe

Rahim Vaziri
CEO & Founder at Look.ir

[Harry]

Hi Rahim,

Please add below code

@media only screen and (max-width: 736px) {
[dir="rtl"] table.shop_table_responsive tr td.product-name a {
float: left;
text-align: right !important;
}}

Regards

Harry
Premium Wordpress themes and plugins, Best WooCommerce theme https://themeforest.net/user/janstudio/portfolio?ref=janstudio

[Author]

Posts