How to correctly hide the e-header-row?

[Jack Dunn]

Hi,

How do I correctly remove/hide the header row that shows the date (see below)?

My scheduler is ALWAYS on Day view therefore this header is redundant and takes up unnecessary space.

I played around with the CSS/HTML in DevTools but it broke the scheduler appearence..

[Ravikumar Venkatesan]

Hi Jack,

You can hide the header rows of the Schedule day view by overriding default Schedule styles with help of the cssClass property of the Schedule as shown in the snippet.

Sample: https://stackblitz.com/edit/ej2-react-schedule-hide-date-headers-sample?file=index.css

[index.js]

function Schedule() {

    return (

        <ScheduleComponent cssClass='header-schedule'>

        </ScheduleComponent>

    );

}

export default Schedule;

[index.css]

.header-schedule.e-schedule .e-vertical-view .e-header-cells {

  padding: unset;

  display: none;

}

 

.header-schedule.e-schedule .e-vertical-view .e-date-header-wrap table tbody td.e-resource-cells {

  border-bottom: unset;

}

Regards,

Ravikumar Venkatesan

[Jack Dunn]

That's great, thank you.

[Ravikumar Venkatesan]

You're most welcome, Jack