Change grid line colour and weight

[AP]

I have a grid using the bootstrap Nordic theme. The users have asked that the grid lines be made more prominent, rather than the light grey .

I have had a look at the new theme builder, but not only does it seem overkill for a small change, but also doesn't seem to allow the line colour and weight to be changed.

 

How can I make the grid lines black and increase the width slightly?

I'm using version 2022.3.1109

[Anton Mironov]

Hello Andrew,

Thank you for the details provided.

I am not sure which lines should have a different style, but I guess we are talking about the rows in the Grid.

If this is the case, I would recommend using the following CSS:

<style>
    .k-master-row{
        background-color: black !important;
        color: white;
        font-weight: 600;
    }
</style>

This is the result:

Give a try to the pointed stylings and let me know if this is the desired result.

Kind Regards,
Anton Mironov
Progress Telerik

[AP]

Anton, thanks for this, but I don't want to change the font or the cell background (I have custom conditional formatting) I just need to change the grid line colour to black and make them slightly thicker, so cells are more easily distinguished from one another.

I've tried setting the border and border-color properties on the k-master-row class, but this doesn't seem to work.

[Anton Mironov]

Hi Andrew,

Thank you for the additional details provided. Now I can see your point clearly.

In order to achieve the desired behavior, I would recommend using the following CSS:

<style>
    td {
        border: 1px solid black !important;
    }
</style>

There are some borders where the style is duplicated, so feel free to customize it as per the needs of your application.

I hope this is the desired result.

 

Best Regards,
Anton Mironov