Kendo UI + inherit font - kendo-ui

I'm using Kendo ui dataviz components (pie and line charts). I need to make the font inherited from the main div.
Is there any attributes to set the font as "inherit" for kendo UI as in css?

Kendo UI DataViz uses SVG for charts in newer browsers and VML for old IE (7 and 8). You can use CSS to change the text font, but the VML part wouldn't be affected. Additionally CSS changes are not expected and the label sizing would probably break.
You're better off using the provided configuration options by the Chart to change the font - check the documentation and use "font" filter.

Related

What is alternative of DIV in NativeScript?

What is alternative of DIV in NativeScript?
How to use block inline with content inside?
Within Browser the behaviour div is determined by display CSS attribute.
For example, by default it's block and vertical which is similar to StackLayout with orientation set to vertical. When you make it inline, that's more like a horizontal layout, so again could be StackLayout with orientation set to horizontal.
There is again flex, we also have an equivalent in NativeScript, the FlexboxLayout. If you set position to absolute on div, it can be compared to AbsoluteLayout in NativeScript.
There is also GridLayout, WrapLayout, and DockLayout in NativeScript that serves various purposes.
So the alternative for div here totally depends on what kind of UI / layout you are looking for / how exactly you have styled the div on web.
If you are beginner, https://www.nslayouts.com/ is a good start to know all about NativeScript layouts.

SVG clipping in D3 brush doesn't work in Firefox

Using M. Bostock's example of focus + context, I'm trying to implement date selection via brushing: http://clflwd.org/lake-test.php. It's working fine in Chrome and IE, but in Firefox the path overflows the chart during brushing.
See here --> Insane CSS Clip Path Bug on Firefox
Basically, firefox thinks any clip-path style you set in a css file with a url#id is referring to an #id within that css stylesheet, rather than within your html document
If you add it as an inline style or attribute direct to the element it works.

Positioning tooltip in the kendo chart

Is there way to position tooltip in kendo chart apart from modifying CSS for class k-chart-tooltip?
I want the tooltip to be positioned at the top using the kendo chart attributes.
Here is the image on how it should look:
Image
If you change the .k-chart-tooltip style, then it will be applied to all tooltips used in the application.
Applying tooltip style only on chart control could be possible, if we can bring the kendo chart tooltip inside the chart control instead of tag (latest kendo version feature).
Then we can easily apply the tooltip CSS style only on kendochart.
I do not have any idea how could we bring kendo tooltip inside chart control.

How to set the Background image for KendoUI Page

I am using Kendo ui.
My Page layout consist of Splitter bars, Panel Bars and Grids.
I want to provide the Background image for the whole page.
I have tried using the following but no background image is displayed.
The Path for the Image is correct and verified
body
{
background-image:url('xxxxx.jpg');
}
You would need to find the CSS selectors for all the Kendo UI elements and set background-color: transparent on them.

KendoUI Combobox responsivenes

I am working with the Kendo UI beta (v. 2013.1.226) and I found that there are some glitches when you change the font size of a combobox.
The drpodown arrow doesn't seem right - it is a bit up while it shouold perfectly position itself in the center of the dropdown button.
To illistrate - I am attaching a screenshot.
Anyone know if there's a way to fix this?
I am thinking of somehow change the x and y position of the background to be relative.
Any help will be appreciated.
Update: Not quite sure if it's only me but found another problem changing the font size, the list seems to overlap the input field as shown in the second image:
I am using IE 9. Anyone have those problems or is it just me?
As far as I know Kendo shouldn't be interfering with other styles on the page (the styles start with k- prefix) so I am wondering if the issues only occur for me or are common.
The KendoUI Combobox is made up of multiple components and has its own styling for all the parts including the arrow. The arrow is actually two nested spans in the version I am using (2013.1.514).
I changed my textbox heights and got different alignment problems:
I would not expect the supplied KendoUI CSS to survive a font-size change as they are tweaked to look good at its own default font size. Your best bet is to use Chrome's F12 tools to determine what CSS styles are affected and tweak the Kendo styles (or your overrides) to match your requirements.

Resources