Я настраиваю светлые и темные темы в ionic 3 .Я следовал этим учебным пособиям и создал всех рекомендованных поставщиков и компонентов.
https://robferguson.org/blog/2017/11/12/theming-your-ionic-3-app/ https://robferguson.org/blog/2018/03/10/theming-your-ionic-3-app-the-colors-map/
Теперь я добавил переменную $ colors в файлах темных и светлых тем (имеющих одинаковые цветовые свойства в обеих. Я только что скопировал и вставил одинаковыеПеременная $ colors со всеми свойствами в файле variables.scss
и импортированным светлым и темным файлом темы в файле variable.scss
Если я не записываю переменную $colors
в файл variable.scss
, выдается ошибка.
В app.component.ts
файле я настроил выбранную тему следующим образом
this.settingsProvider.getActiveTheme().subscribe(val => {
this.selectedTheme = val
});
и в app.html я добавил класс выбранной темы следующим образом
<ion-nav #content [root]="rootPage" [class]="selectedTheme" [swipeBackEnabled]="false"></ion-nav>
Теперь всеизменения цвета выполняются из светлых и темных файлов тем, но кое-что, как цвета не применяются в боковом меню и всплывающих моделях. Если я пишу тот же CSS-код в файле variable.scss
, это работает. Но в этом случае он выигралне переопределяю цвета из темного и светлого.
Я также пытался добавить [class] = "selectedTheme" в ion-меню, как упомянуто в этой ссылке, но это не работает.
https://forum.ionicframework.com/t/dynamic-theming-ionic-not-work-for-model-view-and-side-bar/114360/3