Fruitfulcode / Fruitful

Free WordPress theme
https://fruitful.fruitfulcode.com
111 stars 68 forks source link

RTL support #20

Closed mbnoimi closed 8 years ago

mbnoimi commented 9 years ago

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: 2015-03-10_14-24-21

2015-03-10_15-21-01

2015-03-10_15-26-55

mbnoimi commented 9 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.

mbnoimi commented 9 years ago

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;
}
mbnoimi commented 9 years ago

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;
}