{"id":12048,"date":"2024-01-31T18:15:07","date_gmt":"2024-01-31T15:15:07","guid":{"rendered":"https:\/\/dhtmlx.com\/blog\/?p=12048"},"modified":"2024-10-17T18:12:50","modified_gmt":"2024-10-17T15:12:50","slug":"dhtmlx-scheduler-7-0","status":"publish","type":"post","link":"https:\/\/dhtmlx.com\/blog\/dhtmlx-scheduler-7-0\/","title":{"rendered":"DHTMLX Scheduler 7.0 with Customizable Themes, New Dark Theme, Google-Like Agenda View, New Tooltip API, and More"},"content":{"rendered":"

We are thrilled to present a highly anticipated release of DHTMLX Scheduler 7.0. It is another major step in the development of this JavaScript scheduling library<\/a>. If the previous major update of Scheduler focused on the internal structure of the project, the new version is related to significant improvements on the user interface side.<\/p>\n

First of all, this major update is notable for greatly enhanced styling capabilities, including rewritten Scheduler themes, simplified customization of themes with CSS variables, updated default Terrace theme, a new Dark theme, and other useful changes. Moreover, you\u2019ll be pleased to see the renewed Agenda view that offers a new way of displaying a list of upcoming events. We also updated the Tooltip API to simplify the attachment of tooltips to custom elements and added a new way of enabling the Scheduler export.<\/p>\n\n\t\t

\n\t\t
\n\t\t
\n\t\t
Download DHTMLX Scheduler v7.0<\/div>\n\t\t
Estimate the updated functionality for building modern JavaScript scheduling calendars<\/div>\n <\/div>\n\t\t \n \n
\n Get free trial<\/a>\n <\/div>\n \n <\/div>\n\t\t<\/div>\n\t\n

Now let us review all these novelties in more detail.<\/p>\n

Updates in Scheduler Themes<\/h5>\n

Themes play a crucial role in the styling capabilities of modern JavaScript libraries. But the importance of themes lies not only in making web apps more visually appealing since they also help in achieving such goals as personalized user experience, enhanced accessibility, brand consistency, and more. Using themes included in JavaScript libraries, web developers get the necessary flexibility to tailor the UI to various project requirements with less time and effort. That is why we decided to introduce a range of updates and improvements related to themes in Scheduler 7.0.<\/p>\n

Overhauled Themes<\/h6>\n

The core styles of DHTMLX Scheduler were developed some time ago focusing on cross-browser compatibility. However, as legacy browsers became obsolete, these implementations also started showing their age. If you’ve used our Scheduler, you may have noticed some issues. The default Terrace theme appeared outdated and needed rejuvenation, theme customization required writing extensive CSS code, and certain elements struggled with overflow and faced issues while rendering on smaller screens. The new Scheduler version tackles all these issues.<\/p>\n

We have fully rewritten all the themes from scratch, making sure to adopt modern practices. <\/p>\n

Let us provide you with more details in the following sections. <\/p>\n

Updated Terrace Theme<\/h6>\n

In v7.0, the Terrace theme has undergone an overhaul towards a fresh and vibrant appearance that aligns with modern design standards.
\n\"DHTMLXCheck the sample ><\/a><\/p>\n

The Terrace theme has been updated for easier customization and resolving numerous visual issues.<\/p>\n

New Dark Theme<\/h6>\n

If you take a look at the top design trends of recent years, you are most likely to find a dark theme (or dark mode) in the list. Dark themes not only give a modern look to the UI but also contribute to reduced eye fatigue, improved accessibility, enhanced focus on the content, and an extended battery life on mobile devices. So if you lack this feature in your JavaScript scheduling calendar built with DHTMLX, there is good news for you. In version 7.0, we added the dark option to the list of available built-in themes in our Scheduler component.
\n
\n\"SchedulerCheck the sample ><\/a><\/p>\n

Changes in Theme Structure<\/h6>\n

This major update brings significant changes to the CSS structure of our themes. Firstly, all themes are now defined in a single CSS file, simplifying theme management. You can enable the needed theme directly in the code in two ways:<\/p>\n