Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to customize header, such as header color, font size, font width, and background color #112

Open
lzwStore opened this issue May 10, 2024 · 2 comments

Comments

@lzwStore
Copy link

How to customize header, such as header color, font size, font width, and background color

@lzwStore
Copy link
Author

lzwStore commented May 10, 2024

Hope to create an API, such as Gantt's template function for table columns, which can customize rendering content
for example:
image

@gearcoded
Copy link

@lzwStore,
You can set the header colors and font settings via CSS.
Gantt adds the class name to grid header cells depending on the name parameter of the column configuration. For example, if the name has the progress value, the class name is gantt_grid_head_progress.
But you can also use on the data-column-id attribute:
https://docs.dhtmlx.com/gantt/desktop__css_overview.html#:~:text=%3D%2050%3B-,A%20cell%20of%20the%20grid%20header,-You%20can%20apply

Here is an example in the snippet:
https://snippet.dhtmlx.com/opqlk00r

There is no template function for the grid header cells, the contents depend on the label parameter:
https://docs.dhtmlx.com/gantt/api__gantt_columns_config.html#:~:text=specifies%20the%20title%20of%20the%20column

If you want to have a dynamical value for the grid header cells, you need to implement a custom solution.
Assigning a custom function to the label parameter is not enough as Gantt accepts only the string or number values. If you add a function, Gantt will obtain the returned value and assign it to the label parameter. So, you will need to manually modify the label parameter.
Here is an example of how it can be implemented:
https://snippet.dhtmlx.com/tfq405c0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants