Description
Environment
From play.nativescript.org:
{
"@angular/animations": "8.2.14",
"@angular/common": "8.2.14",
"@angular/compiler": "8.2.14",
"@angular/core": "8.2.14",
"@angular/forms": "8.2.14",
"@angular/platform-browser": "8.2.14",
"@angular/platform-browser-dynamic": "8.2.14",
"@angular/router": "8.2.14",
"@nativescript/angular": "8.21.0",
"@nativescript/core": "6.5.0",
"@nativescript/theme": "2.3.3",
"@progress-nativechat/nativescript-nativechat": "3.0.0",
"kinvey-nativescript-sdk": "4.2.5",
"nativescript-accelerometer": "3.0.0",
"nativescript-angular": "8.21.0",
"nativescript-background-http": "4.2.1",
"nativescript-camera": "4.5.0",
"nativescript-geolocation": "5.1.0",
"nativescript-image": "3.0.1",
"nativescript-imagepicker": "7.1.0",
"nativescript-intl": "3.0.0",
"nativescript-iqkeyboardmanager": "1.5.1",
"nativescript-social-share": "1.6.0",
"nativescript-theme-core": "1.0.6",
"nativescript-ui-autocomplete": "6.0.1",
"nativescript-ui-calendar": "6.1.0",
"nativescript-ui-chart": "7.1.1",
"nativescript-ui-dataform": "6.0.0",
"nativescript-ui-gauge": "6.0.0",
"nativescript-ui-listview": "8.0.1",
"nativescript-ui-sidedrawer": "8.0.0",
"nativescript-vue": "2.5.0",
"react": "16.13.0",
"react-hot-loader": "4.12.20",
"react-nativescript": "0.18.0",
"reflect-metadata": "0.1.13",
"rxjs": "6.5.4",
"rxjs-compat": "6.5.4",
"svelte": "3.20.1",
"svelte-native": "0.8.1",
"tns-core-modules": "6.5.0",
"zone.js": "0.10.2"
}Describe the bug
Launching a dialog from @nativescript/core/ui/dialogs pulls the colour from Button, but constructs one globally without attaching it to any context, so any extra styles are not applied appropriately. This includes component-local .css definitions for Button, but more importantly (for my use case), the app.css .ns-dark Button definition doesn't get used when the user is in dark mode.
Keep in mind that the Button that is used for style extraction is only ever constructed once, too, which would disable the ability to switch back and forth between dark and light even if the style were properly composed at instantiation.
To Reproduce
Add two styles:
Button {
color: #ff0000;
}
.ns-dark Button {
color: #00ff00;
}Expected behavior
When in Dark Mode, the buttons on a dialog should be green (in the example).
Sample project
https://play.nativescript.org/?template=play-ng&id=Uklyzp