diff options
| author | Ajay <[email protected]> | 2022-02-06 18:48:03 -0500 |
|---|---|---|
| committer | Ajay <[email protected]> | 2022-02-06 18:48:03 -0500 |
| commit | 8b6f0d8a2e14602ec327eaef9cfa60983a51c697 (patch) | |
| tree | 451f73329e7de5b60eb3c493e2a1548f9cc01433 /src/render/Tooltip.tsx | |
| parent | cf792e849f47adb3111ab9e4f80c4c24fb97d499 (diff) | |
| download | SponsorBlock-8b6f0d8a2e14602ec327eaef9cfa60983a51c697.tar.gz SponsorBlock-8b6f0d8a2e14602ec327eaef9cfa60983a51c697.zip | |
Better title text for full video labels
Diffstat (limited to 'src/render/Tooltip.tsx')
| -rw-r--r-- | src/render/Tooltip.tsx | 30 |
1 files changed, 20 insertions, 10 deletions
diff --git a/src/render/Tooltip.tsx b/src/render/Tooltip.tsx index 3fe14410..fa32d915 100644 --- a/src/render/Tooltip.tsx +++ b/src/render/Tooltip.tsx @@ -9,6 +9,9 @@ export interface TooltipProps { bottomOffset?: string timeout?: number; opacity?: number; + displayTriangle?: boolean; + showLogo: boolean; + showGotIt: boolean; } export class Tooltip { @@ -20,6 +23,9 @@ export class Tooltip { constructor(props: TooltipProps) { props.bottomOffset ??= "70px"; props.opacity ??= 0.7; + props.displayTriangle ??= true; + props.showLogo ??= true; + props.showGotIt ??= true; this.text = props.text; this.container = document.createElement('div'); @@ -40,11 +46,13 @@ export class Tooltip { ReactDOM.render( <div style={{bottom: props.bottomOffset, backgroundColor}} - className="sponsorBlockTooltip" > + className={"sponsorBlockTooltip" + (props.displayTriangle ? " sbTriangle" : "")} > <div> - <img className="sponsorSkipLogo sponsorSkipObject" - src={chrome.extension.getURL("icons/IconSponsorBlocker256px.png")}> - </img> + {props.showLogo ? + <img className="sponsorSkipLogo sponsorSkipObject" + src={chrome.extension.getURL("icons/IconSponsorBlocker256px.png")}> + </img> + : null} <span className="sponsorSkipObject"> {this.text + (props.link ? ". " : "")} {props.link ? @@ -53,16 +61,18 @@ export class Tooltip { rel="noopener noreferrer" href={props.link}> {chrome.i18n.getMessage("LearnMore")} - </a> + </a> : null} </span> </div> - <button className="sponsorSkipObject sponsorSkipNoticeButton" - style ={{float: "right" }} - onClick={() => this.close()}> + {props.showGotIt ? + <button className="sponsorSkipObject sponsorSkipNoticeButton" + style ={{float: "right" }} + onClick={() => this.close()}> - {chrome.i18n.getMessage("GotIt")} - </button> + {chrome.i18n.getMessage("GotIt")} + </button> + : null} </div>, this.container ) |