Mirror/SponsorBlock
1
0
Fork 0
mirror of https://github.com/ajayyy/SponsorBlock.git synced 2025-12-10 05:27:03 +03:00
Code Issues Packages Projects Releases Wiki Activity

Move category pill to top if on description on right layout

Browse Source
This commit is contained in:
Ajay
2024-02-27 22:13:58 -05:00
parent 5f8447ec6b
commit 1909e66c87
3 changed files with 30 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/CategoryPillComponent.tsx
View File

@@ -23,12 +23,14 @@ export interface CategoryPillState {
}
class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryPillState> {
mainRef: React.MutableRefObject<HTMLSpanElement>;
tooltip?: Tooltip;
constructor(props: CategoryPillProps) {
super(props);
this.mainRef = React.createRef();
this.state = {
segment: null,
show: false,
@@ -43,13 +45,17 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
color: this.getTextColor(),
}
// To be able to remove the margin from the parent
this.mainRef?.current?.parentElement?.classList?.toggle("cbPillOpen", this.state.show);
return (
<span style={style}
className={"sponsorBlockCategoryPill" + (!this.props.showTextByDefault ? " sbPillNoText" : "")}
aria-label={this.getTitleText()}
onClick={(e) => this.toggleOpen(e)}
onMouseEnter={() => this.openTooltip()}
onMouseLeave={() => this.closeTooltip()}>
onMouseLeave={() => this.closeTooltip()}
ref={this.mainRef}>
<span className="sponsorBlockCategoryPillTitleSection">
<img className="sponsorSkipLogo sponsorSkipObject"