Using Themes with
vSphere Client Plug-insLast Updated December 16, 2024
The vSphere Client SDK provides the means for a plug-in to integrate with
the themes supported by the vSphere Client. Modifying a plug-in to support
themes requires changes to the plug-in style sheets and front-end code to
switch style sheets whenever the user changes the theme in the vSphere Client.
To
integrate with the vSphere Client themes, a plug-in uses these methods of the
JavaScript API:
- app.getTheme()
- event.onThemeChanged(callback)
To prepare your code for a theme change, you
must identify and isolate theme-dependent styles and icons, then create variables with
which to manage the style changes and overrides.You can merge your styles with the
standard Clarity styles to improve performance. Finally, you can use examples in this
book to load new styles in response to user theme changes.
The following procedures
assume that the plug-in's front-end code is built using Angular and Clarity
Design System. For other frameworks and build tools, the approach is similar
but you will need to adapt the approach to suit the chosen tools. The examples
in this guide are based on the HTML Plug-in Sample provided as part of the
vSphere Client SDK.