How to set date time icons on the left side

Question

Hello, I'm using Syncfusion DateTime Picker and I want to set date and time icons on the left side, I used the [enableRtl]="true" and then everything is switched from right to left (I mean when I open date time popup), but I only want the icons to be on the left side.

How can I fix this, please? thank you.

Kokila Poovendran · Answer

Hi Hamza MGAIDI,Greetings from Syncfusion support!We have reviewed your requirement and are pleased to inform you that we have prepared a sample that fulfills your needs. Please find the code snippet below for your reference:

.e-datetime-wrapper.e-control-wrapper {
    direction: rtl;
  }
   
  .e-datetime-wrapper.e-control-wrapper .e-input {
    direction: ltr;
  }

We achieved this behavior by applying the direction style to the input field and date time picker wrapper element. You can examine it to see if it meets your specific requirements. Here's a sample link for your convenience:Sample: https://stackblitz.com/edit/angular-plxir8-nt8vut?file=src%2Fapp.component.cssIf you have any further concerns or queries, please don't hesitate to reach out to us. We're here to assist you.Regards,Kokila Poovendran.