Compact View - Adjust the header row

[Andrzej Stach]

Hello,

Could you let me know which class handles the styles for the date and resource header in the compact view? I'm mainly looking to adjust the height of the entire header row.

Regards,

Andrzej

[Swathi Ravi]

Hi Andrzej Stach,

Thanks for reaching out.

You can adjust the height of the toolbar and resource header in compact view by using the CSS selectors shared below.

<style>

    .e-schedule.e-device .e-schedule-toolbar,

    .e-schedule.e-device .e-schedule-toolbar .e-toolbar-items {

        height: 40px;

        min-height: 40px;

    }

    .e-schedule .e-schedule-resource-toolbar {

        height: 38px;

    }

</style>

Regards,

Swathi

Attachment: schedulercompactviewresourceheadercustomization_58994e2.zip

[Andrzej Stach]

Thank you very much.

There is still the view selection element whose size does not change.

Best regards.

Andrzej

[Swathi Ravi]

Andrzej,

To adjust the height of the view selection element, please use the highlighted CSS selectors below.

<style>

    .e-schedule.e-device .e-schedule-toolbar,

    .e-schedule.e-device .e-schedule-toolbar .e-toolbar-items,

    .e-toolbar .e-hor-nav {

        height: 40px;

        min-height: 40px;

    }

    .e-schedule .e-schedule-resource-toolbar {

        height: 38px;

    }

</style>

[Andrzej Stach]

Thanks!

Could you also please explain how to change the position of the resource selection element? Where can I find information about all the styles for a specific component?

[Swathi Ravi]

Andrzej,

 

Q1: To adjust the position of resource section, please use the highlighted CSS selectors below.

 

<style>

    .e-schedule .e-schedule-resource-toolbar {

    height: 26px;

    min-height: 26px;

    align-items: center;

}

</style>

 

Q2: Where can I find information about all the styles for a specific component?

You can find detailed information about the styles for the Scheduler component in desktop mode at the following link:

Scheduler Styling Documentation

For the compact view or mobile mode, we will consider adding the corresponding documentation and it will be included in one of our upcoming releases.

If you have any further questions or need additional assistance, feel free to reach out!

[Andrzej Stach]

Thank you

[Vijay Ravi]

Hi Andrzej Stach,

You're welcome. Please get back to us if you need any further assistance.

Regards,
Vijay