Closed mbnoimi closed 8 years ago
Any way, I'm currently working on a multi-language website so I'll definitely face this problem so I'll make a child theme then put my modifications for RTL but the back-end needs a modifications by you because I can't make a child theme of it.
Below you can find my fix for RTL in Fruitful
.container .sixteen.columns {
float: right;
}
.woocommerce-account .addresses .title .edit {
float: left;
}
.woocommerce-account .addresses .title h3 {
float: right;
}
.woocommerce-account .woocommerce .col2-set .col-2, .woocommerce-account .woocommerce-page .col2-set .col-2 {
float: right;
width: 40%;
}
.woocommerce-account .woocommerce .col2-set .col-1, .woocommerce-account .woocommerce-page .col2-set .col-1 {
margin: 0 0 0 80px;
width: 40%;
}
.woocommerce .col2-set .col-1, .woocommerce-page .col2-set .col-1 {
float: right;
}
.woocommerce-account .woocommerce form .form-row input.input-text, .woocommerce-account.woocommerce-page form .form-row input.input-text, #billing_country, #shipping_country {
max-width: 100%;
}
.woocommerce-account .woocommerce form .form-row input, .woocommerce-account.woocommerce-page form .form-row input {
float: right;
}
.woocommerce-account .woocommerce form .form-row, .woocommerce-account.woocommerce-page form .form-row {
float: right;
}
.woocommerce .woocommerce-info::before, .woocommerce-page .woocommerce-info::before,
.woocommerce .woocommerce-message::before, .woocommerce-page .woocommerce-message::before {
background-color: transparent;
}
.woocommerce .woocommerce-error, .woocommerce .woocommerce-info, .woocommerce .woocommerce-message {
padding: 1em 3.5em 1em 2em !important;
}
.woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button {
right: auto;
}
.woocommerce form.checkout_coupon, .woocommerce form.login, .woocommerce form.register {
text-align: right;
}
.woocommerce-checkout #payment .payment_method_paypal .about_paypal {
float: left;
}
.woocommerce #payment #place_order, .woocommerce-page #payment #place_order {
float: left;
}
.woocommerce-checkout #payment ul.payment_methods li {
text-align: right;
}
.woocommerce-checkout .woocommerce #payment ul.payment_methods, .woocommerce-checkout.woocommerce-page #payment ul.payment_methods {
float: right;
}
caption, th, td {
text-align: right;
}
.woocommerce div form .form-row input.input-text, .woocommerce-page form .form-row input.input-text, .woocommerce div form .form-row textarea, .woocommerce-page form .form-row textarea {
padding: 7px 12px 7px 0;
}
.woocommerce-cart .woocommerce .cart-collaterals .cart_totals h2, .woocommerce-cart.woocommerce-page .cart-collaterals .cart_totals h2, .woocommerce-cart .woocommerce .cart-collaterals .cross-sells h2, .woocommerce-cart.woocommerce-page .cart-collaterals .cross-sells h2 {
text-align: right;
}
.woocommerce-cart .woocommerce .cart-collaterals .cart_totals, body.woocommerce-cart.woocommerce-page .cart-collaterals .cart_totals {
float: right;
}
.woocommerce-cart table.cart td.actions .coupon .input-text {
float: right;
margin: 0 0 0 4px;
}
body.woocommerce-page #content table.cart td.actions .coupon label {
float: right;
margin: 5px 5px 5px 0px;
}
.woocommerce-cart.woocommerce-page #content table td.actions input.button, .woocommerce-cart.woocommerce-page #content table td.actions input.button:hover {
float: left;
margin: 5px 5px 5px 10px;
}
.woocommerce #content table.cart td.actions .coupon, .woocommerce table.cart td.actions .coupon, .woocommerce-page #content table.cart td.actions .coupon, .woocommerce-page table.cart td.actions .coupon {
float: right;
}
body.woocommerce .quantity input.qty, body.woocommerce-page .quantity input.qty, body.woocommerce #content .quantity input.qty, body.woocommerce-page #content .quantity input.qty, .woocommerce-cart .woocommerce .quantity input.qty, .woocommerce-cart .woocommerce-page .quantity input.qty, .woocommerce-cart .woocommerce #content .quantity input.qty, .woocommerce-cart .woocommerce-page #content .quantity input.qty {
left: 0;
width: 120px;
}
.woocommerce-cart.woocommerce-page #content table td.product-name {
text-align: right;
}
.woocommerce .woocommerce-error::before, .woocommerce .woocommerce-info::before, .woocommerce .woocommerce-message::before {
left: auto;
right: 1.5em;
}
.woocommerce .woocommerce-error .button, .woocommerce .woocommerce-info .button, .woocommerce .woocommerce-message .button {
float: left;
}
body.woocommerce div.product form.cart, body.woocommerce #content div.product form.cart, body.woocommerce-page div.product form.cart, body.woocommerce-page #content div.product form.cart {
margin-left: 118px;
}
body.woocommerce.single-product .quantity input.qty, body.woocommerce-page.single-product .quantity input.qty, body.woocommerce.single-product #content .quantity input.qty, body.woocommerce-page.single-product #content .quantity input.qty {
background: none;
left: 2px;
width: 118px;
}
.woocommerce ul.products li.product.first, .woocommerce-page ul.products li.product.first {
margin-right: 0 !important;
}
.single.woocommerce span.onsale, .single.woocommerce-page span.onsale, .archive.woocommerce span.onsale, .archive.woocommerce-page span.onsale, .woocommerce ul.products li.product .onsale, body.woocommerce-page ul.products li.product .onsale {
left: 0;
margin: -0.5em -0.5em 0 0;
top: 0;
right: auto;
background: url("images/action-ar.png") no-repeat scroll 0 0 transparent !important;
margin-left: 5px;
margin-top: 5px;
}
.woocommerce .products ul::after, .woocommerce .products ul::before, .woocommerce ul.products::after, .woocommerce ul.products::before {
padding-top: 10px;
}
.woocommerce ul.products li.product:hover a.button.add_to_cart_button, .woocommerce ul.products li.product:hover a.button.add_to_cart_button:active, .woocommerce ul.products li.product:hover a.button.product_type_variable, .woocommerce ul.products li.product:hover a.button.product_type_variable:active,
.woocommerce ul.products li.product a.add_to_cart_button.product_type_simple,
.woocommerce ul.products li.product a.button.add_to_cart_button, .woocommerce ul.products li.product a.button.product_type_simple, .woocommerce ul.products li.product a.button.product_type_variable{
float: left;
left: 0;
right: auto;
margin: 0 0 5px 5px;
}
body.woocommerce .upsells.products li span.price, body.woocommerce-page .upsells.products li span.price, body.woocommerce #content .upsells.products li span.price, body.woocommerce-page #content .upsells.products li span.price, .woocommerce ul.products li.product .price, body.woocommerce-page ul.products li.product .price {
float: right;
margin: 5px 15px 10px 0;
}
.main-navigation ul ul {
box-shadow: -3px 3px 3px 0px rgba(0,0,0,0.2);
}
#page .container header.entry-header h1.entry-title, #page .container header.archive-header h1.archive-title {
padding-top: 10px;
}
.main-navigation li {
float: right;
}
.main-navigation ul ul {
float: right;
right: 0;
}
.cart-button {
clear: right;
float: left;
}
.main-navigation {
float: right;
}
A new addition:
.woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering {
float: left;
}
body.woocommerce .woocommerce-ordering select, body.woocommerce-page .woocommerce-ordering select, .woocommerce form .form-row select#calc_shipping_country, .woocommerce-page form .form-row select#calc_shipping_country, .woocommerce select#billing_country, .woocommerce-page select#billing_country, .woocommerce select#shipping_country, .woocommerce-page select#shipping_country, .woocommerce-checkout #shipping_method, body.woocommerce div.product form.cart .variations select, body.woocommerce-page div.product form.cart .variations select, body.woocommerce #content div.product form.cart .variations select, body.woocommerce-page #content div.product form.cart .variations select, .woocommerce-cart .woocommerce .cart-collaterals .cart_totals table select, .woocommerce-cart.woocommerce-page .cart-collaterals .cart_totals table select, .woocommerce-checkout #shipping_method {
padding: 6px 12px 6px 0;
text-indent: 6px;
}
.entry-content, .entry-summary {
margin-top: -40px;
}
.last {
clear: left;
margin-left: 0 !important;
margin-right: auto !important;
}
.ffs-two-one, .ffs-three-one, .ffs-three-two, .ffs-four-one, .ffs-four-two, .ffs-four-three, .ffs-five-one, .ffs-five-two, .ffs-five-three, .ffs-five-four, .ffs-six-one, .ffs-six-two, .ffs-six-three, .ffs-six-four, .ffs-six-five {
float: right;
margin-left: 4%;
margin-right: auto;
}
Current version 4433643d3a1468b5f00796bd7ef5e778ec25ce59 doesn't support RTL so I suggest to add RTL support for back end and front end too.
Examples of current problems: