on 03-13-2024 9:36 AM
The theme is coming from a npm package, so I included it in package.json like this:
"dependencies": { "webui-theme-my_eservice": "^1.12.1" }
Then I configured the build command from ui5-cli to also build this into the output:
ui5 build --dest=../../webapp --clean-dest --include-dependency=webui-theme-my_eservice
Finally, I apply my custom theme in index.html:
<script id="sap-ui-bootstrap" src="https://sdk.openui5.org/resources/sap-ui-core.js" data-sap-ui-theme="my_eservice" data-sap-ui-theme-roots='{ "my_eservice" : "./resources" }' ...>
When I run the build output on a server, the color scheme and component styles of my custom theme are correctly applied. However, it seems that all references to UI5 Icons are broken:
<Button icon="sap-icon://visits" />
ends up displaying as
All icons are displayed as outlined rectangles, and the network log in the developer tools shows errors like:
It appears that the fallback mechanism doesn't work, as the application only is looking for the icons in the custom theme. From my understanding, once a resource is not available in the custom theme, it should fallback to the default theme and pick up the resources from there.
When I switch to a default theme, all icons display as they should.
What do I need to get both my custom theme and the icons working?
User | Count |
---|---|
83 | |
11 | |
10 | |
8 | |
7 | |
7 | |
6 | |
6 | |
5 | |
5 |
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.