mirror of
https://github.com/mue/mue.git
synced 2026-07-11 18:31:47 +02:00
fix and enable custom background colour
This commit is contained in:
@@ -16,7 +16,7 @@ export default class Settings extends React.PureComponent {
|
||||
case 'greetingName': document.getElementById('greetingName').value = ''; break;
|
||||
case 'customBackgroundColour':
|
||||
localStorage.setItem('customBackgroundColour', '');
|
||||
document.getElementById('customBackgroundColour').enabled = 'false';
|
||||
document.getElementById('customBackgroundHex').textContent = 'Disabled';
|
||||
break;
|
||||
case 'customBackground': document.getElementById('customBackground').value = ''; break;
|
||||
case 'blur':
|
||||
@@ -90,12 +90,6 @@ export default class Settings extends React.PureComponent {
|
||||
};
|
||||
};
|
||||
|
||||
/*const hex = localStorage.getItem('customBackgroundColour');
|
||||
if (!hex === '') {
|
||||
document.getElementById('customBackgroundColour').value = hex;
|
||||
document.getElementById('customBackgroundHex').innerText = hex;
|
||||
}*/
|
||||
|
||||
document.getElementById('backgroundImage').classList.toggle('backgroundEffects');
|
||||
document.getElementById('center').classList.toggle('backgroundEffects');
|
||||
}
|
||||
@@ -112,10 +106,10 @@ export default class Settings extends React.PureComponent {
|
||||
return <div className='content'>
|
||||
<span className='closeModal' onClick={this.props.modalClose}>×</span>
|
||||
<h1>{this.props.modalLanguage.title}</h1>
|
||||
<div className="tab">
|
||||
<button className="tablinks" onClick={this.props.openMarketplace}>{this.props.modalLanguage.marketplace}</button>
|
||||
<button className="tablinks" onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
|
||||
<button className="tablinks" id="active">{this.props.modalLanguage.settings}</button>
|
||||
<div className='tab'>
|
||||
<button className='tablinks' onClick={this.props.openMarketplace}>{this.props.modalLanguage.marketplace}</button>
|
||||
<button className='tablinks' onClick={this.props.openAddons}>{this.props.modalLanguage.addons}</button>
|
||||
<button className='tablinks' id='active'>{this.props.modalLanguage.settings}</button>
|
||||
</div>
|
||||
<br/>
|
||||
|
||||
|
||||
@@ -19,6 +19,12 @@ export default class BackgroundSettings extends React.PureComponent {
|
||||
|
||||
reader.readAsDataURL(file);
|
||||
};
|
||||
|
||||
const hex = localStorage.getItem('customBackgroundColour');
|
||||
if (hex !== '') {
|
||||
document.getElementById('customBackgroundColour').value = hex;
|
||||
document.getElementById('customBackgroundHex').innerText = hex;
|
||||
} else document.getElementById('customBackgroundHex').innerText = 'Disabled';
|
||||
}
|
||||
|
||||
render() {
|
||||
@@ -50,11 +56,11 @@ export default class BackgroundSettings extends React.PureComponent {
|
||||
<button className='uploadbg' onClick={() => document.getElementById('bg-input').click()}>{this.props.language.background.upload}</button>
|
||||
<input id='bg-input' type='file' name='name' className='hidden' accept='image/svg+xml, image/jpeg, image/png, image/webp, image/webm, image/gif' />
|
||||
</ul>
|
||||
{ /* <ul>
|
||||
<p>{this.props.language.background.customcolour} <span className='modalLink' onClick={() => this.resetItem('customBackgroundColour')}>Reset</span></p>
|
||||
<ul>
|
||||
<p>{this.props.language.background.customcolour} <span className='modalLink' onClick={() => this.props.resetItem('customBackgroundColour')}>{this.props.language.reset}</span></p>
|
||||
<input name='colour' type='color' id='customBackgroundColour' onChange={() => document.getElementById('customBackgroundHex').innerText = document.getElementById('customBackgroundColour').value}></input>
|
||||
<label htmlFor='colour' id='customBackgroundHex'>#00000</label>
|
||||
</ul> */ }
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user