cancel
Showing results for 
Search instead for 
Did you mean: 

Is there any css for tree component which is introduced newly in 1.6 ?

Former Member
0 Kudos

Hi,

I tried changing the font size and color of the font of the contents in tree structure after adding hierarchy to it.

I tried using the below code for it. I was unsuccessful.

I have used the below code.

background-color: rgb(81,81,81);

line-height: 20px;

font-family:"HelveticaNeue-Regular", sans-serif;

font-weight: bold;

font-size: 25px;

text-align: Center;

color: white;

What wrong I'm doing here ?

Thank you

Accepted Solutions (1)

Accepted Solutions (1)

Former Member
0 Kudos

Hi Rajath Gowda,

You haven't affect the native class of tree component.

Use below code to achieve the result, and css class as 'hierarchy' in property sheet.

Thanks,

Ganesh Babu, VisualBI Solutions.

Former Member
0 Kudos

Hi Ganesh,

Thanks but I'm not successful in implementing it.

Can you be more specific . can you elaborate .

I added sapUiTableCell > .sapUiTv

Former Member
0 Kudos

To modfiy css of DS components, we need to affect its native CSS class (defined on DS theme level).

Likewise, to modify css of Tree component, you need to edit in the native class instead of creating a new one. One of the native class of tree component is, .sapUiTableCell > .sapUiTv

Please share screenshot in case you feel difficulty in achieving this.

Thanks,

Ganesh

Former Member
0 Kudos

.hierarchy.sapUiTableCell>.sapUiTv

{

line-height: 20px !important;

font-family: Arial, Helvetica, sans-serif!important;

font-weight: bold !important;

font-size: 26px !important;

color: rgb(81,81,81) !important;

}

this is the css I'm using, with the changes as you explained.

Nothing is changing in the component

Former Member
0 Kudos

Hi,

CSS is tricky part here, include a space between the custom class and the native class of tree component. (underlined to show the difference)

It should be like,

.hierarchy. sapUiTableCell>.sapUiTv


It should affect the tree component now.

Thanks,

Ganesh Babu,

VisualBI Solutions.

Former Member
0 Kudos

Thanks its working fine

Answers (2)

Answers (2)

Former Member
0 Kudos

Hi Rajath,

Did you try '!important' thing in your css-options?

Former Member
0 Kudos

Hi Alexandr,

!important is not working I tried it.

TammyPowlas
Active Contributor
0 Kudos

First- are you using the tree component as part of the Info Chart?

Where are you placing the CSS? Please share screen shots - use the camera icon to upload

Former Member
0 Kudos

No I'm not taking it as part of infochart ..
its a different component.

hierarchy is my class name. In hierarchy class I have written the above css code.

and this is the hierarchy. done using tree component