RTL Website support - Cookely Theme

Themes
#1

Hello,

I purchased the Cookely Theme after I was told it supports RTL.
Can you please advise how I can align everything to the right?
Setting Direction: RTL; in the CSS is not enough.

The website will be in Hebrew.
When I switch to Hebrew in settings most the navigation aligns to the right but the recipe list and method remain aligned to the left.

You can see here in the attached image
I need to reverse everything to be from right to left

juicybites
juicybites986×687 34.3 KB

If there is an article or older posts on this please let me know and I will review them.

Kind regards,
Tammy

#2

Hi @tamlev!

You can fix this problem quickly by adding this CSS code to the Customizer > Additional CSS:

 .rtl .wp-block-wpzoom-recipe-card-block-directions,
.rtl .wp-block-wpzoom-recipe-card-block-ingredients {
    text-align: right;
}

.rtl .wp-block-wpzoom-recipe-card-block-ingredients .ingredients-list>li::before {
    margin: 0 0 0 10px;
}

.rtl .wp-block-wpzoom-recipe-card-block-directions .wpzoom-recipe-card-print-link,
.rtl .wp-block-wpzoom-recipe-card-block-ingredients .wpzoom-recipe-card-print-link {
    left: 30px;
    right: auto;
}

.rtl .wp-block-wpzoom-recipe-card-block-directions .directions-list>li::before {
    right: 0;
    left: auto;
    margin: 0 0 0 20px;
}

.rtl .wp-block-wpzoom-recipe-card-block-directions .directions-list>li {
    padding: 0 40px 0 0;
}

.rtl .wp-block-wpzoom-recipe-card-block-directions .wpzoom-recipe-card-print-link .icon-print-link,
.rtl .wp-block-wpzoom-recipe-card-block-ingredients .wpzoom-recipe-card-print-link .icon-print-link {
    margin: 0 0 0 5px;
}