Colour segment selector based on category colour

This commit is contained in:
Ajay
2025-10-03 02:27:21 -04:00
parent 9deb69b71b
commit 068307f98a

View File

@@ -205,6 +205,8 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
); );
} }
const borderColor = this.state.selectedCategory ? Config.config.barTypes[this.state.selectedCategory]?.color : null;
return ( return (
<div id={"sponsorTimeEditContainer" + this.idSuffix} style={style}> <div id={"sponsorTimeEditContainer" + this.idSuffix} style={style}>
@@ -215,7 +217,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
<select id={"sponsorTimeCategories" + this.idSuffix} <select id={"sponsorTimeCategories" + this.idSuffix}
className="sponsorTimeEditSelector sponsorTimeCategories" className="sponsorTimeEditSelector sponsorTimeCategories"
ref={this.categoryOptionRef} ref={this.categoryOptionRef}
style={{color: "inherit", backgroundColor: "inherit"}} style={{color: "inherit", backgroundColor: "inherit", borderColor}}
value={this.state.selectedCategory} value={this.state.selectedCategory}
onChange={(event) => this.categorySelectionChange(event)}> onChange={(event) => this.categorySelectionChange(event)}>
{this.getCategoryOptions()} {this.getCategoryOptions()}
@@ -240,7 +242,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
<select id={"sponsorTimeActionTypes" + this.idSuffix} <select id={"sponsorTimeActionTypes" + this.idSuffix}
className="sponsorTimeEditSelector sponsorTimeActionTypes" className="sponsorTimeEditSelector sponsorTimeActionTypes"
value={this.state.selectedActionType} value={this.state.selectedActionType}
style={{color: "inherit", backgroundColor: "inherit"}} style={{color: "inherit", backgroundColor: "inherit", borderColor}}
ref={this.actionTypeOptionRef} ref={this.actionTypeOptionRef}
onChange={(e) => this.actionTypeSelectionChange(e)}> onChange={(e) => this.actionTypeSelectionChange(e)}>
{this.getActionTypeOptions(sponsorTime)} {this.getActionTypeOptions(sponsorTime)}
@@ -269,7 +271,7 @@ class SponsorTimeEditComponent extends React.Component<SponsorTimeEditProps, Spo
<div onBlur={() => this.setState({chapterNameSelectorOpen: false})}> <div onBlur={() => this.setState({chapterNameSelectorOpen: false})}>
<input id={"chapterName" + this.idSuffix} <input id={"chapterName" + this.idSuffix}
className="sponsorTimeEdit sponsorTimeEditInput sponsorChapterNameInput" className="sponsorTimeEdit sponsorTimeEditInput sponsorChapterNameInput"
style={{color: "inherit", backgroundColor: "inherit"}} style={{color: "inherit", backgroundColor: "inherit", borderColor}}
ref={this.descriptionOptionRef} ref={this.descriptionOptionRef}
type="text" type="text"
value={this.state.description} value={this.state.description}