Highlight weekends on DatePicker

I am having trouble configuring the correct style to highlight weekend days:



1 Reply 1 reply marked as answer

UD UdhayaKumar Duraisamy Syncfusion Team August 11, 2022 02:47 PM UTC

Hi Roberto,


We can Customize the weekend cells by using the “.e-weekend” CSS class. The e-weekend class is added to each weekend cells. Please refer to the below code snippet and sample for reference.


@page "/"

 

@using Syncfusion.Blazor.Calendars

 

<SfDatePicker TValue="DateTime?" Placeholder='Choose a Date' Width="250px"></SfDatePicker>

 

<style>

    .e-weekend {

        background-color: #afcbf5;

    }

</style>


Sample : https://www.syncfusion.com/downloads/support/directtrac/general/ze/BlazorHighlight_Weekend-2091536742


Kindly try the above suggestion and let us know if this meets your requirement.


Regards,

Udhaya Kumar D


If this post is helpful, please consider Accepting it as the solution so that other members can locate it more quickly.


Marked as answer
Loader.
Up arrow icon