"You can not have a cookie and eat a cookie. First, you have to understand how pointer-events works:

That means no click, no hover, no active - nothing with the cursor. You can not say ok, I just want hover and nothing else.

BTW. FB does it like this because they don't allow any changes in the like button. You cannot change a look, cover it, etc."

The accordion item when is disabled it has pointer-events none, so what you are asking will not be possible, I will study and see if I can come up with a solution!

Regards,

Márcio C.

I could do it by doing this. 

Taking out the pointer-events: none

https://marcio-carvalho4.outsystemscloud.com/exemplo/Screen1?_ts=637548042836787461

You have to put this on the theme!

.section-expandable.is--disabled{
    pointer-events: unset;
}

That's the answer from my perspective.

Regards,

Márcio C.

Hi Marcio,

Your answer gave me a good idea for how to solve this issue. However, I'm now running into another problem. How can I set this disable dropdown property to specific sections when I want? I tried putting them into the ExtendedClass section but it doesn't seem to be applying it. Basically, I want to apply that CSS code to the section in specific situations, but without applying it to the theme completely.

Or, can I add it to a theme and then apply that theme under those situations?

You can create a web block and you can put the accordion item and the tooltip inside of that block that has the class!! to that exception. You can see it on my shared oml and use it just when you want. All changes inside the block will reflect in every place where that block is placed.

Regards,

Márcio C.

I'm having trouble opening that because it has a "different License than Development and its Intellectual Property is Protected." Is there a different version you can give me where that won't be an issue?

I will share my prints!!

1- create a block, the accordionException

Insert inside the block a container, a placeholder inside the container and then the accordion and the tooltip for your use case

Put the accordion items and the tooltip and put one of the accordion items disabled 

Then go to the stylesheet of the block and insert this inside

.section-expandable.is--disabled{
    pointer-events: unset;
}

Then move the block to your main content screen

And you will see the result

Regards

Márcio C.

Can you try now»?

Did u manage? 

Regards

Hi Marcio, sorry for the late reply. For this specific project I'm not able to make them all into web blocks. Is there an alternative instead of web blocks, perhaps through variables or something?

The blocks have the purpose to isolate something and replicate it. So another solution is, you can put the exception on the screen you want(in the style sheet, if it doesn't work don't forget to put the !important in the end), or you can use javascript, or even you can create a theme with the purpose to have that exception, but it's going to be in specific flows.

If you are going to put on the screens or in a theme to that purpose, if it doesn't work, insert this:

.section-expandable.is--disabled{
    pointer-events: unset!important;
}

instead of this

.section-expandable.is--disabled{
    pointer-events: unset;
}

Can I insert that text into the ExtendedClass property?

i think you can do this. on the theme, you put this

.section-expandable__disabled-exception .section-expandable.is--disabled{
    pointer-events: unset!important;
}

, and then, on the extended class you put this 

section-expandable__disabled-exception

Here you have! you can try it

What i did was this

Extended Class

And the style you want on the accordion! :)

Regards,

Márcio C.