We are currently experiencing a rendering issue with the KendoUI TreeView component, version 2019.2.703, on Project Server Online. This problem arose following a recent update to Project Online, which introduced a change in how the WebComponentsIcons font, used for icon rendering, is managed in the cloud environment.
Issue Details:
Previously, the grid component functioned correctly. However, after the update, labels in combo boxes that contain hierarchical items (years and months in our case) are not displaying correctly. Specifically, the label for the year is now rendering "behind" he checkbox and is only partially visible within the interface.
See attachment: TreeView_err1.png
Attempted Fixes and Complications:
We attempted a solution that successfully made the year label visible again modifying the style of the class .k-treeview .k-in (setting the Font Family and size).
.k-treeview .k-in {border-radius: 0;
margin: 0;
padding: 4px 8px;
border: 0 solid transparent;
text-decoration: none;
display: inline-flex;
align-items: center;
align-content: center;
vertical-align: middle;
position: relative;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
font-size: 14px;
}
However, this adjustment led to an unintended change in the Document Object Model, and an empty <span> cover the checkbox and partially blocked the selection of the checkbox.
See attachment: TreeView_err2.png
To avoid the conflict between the checkbox and the empty span we modified the style of the .k-icon class changing the display from inline-block to display: contents;
Now, the trigger, originally on the triangle icon for showing/hiding child items (months), is incorrectly positioned above the checkbox for selecting the year. This results in all child items being expanded and displayed when the parent is selected, which is not the desired behaviour.
See attachment: TreeView_err3.png
Attachments:
Please find attached screenshots for a better understanding of the issues described.
Request:
Could you please investigate this behaviour? Any suggestions on how to correct the year label rendering without affecting the functionality of the child item display would be greatly appreciated.
1 Answer, 1 is accepted
Hello, Valerio,
I already replied in the Support ticket 1652198 you opened on the same topic. I suggest to continue the conversation there so that we can keep the discussion within a single thread.
Regards,
Martin
Progress Telerik