# Styling Perspective Tree branches?

**URL:** <https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074>\
**Category:** Ignition\
**Tags:** perspective\
**Created:** [February 21, 2024, 4:40am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074 "2024-02-21T04:40:48Z")\
**Posts on this page:** 19\
**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:** [February 21, 2024, 4:40am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/1 "2024-02-21T04:40:48Z")

</div>

I want to be able to style the text on individual branches of a tree, for example I want to add a search/filter and highlight the text in the branches that contain the search term(s). I've tried adding a style key value into the branches and setting the colour, but no dice 🙄

---

<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:** [February 21, 2024, 7:55am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/2 "2024-02-21T07:55:13Z")

</div>

not to hard hard to select tree-items with css, but for dynamic css changes you'll need the markown component  
`*=` is contains

```auto
.tree-item[data-label*="Item 2"] {
    background-color:red;
}

```

another way without markdown is to define all the paths... if the tree view isnt to dynamic (or you have time to define a lot of posibilites)

then you would just have to change the class on the tree

```auto
.psc-select0 .parent-node[data-item-path="0"] > .tree-row{
    background-color:red;
}

.psc-select1 .parent-node[data-item-path="1"] > .tree-row{
    background-color:red;
}
.psc-select1-0 .parent-node[data-item-path="1/0"] > .tree-row{
    background-color:red;
}

```

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

---

<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:** [March 22, 2024, 2:24pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/3 "2024-03-22T14:24:23Z")

</div>

Hey Victor, I'm finally getting back to this and trying to use the Markdown component to add this CSS dynamically, but I'm not getting anywhere...

I'm practicing just trying to add a Label at this stage via a script, but not really sure how to fire it on load.

I've got this in my Markdown with HTML un-escaped:

```auto
<script>
// Create the label element
var label = document.createElement('label');
label.textContent = 'Hello'; // Set the text content

// Get a reference to an existing element where you want to insert the label
var targetElement = document.getElementById('hello');

// Append the label to the target element
targetElement.appendChild(label);
</script>

```

This script works if I run it in the devtools console, so I presume it's just not firing in the Markdown.

(If it's not obvious, this is really my first real foray into this stuff!!)

The code I got to work in the console to add the CSS is this:

```auto
const sheet = new CSSStyleSheet();
sheet.replaceSync('.tree-item[data-label*="job_dld"] { background-color:green; }');
document.adoptedStyleSheets = [sheet]

```

But again, I don't know how to force it to trigger

---

<div class="post-metadata">

**Author:** ![ryan.white](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan.white/32/73193_2.png) [@ryan.white](https://forum.inductiveautomation.com/u/ryan.white)\
**Post date:** [March 22, 2024, 5:48pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/4 "2024-03-22T17:48:07Z")

</div>

Non javascript option for consideration, I was able to get something working by having a function that modifies the tree item's label to include a set number of leading spaces when their text contains the search string.

The problem this approach is that it requires you to 'rebuild' the tree's items every time. I don't know how well it will scale on large tree structures.

```auto
def recursiveSearchMarkExpand(items, key):
	"""
	Recursively searches through a tree structure and expands to nodes that contain the search key
	Injects a set number of spaces in front of labels for items with the search key so it can be selected using CSS selectors
	"""
	expandParent = False
	for item in items:
		if bool(re.search(key, item['label'].lower(), flags=re.IGNORECASE)):
			item['label'] = " " + item['label'].strip()
			expandParent = True

		# Remove leading spaces left over from last search pass-
		else:
			item['label'] = item['label'].strip()

		if len(item['items']):
			item['items'], childHasKey = recursiveSearchHighlightExpand(item['items'], key)
			item['expanded'] = childHasKey
			# If any child has key, mark that the parent of this item needs to be expanded
			if childHasKey:
				expandParent = True

	return items, expandParent

```

I have the search box text bound to a view custom property with a change script that takes the current tree items and runs it through the above function and returns the modified items to place back into the tree.

I combine it with the following definition in the style sheet:

```auto
/* Highlights items in tree that match search text */ 
.psc-CUSTOM\/Tree\/Item *[data-label^=" "]{
	background-color: #FFE8CC;
}

```

and the end result is:

> **Tree Search Example**
>
> ![TreeSearchExample](https://us1.discourse-cdn.com/inductiveautomation/original/3X/2/3/23bb17cfc96089d22f5681efeef4870b63587b5b.png)

---

<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:** [March 25, 2024, 7:41am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/5 "2024-03-25T07:41:38Z")

</div>

yeah scripts dont run on load like this, thats why i wrap my scripts in the onload of an img object

```auto
	code = """<img style='display:none' src='/favicon.ico' onload=\"
		console.log('hey');				
	\"></img>""".replace("\n", "").replace("\t", "")
	return code

```

Do note that the added a css sheet will not disspear, when closing the view, and if you open a new view a second css sheet will be made... (i think)  
Css sheets also can get cached, so this might turn out ugly after a while.

Its better to just add in a `<style>` object instead of a script (or the onload img) for css related injections. and use python to generate your style "dynamicaly"

```auto
styles=".iaDropdownCommon_options [data-label='YourLabel']:before { content: url('/system/images/Builtin/icons/16/check2.png');	}"
	code = """<style>
		"""+styles+"""
	\"></style>""".replace("\n", "").replace("\t", "")
	return code

```

> [@\[FEATURE\] Add ability to add Icon and styling to Perspective Dropdown items](https://forum.inductiveautomation.com/t/feature-add-ability-to-add-icon-and-styling-to-perspective-dropdown-items/73823/2):
>
> put this in the markdown component binding like usual you'll ofc will have to add some python logic to append the style string based on the required labels in de dropdown (idk if everyone has these Builtin/icons or is it from my test project?) styles=".iaDropdownCommon\_options [data-label='YourLabel']:before { content: url('/system/images/Builtin/icons/16/check2.png'); }" code = """\<style\> """+styles+""" \"\>\</style\>""".replace("\n", "").replace("\t", "") return code

---

<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:** [March 26, 2024, 1:33am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/6 "2024-03-26T01:33:42Z")

</div>

Hmm, I can get it working for the dropdown as you've got it, but can't get it working for the tree-item class:

```auto
def transform(self, value, quality, timestamp):
	styles="""
	.tree-item [data-label*='%s'] {
		background-color: #ff0000;
	}
	""" % value
	
	code = """<style>
		"""+styles+"""
	\"></style>""".replace("\n", "").replace("\t", "")
	return code

```

where `value = 'UPDATE'` coming from a text input component. I successfully used this in the script transform for the dropdown as well.

I'll keep plugging away...

---

<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:** [March 26, 2024, 2:06am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/7 "2024-03-26T02:06:12Z")

</div>

Ok, rookie mistake and result of a lack of CSS syntax knowledge... I added a space between `.tree-item` and `[data-label...]`

Removing the space made it work. My bad.

```auto
def transform(self, value, quality, timestamp):
	styles="""
	.tree-item[data-label*='%s'] {
		background-color: #c1f0c9;
	}""" % value
	
	code = """<style>
		"""+styles+"""
	\"></style>""".replace("\n", "").replace("\t", "")
	return code

```

Thanks!! This is very cool

---

<div class="post-metadata">

**Author:** ![ryan.white](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/ryan.white/32/73193_2.png) [@ryan.white](https://forum.inductiveautomation.com/u/ryan.white)\
**Post date:** [March 26, 2024, 2:08am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/8 "2024-03-26T02:08:40Z")

</div>

Does this also expand the tree branch nodes/children? Or does it just apply the styling?

---

<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:** [March 26, 2024, 2:11am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/9 "2024-03-26T02:11:48Z")

</div>

It only applies styling. Expanding the nodes would mean traversing the `props.items` and toggling the `expanded` prop via script. For my use-case, I have all nodes expanded though so no need, it'd be super useful though in other circumstances

---

<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:** [March 26, 2024, 5:21am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/10 "2024-03-26T05:21:51Z")

</div>

Ok, CSS question now along the same vein. Maybe this should be a separate post... oh well.

I want to set the background colour of the whole `parent-node` class div that has a tree-row child which has a tree-item child where its data-label prop value is 'UPDATE', but I can't work out what the selector should be..

I've tried below but it seems to select a lot of the .parent-nodes despite them not containing the correct children and data-label.

```auto
.parent-node:has(.tree-row .tree-item[data-label="UPDATE"]){
    background-color: #ff0000;
}

```

E.g. below it should have only selected the items with the blue bar on the left.

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/f/c/fc0213de72c97fe03d7a8cd7057c7e56a779e930.png)

E.g. I want to select the orange if it contains a tree-view class div with a child tree-item class div where the data-label equals "UPDATE".

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/c/e/ce2341df3b728a9e30ee3e040ca32ab0cb287702.png)  
Or, for red conditionals, select blue parent-node div:  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/e/0/e00879c64d3a00e38f956244b859ff176c07563d.png)

HTML below, look for:  
\<------ WANT TO TARGET THIS ------\<\<\<  
and  
\<------ IF THIS = "UPDATE" ------\<\<\<

> **HTML**
>
> ```auto
> <div class="parent-node"
> draggable="false"
> data-item-path="1/1">
> <div class="tree-alignment vert-alignment ia_treeComponent__alignmentGuide"
> style="left: 32px; top: 30px; height: calc(100% - 30px);"/>
> <div class="tree-row ia_treeComponent __node ia_treeComponent__ node--expanded">
> <div class="tree-item"
> data-label="2024-03-26 15:31:01.837 - project.JOB_STS"
> style="padding-left: 20px; height: 30px;">
> <svg viewBox="0 0 24 24"
> class="expand-icon ia_treeComponent __expandIcon ia_treeComponent__ expandIcon--expanded"
> data-icon="material/arrow_drop_down">
> <g class="icon"
> id="arrow_drop_down">
> <path d="M7 10l5 5 5-5z"/>
> </g>
> </svg>
> <div class="tree-item-label">
> <div class="label-wrapper label-wrapper-icon">
> <svg viewBox="0 0 24 24"
> class="node-icon ia_treeComponent __node__ icon ia_treeComponent __node__ icon--expanded"
> data-icon="material/functions"
> style="fill: rgb(43, 43, 43);">
> <g class="icon"
> id="functions">
> <path d="M18 4H6v2l6.5 6L6 18v2h12v-3h-7l5-5-5-5h7z"/>
> </g>
> </svg>
> </div>
> <div class="label-wrapper label-wrapper-text">
> <div class="text-scroll">2024-03-26 15:31:01.837 - project.JOB_STS</div>
> </div>
> </div>
> </div>
> </div>
> <div class="parent-node" <------ WANT TO TARGET THIS ------<<<
> draggable="false"
> data-item-path="1/1/0">
> <div class="tree-row ia_treeComponent __node ia_treeComponent__ node--expanded">
> <div class="tree-item"
> data-label="UPDATE" <------ IF THIS = "UPDATE" ------<<<
> style="padding-left: 40px; height: 30px;">
> <svg viewBox="0 0 24 24"
> class="expand-icon ia_treeComponent __expandIcon ia_treeComponent__ expandIcon--expanded"
> data-icon="material/arrow_drop_down">
> <g class="icon"
> id="arrow_drop_down">
> <path d="M7 10l5 5 5-5z"/>
> </g>
> </svg>
> <div class="tree-item-label">
> <div class="label-wrapper label-wrapper-icon">
> <svg viewBox="0 0 24 24"
> class="node-icon ia_treeComponent __node__ icon ia_treeComponent __node__ icon--expanded"
> data-icon="material/folder_open">
> <g class="icon"
> id="folder_open">
> <path d="M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z"/>
> </g>
> </svg>
> </div>
> <div class="label-wrapper label-wrapper-text">
> <div class="text-scroll">UPDATE</div>
> </div>
> </div>
> </div>
> </div>
> <div class="terminal-node"
> data-item-path="1/1/0/0">
> <div class="tree-row ia_treeComponent __node ia_treeComponent__ node--collapsed">
> <div class="tree-alignment terminal-alignment ia_treeComponent__alignmentGuide"
> style="left: 72px;">
> <div class="cross-alignment ia_treeComponent__alignmentGuide"/>
> </div>
> <div class="tree-item"
> data-label="goodResponse = True"
> style="padding-left: 60px; height: 30px;">
> <svg viewBox="0 0 24 24"
> class="terminal-expand-icon ia_treeComponent__terminalExpandIcon"
> data-icon=""/>
> <div class="tree-item-label">
> <div class="label-wrapper label-wrapper-icon">
> <svg viewBox="0 0 24 24"
> class="node-icon ia_treeComponent __node__ icon ia_treeComponent __node__ icon--collapsed"
> data-icon="material/stop">
> <g class="icon"
> id="stop">
> <path d="M6 6h12v12H6z"/>
> </g>
> </svg>
> </div>
> <div class="label-wrapper label-wrapper-text">
> <div class="text-scroll">goodResponse = True</div>
> </div>
> </div>
> </div>
> </div>
> </div>
> <div class="parent-node"
> draggable="false"
> data-item-path="1/1/0/1">
> <div class="tree-row ia_treeComponent __node ia_treeComponent__ node--expanded">
> <div class="tree-item"
> data-label="SYSTEM Response"
> style="padding-left: 60px; height: 30px;">
> <svg viewBox="0 0 24 24"
> class="expand-icon ia_treeComponent __expandIcon ia_treeComponent__ expandIcon--expanded"
> data-icon="material/arrow_drop_down">
> <g class="icon"
> id="arrow_drop_down">
> <path d="M7 10l5 5 5-5z"/>
> </g>
> </svg>
> <div class="tree-item-label">
> <div class="label-wrapper label-wrapper-icon">
> <svg viewBox="0 0 24 24"
> class="node-icon ia_treeComponent __node__ icon ia_treeComponent __node__ icon--expanded"
> data-icon="material/folder_open">
> <g class="icon"
> id="folder_open">
> <path d="M20 6h-8l-2-2H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V8h16v10z"/>
> </g>
> </svg>
> </div>
> <div class="label-wrapper label-wrapper-text">
> <div class="text-scroll">SYSTEM Response</div>
> </div>
> </div>
> </div>
> </div>
> <div class="terminal-node"
> data-item-path="1/1/0/1/0">
> <div class="tree-row ia_treeComponent __node ia_treeComponent__ node--collapsed">
> <div class="tree-alignment terminal-alignment ia_treeComponent__alignmentGuide"
> style="left: 92px;">
> <div class="cross-alignment ia_treeComponent__alignmentGuide"/>
> </div>
> <div class="tree-item"
> data-label="statusMsg = None"
> style="padding-left: 80px; height: 30px;">
> <svg viewBox="0 0 24 24"
> class="terminal-expand-icon ia_treeComponent__terminalExpandIcon"
> data-icon=""/>
> <div class="tree-item-label">
> <div class="label-wrapper label-wrapper-icon">
> <svg viewBox="0 0 24 24"
> class="node-icon ia_treeComponent __node__ icon ia_treeComponent __node__ icon--collapsed"
> data-icon="material/stop">
> <g class="icon"
> id="stop">
> <path d="M6 6h12v12H6z"/>
> </g>
> </svg>
> </div>
> <div class="label-wrapper label-wrapper-text">
> <div class="text-scroll">statusMsg = None</div>
> </div>
> </div>
> </div>
> </div>
> </div>
> <div class="terminal-node"
> data-item-path="1/1/0/1/1">
> <div class="tree-row ia_treeComponent __node ia_treeComponent__ node--collapsed">
> <div class="tree-alignment terminal-alignment ia_treeComponent__alignmentGuide last-child"
> style="left: 92px;">
> <div class="cross-alignment ia_treeComponent__alignmentGuide"/>
> </div>
> <div class="tree-item"
> data-label="statusCode = 204"
> style="padding-left: 80px; height: 30px;">
> <svg viewBox="0 0 24 24"
> class="terminal-expand-icon ia_treeComponent__terminalExpandIcon"
> data-icon=""/>
> <div class="tree-item-label">
> <div class="label-wrapper label-wrapper-icon">
> <svg viewBox="0 0 24 24"
> class="node-icon ia_treeComponent __node__ icon ia_treeComponent __node__ icon--collapsed"
> data-icon="material/stop">
> <g class="icon"
> id="stop">
> <path d="M6 6h12v12H6z"/>
> </g>
> </svg>
> </div>
> <div class="label-wrapper label-wrapper-text">
> <div class="text-scroll">statusCode = 204</div>
> </div>
> </div>
> </div>
> </div>
> </div>
> </div>
> </div>
> </div>
> 
> ```

Update:  
This works! Not entirely sure why it needs the double .parent-node thouhg...

```auto
.parent-node .parent-node:has(.tree-row):has(.tree-item[data-label="UPDATE"]){
    background-color: #ff0000;
}

```

Although it selects too much... it selects the asdsad item as well  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/3/33549bd42a5afc5a5a29eb08e48a7cfde3bedab1.png)

Prepending yet _another_ `.parent-node` fixes it 😮‍💨

```auto
.parent-node .parent-node .parent-node:has(.tree-row):has(.tree-item[data-label="UPDATE"]){
    background-color: #ff0000;
}

```

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/7/7771131b3cea21a2fd9bdea4afe7ceacb68bced9.png)

Update2:  
Gemini is telling me that CSS isn't able to select the parent of a child with certain characteristics ☹

---

<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:** [March 26, 2024, 7:43am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/11 "2024-03-26T07:43:49Z")

</div>

Dont use multiple parents, makes your css content dependend.  
You can use `>` which means "directly followed by". To prevent higher lvl parents to be selected aswell

```auto
.parent-node:has(> .tree-row .tree-item[data-label="UPDATE"]){
    background-color: #ff0000;
}

```

 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/7/775d065dc51bdeea319968ad0a0a6b047521befd.png)

> [@nminchin](#):
>
> Gemini

:has is quite a new feature, the ai's probably dont know about.

---

<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:** [March 26, 2024, 8:16am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/12 "2024-03-26T08:16:51Z")

</div>

> [@victordcq](#):
>
> Dont use multiple parents, makes your css content dependend.  
> You can use `>` which means "directly followed by". To prevent higher lvl parents to be selected aswell
> 
> ```auto
> 
> ```

Nice, that's what I was looking for but I didn't know it could be used inside of `:has` 🙂 I feel like i've only scratched the surface of CSS...  
That works perfectly, Cheers!

---

<div class="post-metadata">

**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:** [March 26, 2024, 9:40pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/13 "2024-03-26T21:40:12Z")

</div>

> [@victordcq](#):
>
> :has is quite a new feature, the ai's probably dont know about.

(Somewhat) interestingly, ChatGPT4 very authoritatively says it's impossible, until reminded about `:has`, at which point it reluctantly spits out _exactly_ what you have there, Victor. 🤷‍♂️

> **[ChatGPT](https://chat.openai.com/share/357cd17e-fd17-43f3-9c21-278922bbe1d6)**
>
> A conversational AI system that listens, learns, and challenges

---

<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:** [March 26, 2024, 11:05pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/14 "2024-03-26T23:05:33Z")

</div>

I found the same thing in Gemini, it said "nope, can't do it" (paraphrasing its essay) and then after Victor's post, I said "what about using \> inside has?" and it sheepishly backpeddled 🙂

---

<div class="post-metadata">

**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:** [March 26, 2024, 11:18pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/15 "2024-03-26T23:18:26Z")

</div>

> [@nminchin](#):
>
> sheepishly backpeddled

Now, how did they get it to be _ **sheepish** _ ?!?

Maybe there **is** a kernel of general intelligence there. 😬

---

<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:** [March 26, 2024, 11:52pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/16 "2024-03-26T23:52:44Z")

</div>

![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/5/7589e215ef21c6349d8d7406cf6a425704490393.png)

Ok, so perhaps it wasn't exactly sheepish for a human, but for an AI I think it's as close as it will get! 😄

---

<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:** [March 27, 2024, 7:44am UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/17 "2024-03-27T07:44:42Z")

</div>

Yeah maybe it has a couple of sources of the new feature, but 90% of the data probbaly says its impossible. So it tends to just answer that.

Oh gpt knows when its last updated?:o

> However, as of my last update in April 2023,

---

<div class="post-metadata">

**Author:** ![Felipe\_CRM](https://avatars.discourse-cdn.com/v4/letter/f/dfb087/32.png) [@Felipe\_CRM](https://forum.inductiveautomation.com/u/Felipe_CRM)\
**Post date:** [March 27, 2024, 1:50pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/18 "2024-03-27T13:50:05Z")

</div>

That's one of the hidden instructions it's given at the start of the chat, boilerplate stuff like  
"You are ChatGPT. Your last update was in April 2023. You know just enough programming to be dangerous" etc.

---

<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:** [March 28, 2024, 7:58pm UTC](https://forum.inductiveautomation.com/t/styling-perspective-tree-branches/86074/19 "2024-03-28T19:58:00Z")

</div>

Did you try asking it to sheepishly apologize ?