fix(covers): absolute positioning

ionic-team · Mar 22, 2018 · ce09978 · ce09978
1 parent 9836c60
commit ce09978
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 9 deletions.
diff --git a/core/src/components/checkbox/checkbox.scss b/core/src/components/checkbox/checkbox.scss
@@ -9,11 +9,14 @@ ion-checkbox {
 }
 
 ion-checkbox input {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
   @include margin(0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   border: 0;
   background: transparent;
   cursor: pointer;

diff --git a/core/src/components/datetime/datetime.scss b/core/src/components/datetime/datetime.scss
@@ -11,10 +11,13 @@ ion-datetime {
 }
 
 .datetime-cover {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   border: 0;
 
   background: transparent;

diff --git a/core/src/components/input/input.scss b/core/src/components/input/input.scss
@@ -63,9 +63,12 @@ input.native-input:-webkit-autofill {
 // The input cover is not clickable when the input is disabled
 
 .input-cover {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
 
   position: absolute;
+
+  width: 100%;
+  height: 100%;
 }
 
 .input[disabled] .input-cover {

diff --git a/core/src/components/item/item.scss b/core/src/components/item/item.scss
@@ -75,10 +75,13 @@ ion-item-group {
 }
 
 .item-cover {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   background: transparent;
   cursor: pointer;
 }

diff --git a/core/src/components/radio/radio.scss b/core/src/components/radio/radio.scss
@@ -11,11 +11,14 @@ ion-radio {
 }
 
 ion-radio input {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
   @include margin(0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   border: 0;
   background: transparent;
   cursor: pointer;

diff --git a/core/src/components/select/select.scss b/core/src/components/select/select.scss
@@ -14,10 +14,13 @@ ion-select {
 }
 
 .select-cover {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   border: 0;
 
   background: transparent;

diff --git a/core/src/components/spinner/spinner.scss b/core/src/components/spinner/spinner.scss
@@ -12,10 +12,13 @@ ion-spinner {
 }
 
 ion-spinner svg {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   transform: translateZ(0);
 }
 

diff --git a/core/src/components/title/title.ios.scss b/core/src/components/title/title.ios.scss
@@ -5,11 +5,14 @@
 // --------------------------------------------------
 
 .toolbar-ios ion-title {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
   @include padding(0, 90px, 1px);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   transform: translateZ(0);
 
   pointer-events: none;

diff --git a/core/src/components/toggle/toggle.scss b/core/src/components/toggle/toggle.scss
@@ -45,11 +45,14 @@ ion-toggle ion-gesture {
 }
 
 ion-toggle input {
-  @include position(0, 0, 0, 0);
+  @include position(0, null, null, 0);
   @include margin(0);
 
   position: absolute;
 
+  width: 100%;
+  height: 100%;
+
   background: transparent;
   cursor: pointer;
   border: 0;