patternfly-design icon indicating copy to clipboard operation
patternfly-design copied to clipboard

Published 20 hours ago • verified publisher icon patternfly

Toggle components between light and dark themes

Open mcarrano opened this issue 2 years ago • 2 comments

on the patternfly.org website, We currently don't have a good way to toggle component previews between light and dark themes. Start with considering what the ideal interaction would be and what visual issues might occur in previewing dark theme components. Provide moockups to describe the interaction.

mcarrano avatar Oct 20 '22 20:10 mcarrano

WIP Designs: https://www.sketch.com/s/4abdb322-cd19-49af-8dbc-111adf6b071b

maryshak1996 avatar Jan 19 '23 21:01 maryshak1996

Update here (tagging @lboehling for awareness)! To support the multiple dark and light themes for PF5, I've updated the designs to reflect two final options in the form of dropdowns:

  • Show the theme dropdown at the variant level for each component (view flow)
  • Show the theme dropdown inline with the TOC of each component (view flow)

maryshak1996 avatar Apr 03 '23 19:04 maryshak1996

Since this issue was created we added light and dark theme switching in the masthead for full page theme switching. Based on the change I will be closing this issue but we can revisit if we want to show additional themes in the future.

andrew-ronaldson avatar Apr 04 '24 14:04 andrew-ronaldson