overleaf/services/web/frontend/js/features/tooltip/index-bs5.ts
Jessica Lawshe ce8781e79f Merge pull request #21694 from overleaf/jel-tooltip-when-needed
[web] Only add tooltip to badge links if badge is clipped

GitOrigin-RevId: c99f3f0732ed6e8112c1af1063f64bcab152b00d
2024-11-08 09:06:19 +00:00

31 lines
908 B
TypeScript

import { Tooltip } from 'bootstrap-5'
const footerLanguageElement = document.querySelector(
'[data-ol-lang-selector-tooltip]'
) as Element
const allTooltips = document.querySelectorAll('[data-bs-toggle="tooltip"]')
const possibleTooltips = document.querySelectorAll(
'[data-bs-toggle="tooltip-if-needed"]'
)
// eslint-disable-next-line no-unused-vars
const footLangTooltip = new Tooltip(footerLanguageElement)
allTooltips.forEach(element => {
// eslint-disable-next-line no-unused-vars
const tooltip = new Tooltip(element)
})
possibleTooltips.forEach(element => {
// put data-bs-toggle="tooltip-if-needed" on .badge-content
// then tooltip is only shown if .badge is clipped due to max-width
if (
element.parentElement &&
element.scrollWidth > element.parentElement?.scrollWidth
) {
// eslint-disable-next-line no-unused-vars
const tooltip = new Tooltip(element)
}
})