Theme Customization

Theme Customization for Seldon Deploy User Interface.

Seldon Deploy allows customization of the user-interface theme. Seldon Deploy follows Material Design for building its user experience And most of the theming and design aspects are based on a popular Material design library called Material UI.

Seldon Deploy supports complete custom configuration the material theme and the Logo image in the UI header.

Customization

  1. To get started create a new folder named custom.

  2. Create a config.json file in this folder.

  3. Add two sections to the config.json file namely logo and theme.

    {
"logo":"",
"theme":{}
}

  4. The logo section is a sting that represents filename of the new logo Image. Do remember to add the image file , in this case custom_logo.png, to the custom folder as well.

  5. The theme section is a material-ui theme configuration used to customize the entire UI as needed. For further options for configuration and customization, refer material ui theming and default theme

  6. So a basic theme configuration would look like as follows,

    {
"logo": "/custom_logo.png",
"theme": {"palette": {"primary": {"main": "#15425a"}}}
}

Apply custom theme configuration

  1. Now that the custom folder is ready, create a kubernetes secret named seldon-deploy-custom-theme in the seldon-system namespace.

    kubectl create secret -n seldon-system generic seldon-deploy-custom-theme --from-file=./custom

  2. The seldon deploy pods will automatically use this custom configuration and load appropriately.

custom_theme

Remove custom theme configuration

  1. Remove the secret to revert back to default configuration

    kubectl delete secret -n seldon-system seldon-deploy-custom-theme
Last modified July 16, 2020: Adding docs section for deploy UI theme customization (5916b53)