mattermost-developer-documentation icon indicating copy to clipboard operation
mattermost-developer-documentation copied to clipboard

add dark mode

Open nidhi752 opened this issue 1 year ago • 3 comments

Adding dark mode will enhance the user interface. Please assign this to me under hackoctoberfest'24

nidhi752 avatar Oct 16 '24 16:10 nidhi752

Hi @nidhi752 - Curious to know more about how you'd implement dark mode for the Mattermost Developer Documentation.

cwarnermm avatar Oct 16 '24 17:10 cwarnermm

@cwarnermm

Dark Mode Implementation

Description

This issue introduces a dark mode feature to the website. The dark mode allows users to switch between light and dark themes easily, with the preference saved using localStorage to ensure it persists across sessions.

Changes Made

  • HTML: Add a button for toggling between light and dark modes.
  • CSS: Create styles for both light and dark modes, with smooth transitions.
  • JavaScript: Implemente the logic to toggle dark mode and save user preferences using localStorage.

nidhi752 avatar Oct 17 '24 01:10 nidhi752

@nidhi752 - Given that the developer documentation site is generated using Hugo, are there Hugo-supported options available already that could be used rather than developing dark mode support from scratch?

cwarnermm avatar Oct 17 '24 13:10 cwarnermm