Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug: toggle button background on ios #18940

strbam opened this issue Jul 30, 2019 · 1 comment


Copy link

commented Jul 30, 2019

Bug Report

Ionic version:
[x] 4.7.1
[x] 4.7.0

Current behavior:
Background color for toogle button is not set on ios devices.

Expected behavior:
Parameter --background sets toggle background. Similar behavior as --background-checked is expected.

Steps to reproduce:

  1. Create ionic project
  2. Add toggle button <ion-toggle>
  3. Use styling code that is below
  4. Deploy to ios device

Related code:

:root {
    --ion-background-color: #00b98b;

ion-toggle {
    --background: orange;
    --handle-background: navy;

    --background-checked: darkgreen;
    --handle-background-checked: khaki;

Result on iPad:

Result on Safari:

Other information:

Ionic info:


   ionic (Ionic CLI)             : 4.10.2 (/usr/local/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.7.1
   @angular-devkit/build-angular : 0.801.2
   @angular-devkit/schematics    : 8.1.2
   @angular/cli                  : 8.1.2
   @ionic/angular-toolkit        : 2.0.0


   cordova (Cordova CLI) : 9.0.0 (cordova-lib@9.0.1)
   Cordova Platforms     : ios 5.0.1
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.1, (and 4 other plugins)


   ios-deploy : 1.9.4
   ios-sim    : 8.0.1
   NodeJS     : v11.9.0 (/usr/local/bin/node)
   npm        : 6.9.0
   OS         : macOS Mojave
   Xcode      : Xcode 10.3 Build version 10G8

@ionitron-bot ionitron-bot bot added the triage label Jul 30, 2019

@strbam strbam changed the title bug: toggle button on ios bug: toggle button background on ios Jul 30, 2019

@ionitron-bot ionitron-bot bot removed the triage label Aug 1, 2019

@brandyscarney brandyscarney added this to Backlog 🤖 in Ionic Core via automation Aug 12, 2019

@brandyscarney brandyscarney moved this from Backlog 🤖 to On deck ⚾️ in Ionic Core Aug 12, 2019

@brandyscarney brandyscarney moved this from On deck ⚾️ to Done 🎉 in Ionic Core Aug 12, 2019


This comment has been minimized.

Copy link

commented Sep 11, 2019

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

@ionitron-bot ionitron-bot bot locked and limited conversation to collaborators Sep 11, 2019

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
2 participants
You can’t perform that action at this time.