In order to display KendoReact Chart on mobile phones on a horizontal screen, CSS "rotate(90deg) translate(...)" is applied to KendoReact Chart,
but the coordinates of tooltip are incorrect.
let w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
let h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
let x = (h-w)/2;
let ts = "rotate(90deg) translate("+x+"px,"+x+"px)";
const maxstyle={
transform:ts,
width:h,
height:w,
top:0,
left:0,
paddingLeft:5,
paddingRight:5,
paddingTop:5,
transformOrigin:"center center",
background:'#f5f5f9',
overflow:"hidden",
position:"fixed",
zIndex:10000
};
When then CSS "rotate(90deg) translate(...)" is applied to KendoReact Chart, the coordinates of tooltip are incorrect.
In order to display KendoReact Chart on mobile phones on a horizontal screen, CSS "rotate(90deg) translate(...)" is applied to KendoReact Chart,
but the coordinates of tooltip are incorrect.
sourcecode:
let w = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;let h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
let x = (h-w)/2;
let ts = "rotate(90deg) translate("+x+"px,"+x+"px)";
const maxstyle={
transform:ts,
width:h,
height:w,
top:0,
left:0,
paddingLeft:5,
paddingRight:5,
paddingTop:5,
transformOrigin:"center center",
background:'#f5f5f9',
overflow:"hidden",
position:"fixed",
zIndex:10000
};
<div style={maxstyle}>
<img src={closeImage} onClick={this.onBack.bind(this)} className="closeImage"/>
{this.renderSingleBlock()}
</div>
in React Dialog, the Dialog or the overlay, need to be focused for the Escape Key to work and close the dialog, whereas in the jQuery Dialog, it works globally without a specific focus...
https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/columns.hidden
Multi-selecting rows using the mouse selection doesn't work for React Kendo Grid.
With the kendo grid wrapper for React we were able to multi-select rows using the mouse selection in the grid bounds.
Like in the jQuery counterpart, when I click on a cell to edit the value - I should be able to tab over to the next cell to edit it.
I discovered a lack of parity between the React and Angular implementations of the TabStrip/TabStripTab components. Specifically, in the React version the "title" prop determines the contents inside the resulting <k-link> CSS class, whereas the Angular version allows you to set a template, for more complex tab header components.
This became an issue for me, because we have overridden the CSS for a custom progress tracker component built on the tab strip in an Angular implementation. I am now tasked with replicating the component in React, but had to resort to my own TabStrip/TabStripTab classes, instead of being able to use your components. (My goal is to be able to use the existing CSS, maintained by our UX team, out of the box.)
Hope that made sense. Feel free to contact me if it's not clear what I'm asking for, or if there is already a solution to this. Thanks!
React version:
Angular Version:
};
<Grid
}}
<Column field="Date"filter="date"format="{0:d}"/>
In this way,the date will be sorting with Month, How can I sorting start with year instead of month
Hi, when entering https://www.telerik.com/kendo-react-ui/getting-started form npmjs.com, I end up on a page with "Try Kendo UI for React" heading, but whole header comes from Kendo UI for Angular project