diff --git a/hub/services/templates/calculator/csp_roi_calculator.html b/hub/services/templates/calculator/csp_roi_calculator.html
index b608679..f0c4d92 100644
--- a/hub/services/templates/calculator/csp_roi_calculator.html
+++ b/hub/services/templates/calculator/csp_roi_calculator.html
@@ -184,6 +184,16 @@
margin-bottom: 0;
}
+/* Tooltip styling for better native tooltip appearance */
+[data-bs-toggle="tooltip"] {
+ position: relative;
+}
+
+/* Enhanced cursor for tooltip elements */
+[data-bs-toggle="tooltip"]:hover {
+ opacity: 0.8;
+}
+
@media (max-width: 768px) {
.chart-container {
height: 300px;
@@ -602,25 +612,53 @@
0
-
Total Instances
+
+ Total Instances
+
+
CHF 0
-
Total Revenue
+
+ Total Revenue
+
+
0%
-
Average ROI
+
+ Average ROI
+
+
N/A
-
Avg Break-even
+
+ Avg Break-even
+
+
@@ -1160,10 +1198,41 @@ document.addEventListener('DOMContentLoaded', function() {
// Initialize calculator
calculator = new ROICalculator();
+ // Initialize tooltips - check if Bootstrap is available
+ initializeTooltips();
+
// Check if export libraries are loaded and enable/disable buttons accordingly
checkExportLibraries();
});
+// Initialize tooltips with fallback for missing Bootstrap
+function initializeTooltips() {
+ // Check if Bootstrap is available
+ if (typeof bootstrap !== 'undefined' && bootstrap.Tooltip) {
+ // Use Bootstrap tooltips
+ var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'));
+ var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
+ return new bootstrap.Tooltip(tooltipTriggerEl);
+ });
+ } else {
+ // Fallback: Use native title attribute tooltips
+ console.log('Bootstrap not available, using native tooltips');
+ var tooltipElements = document.querySelectorAll('[data-bs-toggle="tooltip"]');
+ tooltipElements.forEach(function(element) {
+ // Move the tooltip content to the native title attribute
+ if (element.getAttribute('title')) {
+ // Title already set, no need to change
+ return;
+ }
+ var tooltipContent = element.getAttribute('data-bs-original-title') ||
+ element.getAttribute('title');
+ if (tooltipContent) {
+ element.setAttribute('title', tooltipContent);
+ }
+ });
+ }
+}
+
// Check if export libraries are loaded
function checkExportLibraries() {
const pdfButton = document.querySelector('button[onclick="exportToPDF()"]');