Project

General

Profile

Actions

Improvements #14380

closed
MT RM

tooltip does not display in bootstrap 5

Improvements #14380: tooltip does not display in bootstrap 5

Added by Mark Travis 6 months ago. Updated 6 months ago.

Status:
Closed
Priority:
High
Target version:
Start date:
03/07/2026
Due date:
% Done:

0%

Estimated time:

Description

When you apply Wt::WBootstrap5Theme(), Wt hardcodes the legacy Bootstrap 3 class "in" to animate tooltips when you hover over them.

Modern Bootstrap 5 styling expects the class "show". Because the tooltip has "in" instead of "show" some Bootstrap 5 libraries explicitly hide any .fade element that doesn't have the .show class.

Wt injects

, it triggers .fade:not(.show) and gets an opacity: 0; applied to it permanently.

Changing the following method in WBootstrap5Theme to use "show" instead of "in" should fix the problem.


std::string WBootstrap5Theme::utilityCssClass(int utilityCssClassRole) const
{
  switch (utilityCssClassRole) {
  case ToolTipInner:
    return "tooltip-inner";
  case ToolTipOuter:
    return "tooltip fade top in position-absolute";
  default:
    return "";
  }
}

RM Updated by Romain Mardulyn 6 months ago Actions #1

  • Status changed from New to InProgress
  • Assignee set to Romain Mardulyn
  • Target version set to 4.12.6

RM Updated by Romain Mardulyn 6 months ago Actions #2

  • Tracker changed from Bug to Improvements
  • Status changed from InProgress to Review
  • Assignee deleted (Romain Mardulyn)

RM Updated by Romain Mardulyn 6 months ago Actions #3

  • Assignee set to Raf Pauwels

RP Updated by Raf Pauwels 6 months ago Actions #4

  • Status changed from Review to Resolved
  • Assignee changed from Raf Pauwels to Romain Mardulyn

RM Updated by Romain Mardulyn 6 months ago Actions #5

  • Status changed from Resolved to Implemented @Emweb

RM Updated by Romain Mardulyn 6 months ago Actions #6

  • Status changed from Implemented @Emweb to Closed
Actions

Also available in: PDF Atom