Pugpig Bolt now has a dark mode feature that can be added to your app settings page.
As shown in the screenshots below, there are 3 options:
- Use system settings, which will mimic your phone's light/dark mode settings
Everything in the app which can be styled normally can also have its own dark mode styling, from toolbars and settings pages to timelines and HTML content.
As with all other app changes, adding dark mode to settings would need a new app config as would updating the app container and any settings pages to support dark mode. Dark mode CSS will be automatically applied to HTML content coming from the Pugpig Express CMS (Minimal theme only). It is likely if CSS already exists that additional dark mode styling will need to be applied to handle the custom CSS on the template.
Embedded Web Views
It is important that you have an explicit background colour on your website set for both Dark Mode and Light Mode. If you do not your page will display the Pugpig theme background colour.
It's important to factor in colour contrast for accessibility when dark mode is enabled. It is common that brand colours may not pass accessibility testing when used in conjunction with a darker background colour. There are many online tools available to help you test different combinations of colours - we like Colour Contrast Checker.
Please reach out to Pugpig Support, or your Customer Success Manager if you'd like to know more about dark mode or are interested in adding it to your app.