Customize the SectionExpandable from SilkUI

  

Can I customize the SectionExpandable from SilkUI

Hi Pankaj,

In which sense you want customization?

Is this a web or mobile?

Regards,

Pankaj

Pankaj pant wrote:

Hi Pankaj,

In which sense you want customization?

Is this a web or mobile?

Regards,

Pankaj

I want to change the look and feel a bit, like a changing the expandable arrow also there is a case when some time I will only have the Title so I do not want to show the arrow in top right.


Pankaj Jain wrote:

Can I customize the SectionExpandable from SilkUI

Yes you can override the respective classes of any widget in your Screen/Project CSS accordingly.

Use Inspect on Chrome to find appropriate CSS of Widgets.


Cheers

Pankaj Jain wrote:

Pankaj pant wrote:

Hi Pankaj,

In which sense you want customization?

Is this a web or mobile?

Regards,

Pankaj

I want to change the look and feel a bit, like a changing the expandable arrow also there is a case when some time I will only have the Title so I do not want to show the arrow in top right.


Yes, you can do it just by overwriting the already existing classes.

If it is a mobile app use this piece of code to hide the top right arrow.


SyntaxEditor Code Snippet

.section-expandable-icon {
  
    display: none;
}


Regards,

Pankaj


Pankaj pant wrote:

Pankaj Jain wrote:

Pankaj pant wrote:

Hi Pankaj,

In which sense you want customization?

Is this a web or mobile?

Regards,

Pankaj

I want to change the look and feel a bit, like a changing the expandable arrow also there is a case when some time I will only have the Title so I do not want to show the arrow in top right.


Yes, you can do it just by overwriting the already existing classes.

If it is a mobile app use this piece of code to hide the top right arrow.


SyntaxEditor Code Snippet

.section-expandable-icon {
  
    display: none;
}


Regards,

Pankaj



Thanks Pankaj, will it possible to make it dynamic based on some condition, if yes then how.

Yes, it's possible what you have to do is,

enclose the section expandable inside a container add a dynamic class based upon the condition.

like below


so based on the condition you have added the class, now use this selector to show hide the icon like below

.selector-class .section-expandable-icon {
  
    display: none;
}



Hope you understand.


Regards,

Pankaj