Icon for DatePicker Too High

4 posts, 0 answers
  1. Joe
    Joe avatar
    220 posts
    Member since:
    May 2012

    Posted 11 Nov 2019 Link to this post

    The icon on my date picker is too high... it should be centered in the dropdown box.  What CSS do I need to modify to get it to look right?

     

     

  2. Tsvetomir
    Admin
    Tsvetomir avatar
    722 posts

    Posted 13 Nov 2019 Link to this post

    Hi Joe,

    In general, the icons of the Kendo UI DatePicker are centered and aligned with the main content. Can you ensure that the common CSS file has been included? More information on the needed files could be found in the following articles:

    Also, as a quick workaround, you could manually include the margin-top style:

        <style>
          span.k-icon.k-i-calendar{
            margin-top: 10px;
          }
        </style>

    Let me know in case the issue is still present.

     

    Kind regards,
    Tsvetomir
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
  3. Joe
    Joe avatar
    220 posts
    Member since:
    May 2012

    Posted 13 Nov 2019 Link to this post

    Thank you, this worked for me.

    Our CSS is so messed up from when previous developers tried to style all the Kendo components so they actually looked good, but unfortunately, it's more of a mess than a success.  We cannot use the regular styles that came with the product because they all look like crap.  We stopped getting updates because every update broke something else, and just became more problematic than not.  It's a shame because I love the functionality of the Telerik components, they all just look absolutely horrible for web apps.  Great for mobile apps, but we don't do mobile apps.  We need good looking web application components that make the best use of the page real estate, not large, mostly empty heavily padded components.

  4. Tsvetomir
    Admin
    Tsvetomir avatar
    722 posts

    Posted 14 Nov 2019 Link to this post

    Hi Joe,

    Thank you for taking the time to provide your feedback on the Kendo UI widgets. It is appreciated.

    In general, the library mainly aims at targeting the web environment and is web-oriented. In general, the main issues with the styles come from the fact that certain themes require having more than one file. More information for each of the Less and Sass themes could be found here:

    An important aspect of the styles is that they have to be updated accordingly. Whenever the dll for the server-side wrappers is updated, the corresponding client-side JavaScript and style resources have to be updated as well.

    It is correct that the main goal for the live demos is to show isolated example of a single widget with specific functionality. However, the library provides a handful of sample applications. The main purpose of those is to show the incorporation of multiple Kendo UI widgets into a single web app. You could navigate to them by accessing the landing page for the live demos - they are located on the right-hand side of the page:

    https://demos.telerik.com/aspnet-mvc/

    Here is a direct link to one of them:

    https://demos.telerik.com/aspnet-mvc/tripxpert/

    I hope you find this helpful.

     

    Best regards,
    Tsvetomir
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top