• Priority: 0
  • Status: Closed
  • Theme: Venedor
  • Assigned To: Marek
  • Private: No
  • Open Date: 10.12.18, 14:46
  • Opened by: Lafont Thomas
  • Closed by: Marek
  • Closed on: 13.12.18, 15:50
  • Reason: Closed
  • Comment: Glad to help!

Ticket #13345 - Trouble showing tooltip

Hello,

We are experiencing a display problem on your theme.
These are “tooltips” on the attributes of a configurable product.

Example on the following page: https://test.mafenetrefacile.fr/accueil/42-menuiserie-optimum.html

Look in the part of the product named “COULEUR DE VOTRE MENUISERIE” and select “Couleur intérieur et extérieur” you will then see the flyover colors with the mouse the problem.

Tooltips are not displayed correctly.

You can see that with the theme currently online everything works very well: https://mafenetrefacile.fr/accueil/42-menuiserie-optimum.html

Thank you for your quick answer.

PS : Excuse me for the approximate English

Comments

Marek 10 Dec 2018, 22:04

Hi, Lafont Thomas.
I have no idea where you take those tooltips. But first of all try to clear prestashop cache

Lafont Thomas 12 Dec 2018, 11:24

Hello,

The cache had already been emptied, we just redo it.
These tooltips come from the product configuration plugin.

The tooltips work very well on the basic themes (see the address given on the project online) on the same project. We have the problem only with your theme. Thank you for watching please.

Marek 12 Dec 2018, 12:29

Here is the missed CSS code. Put it into the file /themes/venedor/assets/css/theme.css

.popover{position:absolute;top:0;left:0;z-index:1010;display:none;max-width:276px;padding:1px;text-align:left;background-color:#fff;background-clip:padding-box;border:1px solid #ccc;border:1px solid rgba(0,0,0,0.2);border-radius:6px;-webkit-box-shadow:0 5px 10px rgba(0,0,0,0.2);box-shadow:0 5px 10px rgba(0,0,0,0.2);white-space:normal}
.popover.top{margin-top:-10px}
.popover.right{margin-left:10px}
.popover.bottom{margin-top:10px}
.popover.left{margin-left:-10px}
.popover-title{margin:0;padding:8px 14px;font-size:13px;font-weight:400;line-height:18px;background-color:#f7f7f7;border-bottom:1px solid #ebebeb;border-radius:5px 5px 0 0}
.popover-content{padding:9px 14px}
.popover .arrow,.popover .arrow:after{position:absolute;display:block;width:0;height:0;border-color:transparent;border-style:solid}
.popover .arrow{border-width:11px}
.popover .arrow:after{border-width:10px;content:""}
.popover.top .arrow{left:50%;margin-left:-11px;border-bottom-width:0;border-top-color:#999;border-top-color:rgba(0,0,0,0.25);bottom:-11px}
.popover.top .arrow:after{content:" ";bottom:1px;margin-left:-10px;border-bottom-width:0;border-top-color:#fff}
.popover.right .arrow{top:50%;left:-11px;margin-top:-11px;border-left-width:0;border-right-color:#999;border-right-color:rgba(0,0,0,0.25)}
.popover.right .arrow:after{content:" ";left:1px;bottom:-10px;border-left-width:0;border-right-color:#fff}
.popover.bottom .arrow{left:50%;margin-left:-11px;border-top-width:0;border-bottom-color:#999;border-bottom-color:rgba(0,0,0,0.25);top:-11px}
.popover.bottom .arrow:after{content:" ";top:1px;margin-left:-10px;border-top-width:0;border-bottom-color:#fff}
.popover.left .arrow{top:50%;right:-11px;margin-top:-11px;border-right-width:0;border-left-color:#999;border-left-color:rgba(0,0,0,0.25)}
.popover.left .arrow:after{content:" ";right:1px;border-right-width:0;border-left-color:#fff;bottom:-10px}

and don’t forget to remove your custom CSS code for .popover class

Lafont Thomas 13 Dec 2018, 15:13

the /themes/venedor/assets folder doesn’t exist in my project, the project is using prestashop 1.6

Lafont Thomas 13 Dec 2018, 15:48

Thank you for your help we managed to figure out where to put the scripts