Using Dark Mode in your PWA

In the modern age of devices and applications, the preferences of end users have evolved a bit as well. With the increased usage of screens and devices, health is one of the major concerns. And we know that almost all screen devices now support dark mode. Considering this fact, if you're building a web app, you might want to provide dark mode support for it. And if it is a PWA that presents itself as a native app, the responsibility is much greater. In this recipe, you'll learn how to provide a dark mode for your Angular PWA.

Getting ready

The project for this recipe resides in chapter13/start_here/pwa-dark-mode:

1. Open the project in Visual Studio Code.
2. Open the terminal and run npm install to install the dependencies of the project.
3. Once done, run ng build --configuration production.
4. Now run http-server dist/pwa-dark-mode -p 6100 to serve it.
5. Finally, install the PWA as shown in Figure 13.8
6. Now make sure you...