fix(input): only add padding right if it has clear input

fixes #9865
ionic-team · Jan 4, 2017 · 717cada · 717cada
1 parent 14eb2fd
commit 717cada
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 2 deletions.
diff --git a/src/components/input/input.ios.scss b/src/components/input/input.ios.scss
@@ -159,7 +159,7 @@ $text-input-ios-highlight-color-invalid:   $text-input-highlight-color-invalid !
   position: relative;
 }
 
-.input-ios .text-input {
+.input-ios[clearInput] .text-input {
   padding-right: $text-input-ios-input-clear-icon-width;
 }
 

diff --git a/src/components/input/test/clear-input/app-module.ts b/src/components/input/test/clear-input/app-module.ts
@@ -6,7 +6,7 @@ import { IonicApp, IonicModule } from '../../../..';
   templateUrl: 'main.html'
 })
 export class E2EPage {
-  myValue = 'value';
+  myValue = 'really long value that overflows to show padding';
 
   clicked() {
     console.log('clicked button');

diff --git a/src/components/input/test/clear-input/main.html b/src/components/input/test/clear-input/main.html
@@ -11,6 +11,11 @@
 
   <ion-list>
 
+    <ion-item>
+      <ion-label>No Input Clear:</ion-label>
+      <ion-input class="e2eClearInput" [(ngModel)]="myValue"></ion-input>
+    </ion-item>
+
     <ion-item>
       <ion-label>Input Clear:</ion-label>
       <ion-input class="e2eClearInput" [(ngModel)]="myValue" clearInput></ion-input>