title: ion-input with icon at the end
body: <pre><code>    &lt;ion-input placeholder=&quot;Username&quot; formControlName=&quot;userName&quot; class=&quot;primary-input&quot;&gt;&lt;/ion-input&gt;
       
           &lt;ion-input [type]=&quot;passwordType&quot; placeholder=&quot;Password&quot; formControlName=&quot;password&quot; autocomplete=&quot;off&quot;  class=&quot;primary-input&quot;&gt; 
          &lt;ion-icon name=&quot;eye&quot;  (click)=&quot;togglePasswordMode()&quot;  &gt;&lt;/ion-icon&gt;
          &lt;/ion-input&gt;
    &lt;div class=&quot;ion-margin-top&quot;&gt;
      &lt;ion-button expand=&quot;block&quot; (click)=&quot;!isSubmitted &amp;&amp; login()&quot; &gt;LOGIN&lt;/ion-button&gt;
    &lt;/div&gt;
         
   The above is my code currenty showing like this
  </code></pre>
  <p><a href="https://i.stack.imgur.com/zewAA.png" rel="noreferrer"><img src="https://i.stack.imgur.com/zewAA.png" alt="enter image description here" /></a></p>
  <p>currently showing icon at the start but i need to show at the end ..</p>
  <p><strong>i tried  ion-item with slot=&quot;end&quot; works but i dont  want  use that  beacuse textbox show slightly right side ..I need some alternative solution without using ion-item..</strong></p>
  <p>I am using ionic 5 ..Please some one help to css
  EDIT:</p>
  <pre><code>.primary-input {
      background: aliceblue;
      color: #999999;
      border-radius: 5px;
      margin-bottom: 10px;
  }
  </code></pre>
  <p>EDIT:
  This is the output of ion-item</p>
  <p><a href="https://i.stack.imgur.com/rjaej.png" rel="noreferrer"><img src="https://i.stack.imgur.com/rjaej.png" alt="enter image description here" /></a></p>