Change Header Color for Alarm Status table in Perspective

General Discussion
1

image
image1173×648 33.9 KB

i have tried to change the header colour but i can't able to change.

2

You need to change the props.headerStyle to affect the header style

3

Thank you for your reply, Alarm Status table haven't headerStyle property.

4

Oh, whoops! I must have just seen Table and gone with that :grimacing:

Edit:
You're most likely going to have to change it with the advanced style sheet by referring to the page in your browser dev tools to find out which css selector you need to override

5

Hi @Senthoor_Mani_M.

under the Meta data of your alarm status object create a domId with the value of your choice
image

Under Styles/stylesheet.css

image
image1085×324 22.4 KB

enter the following code

#alarmTable .ia_table__headContainer{
  background-color:black;
}

Just change the #alarmTable with the domId value you use (always with an # first).
Then save your project and the modification should be applied to all alarm status table with the same domId.
Be aware that the advanced style sheet is available on gateway 8.1.22 and after.
To activate it right click on the styles folder and Enable advance stylesheet.
Fyi it's the same for an alarm journal table.

Regards
Arnaud

9 Likes
6

@Arnaud_Declerck ,
Thank You for your Answer, it's working.

1 Like
7

@Senthoor_Mani_M,

Glad it helps. Don't forget to mark it as solution so it's easier to find if someone has the same problem.
Regards

1 Like
8

I was looking for a solution just to change one particular table, instead of overall change to all table.

Your solution works perfectly.

9

Hi, I was hoping for some help, I have followed the instructions above but can not get my Alarm table to change its colour.

The only instruction I have not been able to do is "To activate it right click on the styles folder and Enable advance stylesheet."

When I right click I do not have this option?

Any one any ideas, I am using version 8.1.35

Regards Richard

10

hi @richard_hamilton,

Could is be that stylesheet is already enabled?

image

regards

11

Ah, yes it is. Thanks Arnaud.

I wonder why the header of the table is not changing colour then...

Richard

12

have you save your project after copy the following code in the stylesheet?

#alarmTable .ia_table__headContainer{
  background-color:black;
}

is the domid on your table set to alarmTable?

Regards

13

Yes Arnaud I have,

I have the table looking like this

table
table847×314 4.53 KB

meta properties are

table1

and the css file is

table2
table2624×502 17.4 KB

Just unable to get the header to change colour.

Richard

15

I have just realised that i had enableHeader set to false.

When it was set to true the colour had changed...

So, it appears i am trying to change the toolbar, :person_facepalming:

Richard

16

Ok this is not the header. This is the toolbar

#alarmTable .ia_alarmTableComponent__toolbar{
  background-color:black;
}

for the filter section

#alarmTable .alarmTable .alarmTableToolbar .alarmPreFiltersFilter{
  background-color:black;
}
1 Like
17

That's it Arnaud,

thanks very much.

Richard