Skip to content

An Ionic/Vue demo of the @aparajita/capacitor-dark-mode plugin

License

Notifications You must be signed in to change notification settings

aparajita/capacitor-dark-mode-demo

Repository files navigation

capacitor-dark-mode-demo  GitHub version

This Ionic application provides a demo of all of the capabilities of the capacitor-dark-mode Capacitor 5 plugin. It has been tested on Android API 28-32.

Here is this app running on both iOS and Android.

iOS Android
ios.mp4
android.mp4

Installation

git clone https://github.com/aparajita/capacitor-dark-mode-demo.git
cd capacitor-dark-mode-demo
pnpm install # npm install
pnpm build # npm run build

Usage

Web

To launch the demo in a browser:

pnpm dev  # npm run dev

Once the demo is open, you can switch between appearance modes. When the appearance is System, switching the system between dark and light mode will change the appearance of the app and display an alert to confirm the change.

Native

To launch the demo in Xcode or Android Studio:

pnpm ios.dev  # npm run ios.dev
pnpm android.dev  # npm run android.dev

Once Xcode/Android Studio opens, select the device or simulator you wish to run the demo on (since you are running in Vite’s dev mode, be sure to use a recent OS version). Once the app is open, it behaves as it does on the web.

On Android, you can choose whether to sync the status bar with the appearance. By default they are synced.

Enjoy!

About

An Ionic/Vue demo of the @aparajita/capacitor-dark-mode plugin

Resources

License

Stars

Watchers

Forks

Packages

No packages published