8.1rc3 edit symbol state styles

I’m trying to change the fill color of the new symbols in v8.1rc3 from the variables.css file as shown below. i have edited the document and tried restarting the gateway but it seems nothing has changed, the open/close/running are still using the high performance gray/white theme. Any help on what files need edited in order to accomplish this would help me as i can’t use high performance for our client.

Two things to try:

  1. I’ve had a lot of instances where directly modifying a file in that directory didn’t work; I had to copy it out elsewhere, modify it, then paste and overwrite. If you close that file and re-open it and see the values you expect, then this isn’t your problem.
  2. It’s possible the browser has cached css files. Try clearing your browser cache to see if that allows the new values to come through.

i can’t see it in the designer either though. would it affect the designer as well after i made the changes?

The Designer would most likely need to be restarted because it has its own cache.

are you able to replicate this on your end. i closed the designer and opened it back up and that did no good. the css file in question resides on where the gateway is hosted correct. for our instance it resides on an off site server but i edit from my host pc designer. i rdp’d to the server to test there as well from the designer with no luck

looks like i got it. for some reason that .css file didn’t save properly or got overwritten during our conversation so i never saw the changes. i ensured it saved and restarted the designer and was able to see them! This .css file will not get overwritten on a gateway restart or anything will it? What about a new install of ignition (for instance once we go to the stable release will i need to make the edits to the file again)?

If you upgrade to a new version of Ignition, the variables.css file will be replaced with the file in the new version, so yes - you would need to make the changes again. The recommended way to manage custom changes to themes is to use your own custom theme files which import the “base” themes we provide, which you ay then override with your own values/files.

According to the docs, a Gateway restart will overwrite your file.

is there any documentation as to how to do that as i’d like to do it the right way so that any further upgrades will not affect the styles. thanks in advance.

I recommend reading the read.me file located in the theme directory:

There is a recommendation in that file for how to introduce your own themes which basically mimics how we’ve set up our own derivatives, like light-warm.

The documentation I went through looking for that info leads me to believe that a Gateway restart WOULD actually overwrite your file, though I can’t explain why that is the case. I’ll update my previous post to reflect this.

The easiest way I’ve found to “de-cache”, if you will, is to simply change the current theme. Go into the gear icon (perspective setting?) and find the theme name in the session props and delete the last character and type it back again. That should refresh your cache