How to customize Schedule's default theme using SCSS file?

1 min read

This knowledge base article explains the way to customize the Schedule’s default theme by SCSS file

Step 1: Generate and download the theme file from theme studio

Step 2: Create an Angular project with Scheduler control. Kindly check the below link to create a project with Scheduler

Step 3: Move the downloaded file to this project.

Step 4: Rename the styles.css file into styles.scss

Step 4: Replace the below line in styles.scss file. And in this file, we can customize the Schedule’s theme variables like below,

$schedule-appointment-bg-color: green;
@import './assets/material.scss';

Step 5: Run the application and the Schedule will be rendered and the appointment’s color as green

Did you find this information helpful?

Yes

Comments (0)