From 2ab2aa1f6d48b85fed4e92c8bf77442ee74e5cb0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Nuno=20G=C3=B3is?= Date: Thu, 12 Oct 2023 11:22:23 +0100 Subject: [PATCH] feat: dynamic icons by adding material symbols font (#5008) https://linear.app/unleash/issue/2-1502/add-support-for-custom-dynamic-icons-mui-icon-component Adds support for custom dynamic icons by adding the [Material Symbols Outlined font](https://fonts.google.com/icons) and setting the MUI Icon component base class. See: https://mui.com/material-ui/icons/#icon-font-icons Message banner use case: This will not only enable us to set custom icons for external message banners, but will also let users configure their desired icon from the set of options in the font. --- frontend/index.html | 4 ++++ frontend/src/themes/dark-theme.ts | 6 ++++++ frontend/src/themes/theme.ts | 6 ++++++ 3 files changed, 16 insertions(+) diff --git a/frontend/index.html b/frontend/index.html index a74fbe07c1..5f9089c542 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -16,6 +16,10 @@ href="https://fonts.googleapis.com/css2?family=Sen:wght@400;700;800&display=swap" rel="stylesheet" /> +
diff --git a/frontend/src/themes/dark-theme.ts b/frontend/src/themes/dark-theme.ts index e2c78022c9..e6535b2f3a 100644 --- a/frontend/src/themes/dark-theme.ts +++ b/frontend/src/themes/dark-theme.ts @@ -617,5 +617,11 @@ export default createTheme({ }), }, }, + + MuiIcon: { + defaultProps: { + baseClassName: 'material-symbols-outlined', + }, + }, }, }); diff --git a/frontend/src/themes/theme.ts b/frontend/src/themes/theme.ts index a77936aee8..7bd227bb21 100644 --- a/frontend/src/themes/theme.ts +++ b/frontend/src/themes/theme.ts @@ -529,5 +529,11 @@ export default createTheme({ }), }, }, + + MuiIcon: { + defaultProps: { + baseClassName: 'material-symbols-outlined', + }, + }, }, });