3
How do I change from "blue" when I click the input to the color I want in the ion-input? I just managed to change the placeholder color with:
*::-webkit-input-placeholder {
color: rgb(255,255,255) !important;
}
How do I change the color of the "bar" android where the icons are?
-2
To change the background color of the input in Ionic 5 we can use --background
ion-input {
--background: red;
}
To change the color only when we select the field, use the selectors Hover and active. See an example:
ion-input:hover {
--background: red;
}
More details can be found in the Ionic documentation that gives us more information about the CSS we can use with ION-INPUT: https://ionicframework.com/docs/api/input
To change the color of the Status Bar we can use the plugin Cordova-plugin-statusbar as suggested by the framework documentation: https://ionicframework.com/docs/native/status-bar
CORDOVA
ionic cordova plugin add cordova-plugin-statusbar
npm install @ionic-native/status-bar
CAPACITOR
npm install cordova-plugin-statusbar
npm install @ionic-native/status-bar
ionic cap sync
ANGULAR
import { StatusBar } from '@ionic-native/status-bar/ngx';
constructor(private statusBar: StatusBar) { }
...
// let status bar overlay webview
this.statusBar.overlaysWebView(true);
// set status bar to white
this.statusBar.backgroundColorByHexString('#ffffff');
Browser other questions tagged ionic ionic2
You are not signed in. Login or sign up in order to post.
Good evening, you can use ionFocus to call a function every time the input is "in focus". In this case, you can change the ion-input color from this function (the implementation can be done in several different ways). I hope I helped.
– João Macedo