Actions to change View: how to render as dropdown

3 posts, 0 answers
  1. Hans
    Hans avatar
    2 posts
    Member since:
    Mar 2018

    Posted 19 Mar 2018 Link to this post

    Hi,

    how can we render the Buttons to select another view (Daily, Weekly, Monthly, etc in the Header-Area of the Scheduler) as dropdown? Is there a template for that purpose so we would be able to render customized markup?

    Thanks and regards
    Hans

     

  2.
  3. Magdalena
    Admin
    Magdalena avatar
    487 posts

    Posted 20 Mar 2018 Link to this post

    Hello Hans,

    We have implemented such behavior for screens up to 1024 pixels. If you would like to achieve such appearance for all resolutions, you can apply the following CSS:
    .k-scheduler-views .k-current-view {
        display: block;
    }
     
    .k-scheduler-views > li {
        display: none;
    }
     
    .k-state-expanded.k-scheduler-views > li {
        display: block;
    }
     
    .k-scheduler-views {
        -ms-flex-direction: column;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -webkit-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: stretch;
        -webkit-box-align: stretch;
        -webkit-align-items: stretch;
        align-items: stretch;
        position: absolute;
        right: 8px;
        top: 8px;
        z-index: 1000;
    }

    I am sending you also this Dojo project with the applied solution.

    Regards,
    Magdalena
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  5. Hans
    Hans avatar
    2 posts
    Member since:
    Mar 2018

    Posted 20 Mar 2018 in reply to Magdalena Link to this post

    Hi Magdalena,

    thank you very much :-)

    Best Regards
    Hans

     

Back to Top