Some components have a ::before pseudoclass with the content property set to the CSS code \200B , which is a zero-width space. However, in our project, this is coming out as ​ in the DOM.
For example, with the <Dialog /> component:
1. We render the dialog within a componet, giving it a title which comes from props
const MyComponent = (props) => {
return (
<Dialog title={props.title} onClose={props.onClose}>
. . .
</Dialog>
)
}
2. Locally (running in our development environment) we can see the CSS come out as expected
3. After building and deploying to an environment, the "" gets replaced with ​
After building the project locally, our CSS (build/static/css/main,xyz.css) does not include these symbols:
We are using Craco to build our project:
// craco.config.js
module.exports = {
style: {
postcss: {
plugins: [require('autoprefixer')]
}
}
}
I see that KendoReact offers a lot of the CSS utility classes like e.g. Tailwind CSS does. I would like to use those for things like flexbox and CSS grid, but also for generic padding and margins and such, in the same way I would with Tailwind.
Is there any documentation for these utility classes somewhere on the site? I cannot seem to find any.
Also, in my IDE (Webstorm) the autocomplete offers classes prefixed with 'k-' but also '!k-' and 'k-i-'. What is the difference between these?
Lastly, would it be possible to use Tailwind instead of KendoReact's utility classes alltogether?
How would I go about removing the classes from KendoReact if I wanted to? (without having to delete all of them by hand from the ...-all.css files)
Or perhaps better yet... is there a general 'kendo-react' way to use flexbox or css grid classes?
1) Can I use the kendoReact with a typescript template?
2) Is Telerik Dateatime picker in kendoReact support Persian date or another format like in windows app UI?
3) Can we create reports in kendoReact using your report tools?
4) I have already a material UI admin dashboard(https://minimals.cc/). Can I use kendoReact components inside and integrat Their themes (dark and lights)
hey, ive asked a month ago a question about how to make horizontal lines and made the same as the answer
(link to the thread: https://www.telerik.com/forums/how-to-disable-chart-vertical-lines-and-how-to-make-the-lines-rounded#1569854)
but now i have a problem with the chart legend,
the chart legend isnt fixated on the position of each bar and it makes it hard to know which bar its for, example:
and the wanted result:
Hi , there.
Recently i tried to use Kendo for React to create PDF document. But i faced with one issue, i cannot change font size of text.
No matter what properties i use, and what tags i am using it's always same size, even for <h1>
The wierdest thing that everything else working fine colors, margin, font colors, etc.
This is the example of code which i am using.
Does anyone else faced with this issue. ?
I am using a Kendo React Grid inside a Kendo React Dialog Window component.
When the Window first displays the user inputs a value in a text input and clicks a button to load the grid. The Grid seems to appear behind the Window. I tried adding the:
.k-animation-container { z-index: 10003; }
Some additional information:
When I open the Dialog Window I see this:
If I type an order number and click "View" I see this:
Part of the top of the grid where the headers should be and the scroll bar appear. That tells me the data loaded and the React state variable updated and caused the grid to redraw.
If I click the minimize icon in the window header and then the click restore icon I see the data:
I can share the code if it helps.
Thanks!