Skip to main content

Hello. I am looking for information on how to change the default logo on the new Event Monitor UI to our company logo. I have tried making this change using the stylings form in assyst similar to how we have changed to logo on our assystNet and assystWeb pages, but either I have not been able to identify the correct element to apply the CSS to, or this is configured differently. 

This is what we want to change:

 

 

I have not been able to find any information on this in the wiki. 

Thank you. 

assyst Version: 24R2 SU2
Build: 12943 Date built: Mar 18, 2025 1:39:00 AM

They have used a variable in the CSS pointing to :root. You cannot overwrite this variable because it is also set inline at the html level.

So you have two options:

Option 1: Directly overwrite the CSS rule with a hardcoded image url

.headerLogoContainer {
	background-image: url("/assystimages/logo.png") !important;
}

Option 2: Overwrite the CSS rule to point to a custom variable in your own :root for reusability.

:root {
    --corporate-logo: url("/assystimages/company_logo.png");
}

.headerLogoContainer {
	background-image: var(--corporate-logo) !important;
}

Whichever you use, don't forget the !important to overwrite the any cascaded values inherited from the html in-line styling. I haven't managed to get it to work without this.

Reply


Terms & ConditionsCookie settings