Fix overlapping text on tooltip when chapters are present

This commit is contained in:
Ajay
2025-06-12 04:07:11 -04:00
parent 9a7c65899e
commit 689594851d
2 changed files with 17 additions and 4 deletions

View File

@@ -115,6 +115,14 @@ div:hover > #previewbar.sbNotInvidious {
transform: translateY(-2em) !important;
}
.ytp-tooltip.sponsorCategoryTooltipVisible.sponsorHasOriginalTooltip {
transform: translateY(-2em) !important;
}
.ytp-tooltip.sponsorCategoryTooltipVisible.sponsorTwoTooltips.sponsorHasOriginalTooltip {
transform: translateY(-3em) !important;
}
.ytp-big-mode .ytp-tooltip.sponsorCategoryTooltipVisible {
transform: translateY(-2em) !important;
}

View File

@@ -3,8 +3,6 @@ Based on code from
https://github.com/videosegments/videosegments/commits/f1e111bdfe231947800c6efdd51f62a4e7fef4d4/segmentsbar/segmentsbar.js
*/
'use strict';
import Config from "../config";
import { ChapterVote } from "../render/ChapterVote";
import { ActionType, Category, SegmentContainer, SponsorHideType, SponsorSourceType, SponsorTime } from "../types";
@@ -205,9 +203,12 @@ class PreviewBar {
this.setTooltipTitle(mainSegment, this.categoryScrubTooltip);
this.setTooltipTitle(secondarySegment, this.chapterScrubTooltip);
}
this.categoryTooltipContainer.classList.remove("sponsorHasOriginalTooltip");
} else {
this.categoryTooltipContainer.classList.add(TOOLTIP_VISIBLE_CLASS);
if (mainSegment !== null && secondarySegment !== null) {
const hasTwoTooltips = mainSegment !== null && secondarySegment !== null;
if (hasTwoTooltips) {
this.categoryTooltipContainer.classList.add("sponsorTwoTooltips");
originalTooltip.classList.remove("sponsorTooltipHasYTChapters");
} else {
@@ -227,11 +228,15 @@ class PreviewBar {
}
if (normalizeChapterName(originalTooltip.textContent) === normalizeChapterName(this.categoryTooltip.textContent)
|| normalizeChapterName(originalTooltip.textContent) === normalizeChapterName(this.chapterTooltip.textContent)) {
|| normalizeChapterName(originalTooltip.textContent) === normalizeChapterName(this.chapterTooltip.textContent)
|| !originalTooltip.textContent) {
if (originalTooltip.style.display !== "none") originalTooltip.style.display = "none";
this.categoryTooltipContainer.classList.remove("sponsorHasOriginalTooltip");
noYoutubeChapters = true;
} else if (originalTooltip.style.display === "none") {
originalTooltip.style.removeProperty("display");
this.categoryTooltipContainer.classList.add("sponsorHasOriginalTooltip");
noYoutubeChapters = false;
}
// To prevent offset issue