fix(color): edge currentColor bug (#16177)

fixes #16168

core/src/components/buttons/buttons.ios.scss

@@ -24,8 +24,8 @@
 // --------------------------------------------------
 
 :host-context(.ion-color)::slotted(*) .button {
-  --color: currentColor;
-  --color-activated: currentColor;
+  --color: initial;
+  --color-activated: initial;
 }
 
 

core/src/components/buttons/buttons.md.scss

@@ -25,8 +25,8 @@
 // --------------------------------------------------
 
 :host-context(.ion-color)::slotted(*) .button {
-  --color: currentColor;
-  --color-activated: currentColor;
+  --color: initial;
+  --color-activated: initial;
 }
 
 
@@ -45,7 +45,7 @@
 // --------------------------------------------------
 
 ::slotted(*) .button-outline {
-  --color: currentColor;
+  --color: initial;
   --color-activated: currentColor;
   --background: transparent;
   --background-activated: transparent;
@@ -57,7 +57,7 @@
 // --------------------------------------------------
 
 ::slotted(*) .button-clear {
-  --color: currentColor;
+  --color: initial;
   --color-activated: currentColor;
   --background: transparent;
 }

core/src/components/chip/chip.scss

@@ -45,7 +45,7 @@
 
 :host(.ion-color)::slotted(*) ion-chip-icon,
 :host(.ion-color)::slotted(*) ion-chip-button {
-  --color: currentColor;
+  --color: initial;
 }
 
 ::slotted(*) ion-label {

core/src/components/input/input.scss

@@ -16,7 +16,7 @@
    * @prop --placeholder-font-weight: Font weight of the input placeholder text
    * @prop --placeholder-opacity: Opacity of the input placeholder text
    */
-  --placeholder-color: currentColor;
+  --placeholder-color: initial;
   --placeholder-font-style: inherit;
   --placeholder-font-weight: inherit;
   --placeholder-opacity: .5;

core/src/components/item/item.scss

@@ -53,7 +53,7 @@
   --inner-box-shadow: none;
   --show-full-highlight: 0;
   --show-inset-highlight: 0;
-  --detail-icon-color: currentColor;
+  --detail-icon-color: initial;
   --detail-icon-font-size: 20px;
   --detail-icon-opacity: 0.25;
 

core/src/components/label/label.scss

@@ -8,7 +8,7 @@
   /**
    * @prop --color: Color of the label
    */
-  --color: currentColor;
+  --color: initial;
 
   @include margin(0);
 

core/src/components/menu-button/menu-button.md.scss

@@ -4,7 +4,7 @@
 // --------------------------------------------------
 
 :host {
-  --color: currentColor;
+  --color: initial;
 }
 
 button {

core/src/components/searchbar/searchbar.md.scss

@@ -5,7 +5,7 @@
 // --------------------------------------------------
 
 :host {
-  --clear-button-color: currentColor;
+  --clear-button-color: initial;
   --cancel-button-color: #{$searchbar-md-cancel-button-color};
   --color: #{$searchbar-md-input-text-color};
   --icon-color: #{$searchbar-md-input-search-icon-color};

core/src/components/searchbar/searchbar.scss

@@ -15,7 +15,7 @@
    * @prop --placeholder-font-weight: Font weight of the searchbar placeholder
    * @prop --placeholder-opacity: Opacity of the searchbar placeholder
    */
-  --placeholder-color: currentColor;
+  --placeholder-color: initial;
   --placeholder-font-style: inherit;
   --placeholder-font-weight: inherit;
   --placeholder-opacity: .5;

core/src/components/textarea/textarea.scss

@@ -18,8 +18,8 @@
    * @prop --padding-start: Start padding of the textarea
    */
   --background: initial;
-  --color: currentColor;
-  --placeholder-color: currentColor;
+  --color: initial;
+  --placeholder-color: initial;
   --placeholder-font-style: inherit;
   --placeholder-font-weight: inherit;
   --placeholder-opacity: .5;

core/src/components/title/title.scss

@@ -7,7 +7,7 @@
   /**
    * @prop --color: Text color of the title
    */
-  --color: currentColor;
+  --color: initial;
 
   display: flex;