Hello,
I've an error regarding Kendo style when I import it into an SCSS file. Let's assume I want to customize Kendo theme, I have 4 scss files :
@import 'tokens';
@import '@progress/kendo-theme-bootstrap/dist/all';
@import 'overrides';
However, when I import my base.scss file into the Vue App (whether in the main.js or the App.vue), I've this error :
Plugin: vite:css
File: /src/node_modules/@progress/kendo-theme-bootstrap/dist/all.scss:37542:173
Error: expected ";".
╷
37542 │ background-image: url('../../node_modules/@progress/kendo-theme-bootstrap/dist/k-map-get($_kendo-data-uris, $kendo-spreadsheet-insert-image-dialog-preview-img'));
│ ^
╵
node_modules/@progress/kendo-theme-bootstrap/dist/all.scss 37542:173 @import
src/assets/kendo.scss 2:9 @import
src/assets/base.scss 1:9 root stylesheet
If I import directly the kendo-theme-bootstrap scss file in the main.js or the App.vue, there is no error. Here is the StackBlitz reproducing the error:
https://stackblitz.com/edit/vitejs-vite-f63fqh
How can I resolve this ?
Best Regards,
Fabien / SYSCO
I am loading the kendo vue ui chart and displaying that in bootstrap cards (which is inside the bootstrap tab).
But some reason that that doesn't cover the entire width of the cards and render being so small.
There is already the style as: width: 100%; height: 100%; in the SVG of the chart but that doesn't expand. But when I changed some data then it occupies the full width.
Why it is not rendering properly initially? What's the issue causing this and what is the workaround for this?
http://jsfiddle.net/pdLncxoy/
I've found answers to this for other Kendo products, but I can't figure out the syntax for the Vue wrapper. I have a column in a grid that I want to show "yes" or "no" for based on the datasource value, which is boolean. This answer: https://www.telerik.com/forums/kendo-grid-showing-yes-or-no-instead-of-true-or-false specifies that I should do something like this:
columns: [
{ field: "BooleanVal", template: "#= BooleanVal ? 'yes' : 'no' #" }
]
I'm not using "columns", rather am using `<kendo-grid-column>`. I've tried several things along the lines of
<kendo-grid-column :field="active" :template="#= active ? 'yes' : 'no' #"></kendo-grid-column>
But nothing seems to work. How do I display "yes" or "no" for a boolean value in a kendo-grid-column?