Tooltip on London theme

Tooltip on London theme

  

Hello community.


I'm trying to use the tooltip widget, from Silk UI but can't make it work.

I'm using the London theme and I'm afraid that is the reason of my failure.

Can anyone confirm that and, If I'm wrong, send and example?

I'm trying to assign the tooltip to an icon.


Thanks

As far as I know your issue is due to the use of the London Theme.

In case you want to continue to use the London Theme you can use the RichWidget Popup Info Balloon to create a tooltip.

Miguel Prego wrote:

Hello community.


I'm trying to use the tooltip widget, from Silk UI but can't make it work.

I'm using the London theme and I'm afraid that is the reason of my failure.

Can anyone confirm that and, If I'm wrong, send and example?

I'm trying to assign the tooltip to an icon.


Thanks


Hi 

Miguel, if you see this class ".tooltipster-content" when was render dont have height or width..


maybe you need to override that class..


Something like that...


.tooltipster-content {
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    padding: 8px 10px;
    overflow: hidden;
    min-height: 100px;
    min-width:  200px;
}


João Batista wrote:

As far as I know your issue is due to the use of the London Theme.

In case you want to continue to use the London Theme you can use the RichWidget Popup Info Balloon to create a tooltip.

Thanks for the reply João but that widget requires a link and a navigation method on that link.
A solution would be link it to a dummy action but that won't be navigate...


Fábio Vaz wrote:

Miguel Prego wrote:

Hello community.


I'm trying to use the tooltip widget, from Silk UI but can't make it work.

I'm using the London theme and I'm afraid that is the reason of my failure.

Can anyone confirm that and, If I'm wrong, send and example?

I'm trying to assign the tooltip to an icon.


Thanks


Hi 

Miguel, if you see this class ".tooltipster-content" when was render dont have height or width..


maybe you need to override that class..


Something like that...


.tooltipster-content {
    font-family: Arial, sans-serif;
    font-size: 14px;
    line-height: 16px;
    padding: 8px 10px;
    overflow: hidden;
    min-height: 100px;
    min-width:  200px;
}


Thanks Fábio!!

Although your solution isn't "perfect" it just needs some ajusts to fit my needs.

Now it's time to work with CSS.


Solution

Miguel 

Can you show the properties of Tooltip widget?

This are the properties of a quick test using London Theme and Tooltip widget. But I have in that module a TooltipClass widget and some CSS adapted. 

Also, did you check the style sheet info on widget? Maybe you are missing some CSS?


Abílio Matos

Solution

Abilio Matos wrote:

Miguel 

Can you show the properties of Tooltip widget?

This are the properties of a quick test using London Theme and Tooltip widget. But I have in that module a TooltipClass widget and some CSS adapted. 

Also, did you check the style sheet info on widget? Maybe you are missing some CSS?


Abílio Matos

Thanks Abilio.


Position Id isn't a required field but made it work when I used something there.

Just that and it worked...


Miguel,

Glad you got it working.


Abílio Matos