An ion-content seems to have default color of white or transparent.
if I had a ion-card I don’t get the gray background the demo has.
When I try to change the ion-content color
.ion-page > ion-content{
background-color: #F3F3F3;
}
Modals start to have their background gray, which shows gray between input items.
How do I make screens with cards on them have gray behind the cards, but not gray behind the modals and input items.
In my theme’s I do the following:
.ios, .md, .wp {
.blue-theme {
...
.scroll-content {
background-color: $lightgray;
}
...
}
}
For example:
You can set the current theme in your app.component.html
:
<ion-nav main [root]="rootPage" #content swipeBackEnabled="false" [class]="theme"></ion-nav>
You can toggle the theme in your app.component.ts
:
...
public toggleTheme() {
if (this.theme === 'blue-theme') {
this.theme = 'orange-theme';
} else {
this.theme = 'blue-theme';
}
}
...