search

akveo / nebular

:boom: Customizable Angular UI Library based on Eva Design System :new_moon_with_face::sparkles:Dark Mode
https://akveo.github.io/nebular
MIT License
8.04k stars 1.51k forks source link

I can't change the Nebular theme #2667

Open anaisaurus opened 3 years ago

anaisaurus commented 3 years ago

Issue type

I'm submitting a ... (check one with "x")

Issue description

Current behavior: I can't change the theme from default to any other theme. The theming completely disappear as well as the modules. The Nebular theme works as expected only when using the default theme.

With default theme: Default theme

With dark theme (the same goes with corporate and cosmic themes): Corporate theme

It seems that the Nebular themes and modules are not working.

Expected behavior: Well, the dark, cosmic or corporate themes should be displayed.

Steps to reproduce:

ng add @nebular/theme
? Which Nebular theme do you want to use: default
? Use customizable scss themes? Yes
? Set up browser animations for Nebular? Yes

Related code: This works perfectly:

imports: [
    // some imports...
    NbThemeModule.forRoot({ name: "default" }),
    // other Nebular imports...
],

This doesn't work at all:

imports: [
    // some imports...
    NbThemeModule.forRoot({ name: "dark" }),  // the same goes with cosmic and corporate, only default works
    // other Nebular imports...
],

Other information:

npm, node, OS, Browser Node: 12.19.0 npm: 6.14.8 OS: Windows 10 Browser: Mozilla Firefox and Google Chrome

Angular, Nebular Angular: 11.1.4 Nebular: 7.0.0

starteNCS commented 3 years ago

I encountered the same problem recently. For me the solution was to add @import '~@nebular/theme/styles/themes/dark'; (or the name of the other theme) to your themes.scss

Edit: https://akveo.github.io/nebular/docs/design-system/enable-multiple-runtime-themes#enable-multiple-runtime-themes