Styling issues in RTL

Public Ticket #20429

Conversation thread

PenciDesign Supporter replied

4 years ago

Staff Reply

Hi,

You can add the spacing to the search icon or any header elements by editing the header with Penci Header Builder. You can read the document here: https://soledad.pencidesign.net/soledad-document/#header-footer-builder

Regards,
PenciDesign.

ziedan replied

4 years ago

Customer Reply

Thanks for the reply, it is working for the menu and it is from right now. But the search icon is so close to the menu icon (as shown below), can I add padding to it?

PenciDesign Supporter replied

4 years ago

Staff Reply

Hi,

Please go to Appearance → Customize → Custom CSS then add the following custom CSS code:

.header-search-style-showup .penci_nav_left .show-search {
    right: 0;
    left: auto;
}
.header-search-style-showup .penci_nav_left .show-search::before {
    right: 5px;
    left: auto;
}
.penci-menu-hbg {
    width: 330px;
    transform: translateX(330px);
    -webkit-transform: translateX(330px);
    -moz-transform: translateX(330px);
}
.penci-menuhbg-open .penci-menu-hbg.penci-menu-hbg-left {
    left: auto;
    right: 330px;
}
.penci-menu-hbg,
#sidebar-nav {
    left: auto;
    right: 0;
}

Regards,
PenciDesign.

ziedan started the conversation

4 years ago

Conversation Start

Dear Support team,

Please I have purchased the Soledad theme, but I have a problem with the website as it is in Arabic.

The problem is I have the search icon and search box of the homepage on the right, and it is overlapping with the menu icon as shown in the images below.
When I open the menu, it is opening from the left, not the right, but it is supposed to be on the right in the RTL mode (shown in the 3rd image below).

So please can you support helping in this issue?

Thanks.

Want to join this conversation or access attachments? Sign in first.