Decrease font size of pill

This commit is contained in:
Ajay
2022-01-05 17:26:05 -05:00
parent d23e434209
commit a6a9b7dd8c
4 changed files with 12 additions and 6 deletions

View File

@@ -619,6 +619,9 @@ input::-webkit-inner-spin-button {
padding-right: 8px; padding-right: 8px;
margin-right: 3px; margin-right: 3px;
color: white; color: white;
cursor: pointer;
font-size: 75%;
height: 100%;
} }
.sponsorBlockCategoryPillTitleSection { .sponsorBlockCategoryPillTitleSection {

View File

@@ -9,6 +9,7 @@ export interface CategoryPillProps {
export interface CategoryPillState { export interface CategoryPillState {
segment?: SponsorTime; segment?: SponsorTime;
show: boolean; show: boolean;
open?: boolean;
} }
class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryPillState> { class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryPillState> {
@@ -18,7 +19,8 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
this.state = { this.state = {
segment: null, segment: null,
show: false show: false,
open: false
}; };
} }
@@ -30,7 +32,7 @@ class CategoryPillComponent extends React.Component<CategoryPillProps, CategoryP
return ( return (
<span style={style} <span style={style}
className="sponsorBlockCategoryPill" > className={"sponsorBlockCategoryPill"} >
<span className="sponsorBlockCategoryPillTitleSection"> <span className="sponsorBlockCategoryPillTitleSection">
<img className="sponsorSkipLogo sponsorSkipObject" <img className="sponsorSkipLogo sponsorSkipObject"
src={chrome.extension.getURL("icons/IconSponsorBlocker256px.png")}> src={chrome.extension.getURL("icons/IconSponsorBlocker256px.png")}>

View File

@@ -647,7 +647,7 @@ function setupCategoryPill() {
categoryPill = new CategoryPill(); categoryPill = new CategoryPill();
} }
categoryPill.attachToPage(onMobileYouTube); categoryPill.attachToPage(onMobileYouTube, onInvidious);
} }
async function sponsorsLookup(id: string, keepOldSubmissions = true) { async function sponsorsLookup(id: string, keepOldSubmissions = true) {

View File

@@ -16,7 +16,7 @@ export class CategoryPill {
this.ref = React.createRef(); this.ref = React.createRef();
} }
async attachToPage(onMobileYouTube: boolean): Promise<void> { async attachToPage(onMobileYouTube: boolean, onInvidious: boolean): Promise<void> {
const referenceNode = const referenceNode =
await GenericUtils.wait(() => await GenericUtils.wait(() =>
// YouTube, Mobile YouTube, Invidious // YouTube, Mobile YouTube, Invidious
@@ -49,7 +49,7 @@ export class CategoryPill {
this.mutationObserver.disconnect(); this.mutationObserver.disconnect();
} }
this.mutationObserver = new MutationObserver(() => this.attachToPage(onMobileYouTube)); this.mutationObserver = new MutationObserver(() => this.attachToPage(onMobileYouTube, onInvidious));
this.mutationObserver.observe(referenceNode, { this.mutationObserver.observe(referenceNode, {
childList: true, childList: true,
@@ -66,7 +66,8 @@ export class CategoryPill {
setVisibility(show: boolean): void { setVisibility(show: boolean): void {
const newState = { const newState = {
show show,
open: show ? this.ref.current?.state.open : false
}; };
if (this.ref.current) { if (this.ref.current) {