Hello all,
I have the problem that my custom theme is not transferred to my application.
As code I copied the code from the tile layout example (https://demos.telerik.com/kendo-ui/tilelayout/index?_ga=2.175878118.554134959.1665135807-2026844688.1664867263&_gl=1*1inatwj*_ga*MjAyNjg0NDY4OC4xNjY0ODY3MjYz*_ga_9JSNBCSF54*MTY2NTE0Mjk5MS4yLjEuMTY2NTE0NDE5MS4wLjAuMA..) and adapted the linked script-sources to my paths.
After the script-sources i linked the css of my theme: (image0)
my theme has the following color scheme: (image1)
But now when I launch my application, the TileLayout looks like this: (image2)
When I use F12 to display the properties, for example of the donut chart, I see the following: (image3)
i do not understand, where the fill="#ff6800" comes from, since it is not even displayed in the style window of the F12 menu.
I can't get the problem solved, can anyone help me?
1 Answer, 1 is accepted
Hello,
Thank you for the provided details.
Could you check the Chart configuration and ensure that the theme property is set to "sass"?
$("#chart").kendoChart({
theme: "sass"
});This will tell the chart that it must use the sass theme that is included in the project, instead of the default one.
Let me know how it goes.
Best Regards,
Georgi Denchev
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 1
Hello,
when I include it like you mentioned, the chart will not be shown at all. The console-error says: Uncaught ReferenceError: sass is not defined
Do I need to take further steps to include my theme? I only put the scss, css and json files of my theme into my project and referenced the css, as I mentioned, in the page <head>.
Hello,
Based on the error description, it sounds like the sass keyword is specified as a variable instead of a string:
// Incorrect
$("#chart").kendoChart({
theme: sass
});
// Correct
$("#chart").kendoChart({
theme: "sass"
});Could you please double-check if that is the case?
Generally speaking, you don't need to include anything other than the compiled CSS file. If a CDN is being used, these are the three main resources that you need to run the Kendo widgets:
<!-- Kendo theme -->
<link rel="stylesheet" href="https://kendo.cdn.telerik.com/2022.3.913/styles/kendo.default-ocean-blue.min.css" />
<!-- Jquery Library -->
<script src="https://kendo.cdn.telerik.com/2022.3.913/js/jquery.min.js"></script>
<!-- Kendo Library -->
<script src="https://kendo.cdn.telerik.com/2022.3.913/js/kendo.all.min.js"></script>Let me know if none of the above suggestions resolve the issue.
Best Regards,
Georgi
Rank 1