# \[FEATURE\] Add inheritance of Perspective Styles

**URL:** <https://forum.inductiveautomation.com/t/feature-add-inheritance-of-perspective-styles/78987>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [September 12, 2023, 2:52am UTC](https://forum.inductiveautomation.com/t/feature-add-inheritance-of-perspective-styles/78987 "2023-09-12T02:52:04Z")\
**Posts on this page:** 4\
**Page:** 1

<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:** [September 12, 2023, 2:52am UTC](https://forum.inductiveautomation.com/t/feature-add-inheritance-of-perspective-styles/78987/1 "2023-09-12T02:52:04Z")

</div>

Please add Perspective Style inheritance so we can inherit styles from other styles. For example, we could then define font size styles which have complex stuff in them for resizing fonts based on orientation, viewport size etc. and then inherit them in other styles that should use these as a base.

Obviously this can't be done in CSS itself since CSS selectors cannot be extended/inherited from each other, so the CSS would need to be combined before it's presented to the browser

Idea:

> **[Add inheritance of Perspective Styles | Ignition Features and Ideas |...](https://ideas.inductiveautomation.com/ignition-features-and-ideas/p/add-inheritance-of-perspective-styles)**
>
> Please add Perspective Style inheritance so we can inherit styles from other styles. For example, we could then define font size styles which have complex

---

<div class="post-metadata">

**Author:** ![humphrey.daniel](https://avatars.discourse-cdn.com/v4/letter/h/8e8cbc/32.png) [@humphrey.daniel](https://forum.inductiveautomation.com/u/humphrey.daniel)\
**Post date:** [September 12, 2023, 5:53am UTC](https://forum.inductiveautomation.com/t/feature-add-inheritance-of-perspective-styles/78987/2 "2023-09-12T05:53:41Z")

</div>

> [@nminchin](#):
>
> ve Style inheritance so we can inherit styles from other styles. For example, we could then define font size style

How would you imagine inheritance enforcement? Do descendants get to override ancestor configurations? You would probably want a function at the ancestor level to re-propagate settings to descendants. Also a lock option for each configuration element, say you lock text font family but not size. I think this feature would provide convenience and is a good idea.

I think you can almost hack it now using the Advanced Stylesheet and wildcard selection  
[https://docs.inductiveautomation.com/display/DOC81/Style+Classes#StyleClasses-EnablingtheAdvancedStylesheet](https://docs.inductiveautomation.com/display/DOC81/Style+Classes#StyleClasses-EnablingtheAdvancedStylesheet)

```css
[class^="psc-"] {
  background-color: red;
}

```

> **[Attribute selectors - CSS: Cascading Style Sheets | MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors)**
>
> The CSS attribute selector matches elements based on the element having a given attribute explicitly set, with options for defining an attribute value or substring value match.

---

<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:** [September 12, 2023, 6:42am UTC](https://forum.inductiveautomation.com/t/feature-add-inheritance-of-perspective-styles/78987/3 "2023-09-12T06:42:47Z")

</div>

The issue with using the stylesheet is that you lose access to being able to select the styles from a dropdown, and you lose the nice visibility of them.

If we could use SCSS (which we can't), then you could use `@extend .psc-FontSize0` to inherit P styles from others, but again, there's low visibility when looking at the perspective styles

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [September 12, 2023, 7:03am UTC](https://forum.inductiveautomation.com/t/feature-add-inheritance-of-perspective-styles/78987/4 "2023-09-12T07:03:40Z")

</div>

You could use sass externally, then compile it and paste the generated css in your project.

But then you also lose the perspective styles GUI and the dropdown selections. And it adds steps outside of the designer. Though theme files are already not accessible from the designer...

A built-in sass compiler would be nice.