# Modifying Perspective Style Class List **URL:** \ **Category:** Module Development\ **Tags:** perspective\ **Created:** [January 8, 2025, 4:59pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601 "2025-01-08T16:59:39Z")\ **Posts on this page:** 9\ **Page:** 1
**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\ **Post date:** [January 8, 2025, 4:59pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/1 "2025-01-08T16:59:40Z")
> [@Perspective Component Schema Help](https://forum.inductiveautomation.com/t/perspective-component-schema-help/94561/6): > > All the style class manipulation is backend/Java code. com.inductiveautomation.perspective.common.config.styles.StyleClassConfig#toCss But the rule is quite simple - .psc- + folder path, with forward slashes escaped. I have a module that is going to be adding in some user-accessible perspective Styles with the `.psc-` method in the end compiled theme. However I would like the user to be able to see those in the designer when they expand the styles dropdown. i.e. I would want `.psc-my-modules-custom-style` to show an option in this list. It works if I manually type it, but its not shown in the list as an option ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/6/a64800d1eceb626994473c375119f1ed99008437.png) Is there any way via the SDK to modify what returns in this list or append your own items? or even if there's a way to "inject" my CSS into the designer in advance so that it sees those options when it calls the function to build out this list. Appreciate any info! EDIT: Separate note, if there is a way to pre-include this theme content as a base theme auto-magically when in the designer (Similar to how Sepasoft does it), that would be fantastic too. ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [January 8, 2025, 5:24pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/2 "2025-01-08T17:24:30Z")
> [@kgamble](#): > > Is there any way via the SDK to modify what returns in this list or append your own items? or even if there's a way to "inject" my CSS into the designer in advance so that it sees those options when it calls the function to build out this list. Nope. The list is generated by Java code that's using the list of style class project resources as the ground truth. Doing anything else would require parsing the CSS, which is both hard to do in Java and also unnecessary, because we're expecting you to be using style classes if you're working with the `classes` key πŸ˜„. > [@kgamble](#): > > EDIT: Separate note, if there is a way to pre-include this theme content as a base theme auto-magically when in the designer (Similar to how Sepasoft does it), that would be fantastic too. Not sure what Sepasoft is doing but themes are going to be a regular gateway config resource like every other in 8.3, so that will probably be easier there. ---
**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\ **Post date:** [January 8, 2025, 5:34pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/3 "2025-01-08T17:34:56Z")
> [@paul-griffith](#): > > Nope. The list is generated by Java code that's using the list of style class project resources as the ground truth. Doing anything else would require parsing the CSS, which is both hard to do in Java and also unnecessary, because we're expecting you to be using style classes if you're working with the `classes` key πŸ˜„. Hmmm, okay, then alternative solution. Is there a way to control what CSS is provided to the Designer vs what CSS is provided to the browser by a module? In the designer I need to provide a mega-css file that is too large for a production screen, but will have each of the possible style permutations necessary. However in Production I need to provide a minified version that only has what the user included in their view. I can handle determining what was used, etc. Its more a question of is there a way to have a module include a browser resource of CSS that is unique across Designer vs Client Session? ---
**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\ **Post date:** [January 8, 2025, 5:35pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/4 "2025-01-08T17:35:49Z")
I don't think there's any direct API for doing so (but I'm not a Perspective expert) but it seems _plausible_? ---
**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\ **Post date:** [January 8, 2025, 5:48pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/5 "2025-01-08T17:48:40Z")
Seems you would need to mount a servlet that inspected the Perspective session to decide what file version to deliver. (Ewww! Browser-side caching would have to be disabled.) ---
**Author:** ![bmusson](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/bmusson/32/87530_2.png) [@bmusson](https://forum.inductiveautomation.com/u/bmusson)\ **Post date:** [January 8, 2025, 6:14pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/6 "2025-01-08T18:14:48Z")
Cross posting here for reference. Idea? Instead of directly providing the CSS as a browser resource, provide a JavaScript file instead. Then from the JS, decide whether to load the client-minified version or the full designer version. ---
**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\ **Post date:** [January 8, 2025, 6:17pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/7 "2025-01-08T18:17:51Z")
> [@bmusson](#): > > Cross posting here for reference. You beat me to it! I was mid typing that... lol I started to play with this idea, but I couldn't get any browser resources to implicitly load without the module registering a component and setting the browser resources during on the descriptor with `setResources` Is there any way to add in browser resources without adding in a component? For reference this is for adding in a CSS library into Perspective, hence not-needing the component. ---
**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\ **Post date:** [January 8, 2025, 6:58pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/8 "2025-01-08T18:58:21Z")
Hmm... thinking out loud. I think if I added a component that was not "selectable" by the user (i.e. the `ia.display.drawing` component is like this). Then I could have it mount a specific resource in the designer, and a different one in the browser. Now to figure out how to make a "hidden" component... ---
**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\ **Post date:** [January 8, 2025, 10:33pm UTC](https://forum.inductiveautomation.com/t/modifying-perspective-style-class-list/100601/9 "2025-01-08T22:33:35Z")
OK, I have an update for those curious If you create a perspective component in your module, and do not add a pallete entry to the ComponentDescriptor, then it won’t show up as a selectable component by the user. However, even though the component is not possible to use, it will still load the browser resources into the webpage. This allowed me to create a specific Component for the designer and a specific component for the gateway that only include a browser resource each of my CSS This then implicitly makes it all available to components! I wonder what else this could be used for ? πŸ€”