# Update Application After CSS Edits

**URL:** <https://forum.inductiveautomation.com/t/update-application-after-css-edits/68818>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [January 19, 2023, 9:11pm UTC](https://forum.inductiveautomation.com/t/update-application-after-css-edits/68818 "2023-01-19T21:11:03Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![amarks](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/amarks/32/45610_2.png) [@amarks](https://forum.inductiveautomation.com/u/amarks)\
**Post date:** [January 19, 2023, 9:11pm UTC](https://forum.inductiveautomation.com/t/update-application-after-css-edits/68818/1 "2023-01-19T21:11:03Z")

</div>

I'm messing around with the CSS files for the first time and trying to test my understanding.

What's the best way to get the new styles to apply so I can test it?

I save all the relevant files, change something in the project, save the project, merge changes from the gateway, refresh the webpage, change the theme but sometimes it doesn't update.

For example, just to test an obvious change, I used this edit to the popup header:

```auto
.ia_popup__header {
    background-color: var(--seq-1);
    color: var(--neutral-100);
    border-bottom: var(--containerBorder);
    font-size: 0.875rem;
}

```

The change is made:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/e/ae3724ca1b7c7988b366dd06078ebb32962680cc.png)

But then changing the style sheet again doesn't change the color back.

```auto
.ia_popup__header {
    background-color: var(--neutral-40);
    color: var(--neutral-100);
    border-bottom: var(--containerBorder);
    font-size: 0.875rem;
}

```

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/8/98fad61668c2603bad8104eaca73a8416f2e20be.png)

While I can work around this issue using the Enhanced Stylesheet resource, it would still be nice to know how to get this to work as intended.

---

<div class="post-metadata">

**Author:** ![victordcq](https://avatars.discourse-cdn.com/v4/letter/v/f6c823/32.png) [@victordcq](https://forum.inductiveautomation.com/u/victordcq)\
**Post date:** [January 20, 2023, 7:31am UTC](https://forum.inductiveautomation.com/t/update-application-after-css-edits/68818/2 "2023-01-20T07:31:59Z")

</div>

you can directly add/edit css in the browser.  
This is the fasted, (be sure to safe it on a separate file before refreshing the page)

in chrome press ctlr+shift+i  
then check if you are on the elements tab, on the left, press the add style on the right, then press the inspctor.stylesheet.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/2/e264689f4dde3f06125c8441970aa664a15a0cdf.png)

this will open a sheet where you can copy paste from/to the perspective sheet after done testing.  
also easy to find the correct classes with the inspector  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/5/f/5f7500488185b846ab22b1feac0679fd32367ae8.png)

---

<div class="post-metadata">

**Author:** ![amarks](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/amarks/32/45610_2.png) [@amarks](https://forum.inductiveautomation.com/u/amarks)\
**Post date:** [January 26, 2023, 8:50pm UTC](https://forum.inductiveautomation.com/t/update-application-after-css-edits/68818/3 "2023-01-26T20:50:24Z")

</div>

It looks like changes are refreshed by the gateway every 5 minutes.

> [@Stylesheet Scripting](https://forum.inductiveautomation.com/t/stylesheet-scripting/69050/3):
>
> It looks like the file is located at: C:\Program Files\Inductive Automation\Ignition\data\projects\PROJECT\_NAME\com.inductiveautomation.perspective\stylesheet\stylesheet.css You should be able to edit it externally (or via scripting), and the changes will be picked up every 5 minutes via the gateway.

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [January 26, 2023, 9:26pm UTC](https://forum.inductiveautomation.com/t/update-application-after-css-edits/68818/4 "2023-01-26T21:26:11Z")

</div>

For editing of css theme files:  
Browser: refresh, F5  
Designer: change name of theme, change it back

I'm not sure if this also works for the style sheet.