mirror of
https://github.com/mue/mue.git
synced 2026-07-25 01:37:21 +02:00
refactor(translations): cleanup and fix import settings text
This commit is contained in:
David Ralph
@@ -3,8 +3,7 @@ import { PureComponent } from 'react';
|
||||
import { toast } from 'react-toastify';
|
||||
|
||||
export default class FileUpload extends PureComponent {
|
||||
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
languagecode = variables.languagecode;
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
componentDidMount() {
|
||||
document.getElementById(this.props.id).onchange = (e) => {
|
||||
@@ -16,7 +15,7 @@ export default class FileUpload extends PureComponent {
|
||||
} else {
|
||||
// background upload
|
||||
if (file.size > 2000000) {
|
||||
return toast(this.getMessage(this.languagecode, 'modals.main.file_upload_error'));
|
||||
return toast(this.getMessage('modals.main.file_upload_error'));
|
||||
}
|
||||
|
||||
reader.readAsDataURL(file);
|
||||
|
||||
@@ -7,8 +7,7 @@ import Tooltip from 'components/helpers/tooltip/Tooltip';
|
||||
const other_contributors = require('modules/other_contributors.json');
|
||||
|
||||
export default class About extends PureComponent {
|
||||
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
languagecode = variables.languagecode;
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -16,9 +15,9 @@ export default class About extends PureComponent {
|
||||
contributors: [],
|
||||
sponsors: [],
|
||||
other_contributors: [],
|
||||
photographers: this.getMessage(this.languagecode, 'modals.main.loading'),
|
||||
update: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.checking_update'),
|
||||
loading: this.getMessage(this.languagecode, 'modals.main.loading')
|
||||
photographers: this.getMessage('modals.main.loading'),
|
||||
update: this.getMessage('modals.main.settings.sections.about.version.checking_update'),
|
||||
loading: this.getMessage('modals.main.loading')
|
||||
};
|
||||
this.controller = new AbortController();
|
||||
}
|
||||
@@ -37,8 +36,8 @@ export default class About extends PureComponent {
|
||||
}
|
||||
|
||||
return this.setState({
|
||||
update: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.error.title'),
|
||||
loading: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.error.description')
|
||||
update: this.getMessage('modals.main.settings.sections.about.version.error.title'),
|
||||
loading: this.getMessage('modals.main.settings.sections.about.version.error.description')
|
||||
});
|
||||
}
|
||||
|
||||
@@ -48,9 +47,9 @@ export default class About extends PureComponent {
|
||||
|
||||
const newVersion = versionData[0].tag_name;
|
||||
|
||||
let update = this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.no_update');
|
||||
let update = this.getMessage('modals.main.settings.sections.about.version.no_update');
|
||||
if (Number(window.constants.VERSION.replaceAll('.', '')) < Number(newVersion.replaceAll('.', ''))) {
|
||||
update = `${this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.update_available')}: ${newVersion}`;
|
||||
update = `${this.getMessage('modals.main.settings.sections.about.version.update_available')}: ${newVersion}`;
|
||||
}
|
||||
|
||||
this.setState({
|
||||
@@ -67,8 +66,8 @@ export default class About extends PureComponent {
|
||||
componentDidMount() {
|
||||
if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
|
||||
this.setState({
|
||||
update: this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.checking_update'),
|
||||
loading: this.getMessage(this.languagecode, 'modals.main.marketplace.offline.description')
|
||||
update: this.getMessage('modals.main.settings.sections.about.version.checking_update'),
|
||||
loading: this.getMessage('modals.main.marketplace.offline.description')
|
||||
});
|
||||
return;
|
||||
}
|
||||
@@ -84,34 +83,34 @@ export default class About extends PureComponent {
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
<h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.title')}</h2>
|
||||
<h2>{this.getMessage('modals.main.settings.sections.about.title')}</h2>
|
||||
<img draggable='false' className='aboutLogo' src='./././icons/logo_horizontal.png' alt='Logo'></img>
|
||||
<p>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.copyright')} {window.constants.COPYRIGHT_YEAR}-{new Date().getFullYear()} <a href={'https://github.com/' + window.constants.ORG_NAME + '/' + window.constants.REPO_NAME + '/graphs/contributors'} className='aboutLink' target='_blank' rel='noopener noreferrer'>{window.constants.COPYRIGHT_NAME}</a> ({window.constants.COPYRIGHT_LICENSE})</p>
|
||||
<p>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.version.title')} {window.constants.VERSION} ({this.state.update})</p>
|
||||
<a href={window.constants.PRIVACY_URL} className='aboutLink' target='_blank' rel='noopener noreferrer' style={{ fontSize: '1rem' }}>{this.getMessage(this.languagecode, 'modals.welcome.sections.privacy.links.privacy_policy')}</a>
|
||||
<p>{this.getMessage('modals.main.settings.sections.about.copyright')} {window.constants.COPYRIGHT_YEAR}-{new Date().getFullYear()} <a href={'https://github.com/' + window.constants.ORG_NAME + '/' + window.constants.REPO_NAME + '/graphs/contributors'} className='aboutLink' target='_blank' rel='noopener noreferrer'>{window.constants.COPYRIGHT_NAME}</a> ({window.constants.COPYRIGHT_LICENSE})</p>
|
||||
<p>{this.getMessage('modals.main.settings.sections.about.version.title')} {window.constants.VERSION} ({this.state.update})</p>
|
||||
<a href={window.constants.PRIVACY_URL} className='aboutLink' target='_blank' rel='noopener noreferrer' style={{ fontSize: '1rem' }}>{this.getMessage('modals.welcome.sections.privacy.links.privacy_policy')}</a>
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.contact_us')}</h3>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.about.contact_us')}</h3>
|
||||
<a href={'mailto:' + window.constants.EMAIL} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Email/></a>
|
||||
<a href={'https://twitter.com/' + window.constants.TWITTER_HANDLE} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Twitter/></a>
|
||||
<a href={'https://instagram.com/' + window.constants.INSTAGRAM_HANDLE} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Instagram/></a>
|
||||
<a href={'https://facebook.com/' + window.constants.FACEBOOK_HANDLE} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Facebook/></a>
|
||||
<a href={'https://discord.gg/' + window.constants.DISCORD_SERVER} className='aboutIcon' target='_blank' rel='noopener noreferrer'><Chat/></a>
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.support_mue')}</h3>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.about.support_mue')}</h3>
|
||||
<p>
|
||||
<a href={'https://github.com/sponsors/' + window.constants.DONATE_USERNAME} className='aboutLink' target='_blank' rel='noopener noreferrer'>GitHub Sponsors</a>
|
||||
• <a href={'https://ko-fi.com/' + window.constants.DONATE_USERNAME} className='aboutLink' target='_blank' rel='noopener noreferrer'>Ko-Fi</a>
|
||||
• <a href={'https://patreon.com/' + window.constants.DONATE_USERNAME} className='aboutLink' target='_blank' rel='noopener noreferrer'>Patreon</a>
|
||||
</p>
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.resources_used.title')}</h3>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.about.resources_used.title')}</h3>
|
||||
<p>
|
||||
<a href='https://www.pexels.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Pexels</a>
|
||||
, <a href='https://unsplash.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Unsplash</a> ({this.getMessage(this.languagecode, 'modals.main.settings.sections.about.resources_used.bg_images')})
|
||||
, <a href='https://unsplash.com' className='aboutLink' target='_blank' rel='noopener noreferrer'>Unsplash</a> ({this.getMessage('modals.main.settings.sections.about.resources_used.bg_images')})
|
||||
</p>
|
||||
<p><a href='https://undraw.co' className='aboutLink' target='_blank' rel='noopener noreferrer'>Undraw</a> ({this.getMessage(this.languagecode, 'modals.main.settings.sections.about.resources_used.welcome_img')})</p>
|
||||
<p><a href='https://undraw.co' className='aboutLink' target='_blank' rel='noopener noreferrer'>Undraw</a> ({this.getMessage('modals.main.settings.sections.about.resources_used.welcome_img')})</p>
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.contributors')}</h3>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.about.contributors')}</h3>
|
||||
<p>{this.state.loading}</p>
|
||||
{this.state.contributors.map(({ login, id }) => (
|
||||
<Tooltip title={login} key={login}>
|
||||
@@ -125,7 +124,7 @@ export default class About extends PureComponent {
|
||||
</Tooltip>
|
||||
))}
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.supporters')}</h3>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.about.supporters')}</h3>
|
||||
<p>{this.state.loading}</p>
|
||||
{this.state.sponsors.map(({ handle, avatar }) => (
|
||||
<Tooltip title={handle} key={handle}>
|
||||
@@ -133,7 +132,7 @@ export default class About extends PureComponent {
|
||||
</Tooltip>
|
||||
))}
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.about.photographers')}</h3>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.about.photographers')}</h3>
|
||||
<p>{this.state.photographers}</p>
|
||||
</>
|
||||
);
|
||||
|
||||
@@ -22,34 +22,33 @@ export default class AdvancedSettings extends PureComponent {
|
||||
}
|
||||
|
||||
render() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.advanced.title')}</h2>
|
||||
<Checkbox name='offlineMode' text={getMessage(languagecode, 'modals.main.settings.sections.advanced.offline_mode')} element='.other' />
|
||||
<Dropdown name='timezone' label={getMessage(languagecode, 'modals.main.settings.sections.advanced.timezone.title')} category='timezone'>
|
||||
<option value='auto'>{getMessage(languagecode, 'modals.main.settings.sections.advanced.timezone.automatic')}</option>
|
||||
<h2>{getMessage('modals.main.settings.sections.advanced.title')}</h2>
|
||||
<Checkbox name='offlineMode' text={getMessage('modals.main.settings.sections.advanced.offline_mode')} element='.other' />
|
||||
<Dropdown name='timezone' label={getMessage('modals.main.settings.sections.advanced.timezone.title')} category='timezone'>
|
||||
<option value='auto'>{getMessage('modals.main.settings.sections.advanced.timezone.automatic')}</option>
|
||||
{time_zones.map((timezone) => (
|
||||
<option value={timezone} key={timezone}>{timezone}</option>
|
||||
))}
|
||||
</Dropdown>
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.advanced.data')}</h3>
|
||||
<button className='reset' onClick={() => this.setState({ resetModal: true })}>{getMessage(languagecode, 'modals.main.settings.buttons.reset')}</button>
|
||||
<button className='export' onClick={() => exportSettings()}>{getMessage(languagecode, 'modals.main.settings.buttons.export')}</button>
|
||||
<button className='import' onClick={() => document.getElementById('file-input').click()}>{getMessage(languagecode, 'modals.main.settings.buttons.import')}</button>
|
||||
<h3>{getMessage('modals.main.settings.sections.advanced.data')}</h3>
|
||||
<button className='reset' onClick={() => this.setState({ resetModal: true })}>{getMessage('modals.main.settings.buttons.reset')}</button>
|
||||
<button className='export' onClick={() => exportSettings()}>{getMessage('modals.main.settings.buttons.export')}</button>
|
||||
<button className='import' onClick={() => document.getElementById('file-input').click()}>{getMessage('modals.main.settings.buttons.import')}</button>
|
||||
<FileUpload id='file-input' accept='application/json' type='settings' loadFunction={(e) => importSettings(e)}/>
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.advanced.customisation')}</h3>
|
||||
<Text title={getMessage(languagecode, 'modals.main.settings.sections.advanced.tab_name')} name='tabName' default={getMessage(languagecode, 'tabname')} category='other'/>
|
||||
<Text title={getMessage(languagecode, 'modals.main.settings.sections.advanced.custom_js')} name='customjs' textarea={true} category='other' element='other'/>
|
||||
<Text title={getMessage(languagecode, 'modals.main.settings.sections.advanced.custom_css')} name='customcss' textarea={true} category='other'/>
|
||||
<h3>{getMessage('modals.main.settings.sections.advanced.customisation')}</h3>
|
||||
<Text title={getMessage('modals.main.settings.sections.advanced.tab_name')} name='tabName' default={getMessage('tabname')} category='other'/>
|
||||
<Text title={getMessage('modals.main.settings.sections.advanced.custom_js')} name='customjs' textarea={true} category='other' element='other'/>
|
||||
<Text title={getMessage('modals.main.settings.sections.advanced.custom_css')} name='customcss' textarea={true} category='other'/>
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.experimental.title')}</h3>
|
||||
<p style={{ maxWidth: '75%' }}>{getMessage(languagecode, 'modals.main.settings.sections.advanced.experimental_warning')}</p>
|
||||
<Switch name='experimental' text={getMessage(languagecode, 'modals.main.settings.enabled')} element='.other'/>
|
||||
<h3>{getMessage('modals.main.settings.sections.experimental.title')}</h3>
|
||||
<p style={{ maxWidth: '75%' }}>{getMessage('modals.main.settings.sections.advanced.experimental_warning')}</p>
|
||||
<Switch name='experimental' text={getMessage('modals.main.settings.enabled')} element='.other'/>
|
||||
|
||||
<Modal closeTimeoutMS={100} onRequestClose={() => this.setState({ resetModal: false })} isOpen={this.state.resetModal} className='Modal resetmodal mainModal' overlayClassName='Overlay resetoverlay' ariaHideApp={false}>
|
||||
<ResetModal modalClose={() => this.setState({ resetModal: false })} />
|
||||
|
||||
@@ -1,4 +1,5 @@
|
||||
import variables from 'modules/variables';
|
||||
|
||||
import Checkbox from '../Checkbox';
|
||||
import Dropdown from '../Dropdown';
|
||||
import Radio from '../Radio';
|
||||
@@ -6,68 +7,67 @@ import Slider from '../Slider';
|
||||
import Text from '../Text';
|
||||
|
||||
export default function AppearanceSettings() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
const themeOptions = [
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.auto'),
|
||||
name: getMessage('modals.main.settings.sections.appearance.theme.auto'),
|
||||
value: 'auto'
|
||||
},
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.light'),
|
||||
name: getMessage('modals.main.settings.sections.appearance.theme.light'),
|
||||
value: 'light'
|
||||
},
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.dark'),
|
||||
name: getMessage('modals.main.settings.sections.appearance.theme.dark'),
|
||||
value: 'dark'
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.appearance.title')}</h2>
|
||||
<Radio name='theme' title={getMessage(languagecode, 'modals.main.settings.sections.appearance.theme.title')} options={themeOptions} category='other' />
|
||||
<h2>{getMessage('modals.main.settings.sections.appearance.title')}</h2>
|
||||
<Radio name='theme' title={getMessage('modals.main.settings.sections.appearance.theme.title')} options={themeOptions} category='other' />
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.title')}</h3>
|
||||
<Checkbox name='notesEnabled' text={getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.notes')} category='navbar' />
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.refresh')} name='refresh' category='navbar'>
|
||||
<option value='false'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.refresh_options.none')}</option>
|
||||
<option value='background'>{getMessage(languagecode, 'modals.main.settings.sections.background.title')}</option>
|
||||
<option value='quote'>{getMessage(languagecode, 'modals.main.settings.sections.quote.title')}</option>
|
||||
<option value='quotebackground'>{getMessage(languagecode, 'modals.main.settings.sections.quote.title')} + {getMessage(languagecode, 'modals.main.settings.sections.background.title')}</option>
|
||||
<h3>{getMessage('modals.main.settings.sections.appearance.navbar.title')}</h3>
|
||||
<Checkbox name='notesEnabled' text={getMessage('modals.main.settings.sections.appearance.navbar.notes')} category='navbar' />
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.appearance.navbar.refresh')} name='refresh' category='navbar'>
|
||||
<option value='false'>{getMessage('modals.main.settings.sections.appearance.navbar.refresh_options.none')}</option>
|
||||
<option value='background'>{getMessage('modals.main.settings.sections.background.title')}</option>
|
||||
<option value='quote'>{getMessage('modals.main.settings.sections.quote.title')}</option>
|
||||
<option value='quotebackground'>{getMessage('modals.main.settings.sections.quote.title')} + {getMessage('modals.main.settings.sections.background.title')}</option>
|
||||
{/* before it was just a checkbox */}
|
||||
<option value='true'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.navbar.refresh_options.page')}</option>
|
||||
<option value='true'>{getMessage('modals.main.settings.sections.appearance.navbar.refresh_options.page')}</option>
|
||||
</Dropdown>
|
||||
<br/>
|
||||
<Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomNavbar' min='10' max='400' default='100' display='%' category='navbar' />
|
||||
<Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomNavbar' min='10' max='400' default='100' display='%' category='navbar' />
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.title')}</h3>
|
||||
<Text title={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.custom')} name='font' upperCaseFirst={true} category='other' />
|
||||
<h3>{getMessage('modals.main.settings.sections.appearance.font.title')}</h3>
|
||||
<Text title={getMessage('modals.main.settings.sections.appearance.font.custom')} name='font' upperCaseFirst={true} category='other' />
|
||||
<br/>
|
||||
<Checkbox name='fontGoogle' text={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.google')} category='other' />
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.title')} name='fontweight' category='other'>
|
||||
<Checkbox name='fontGoogle' text={getMessage('modals.main.settings.sections.appearance.font.google')} category='other' />
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.appearance.font.weight.title')} name='fontweight' category='other'>
|
||||
{/* names are taken from https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight */}
|
||||
<option value='100'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.thin')}</option>
|
||||
<option value='200'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.extra_light')}</option>
|
||||
<option value='300'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.light')}</option>
|
||||
<option value='400'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.normal')}</option>
|
||||
<option value='500'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.medium')}</option>
|
||||
<option value='600'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.semi_bold')}</option>
|
||||
<option value='700'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.bold')}</option>
|
||||
<option value='800'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.weight.extra_bold')}</option>
|
||||
<option value='100'>{getMessage('modals.main.settings.sections.appearance.font.weight.thin')}</option>
|
||||
<option value='200'>{getMessage('modals.main.settings.sections.appearance.font.weight.extra_light')}</option>
|
||||
<option value='300'>{getMessage('modals.main.settings.sections.appearance.font.weight.light')}</option>
|
||||
<option value='400'>{getMessage('modals.main.settings.sections.appearance.font.weight.normal')}</option>
|
||||
<option value='500'>{getMessage('modals.main.settings.sections.appearance.font.weight.medium')}</option>
|
||||
<option value='600'>{getMessage('modals.main.settings.sections.appearance.font.weight.semi_bold')}</option>
|
||||
<option value='700'>{getMessage('modals.main.settings.sections.appearance.font.weight.bold')}</option>
|
||||
<option value='800'>{getMessage('modals.main.settings.sections.appearance.font.weight.extra_bold')}</option>
|
||||
</Dropdown>
|
||||
<br/><br/>
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.title')} name='fontstyle' category='other'>
|
||||
<option value='normal'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.normal')}</option>
|
||||
<option value='italic'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.italic')}</option>
|
||||
<option value='oblique'>{getMessage(languagecode, 'modals.main.settings.sections.appearance.font.style.oblique')}</option>
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.appearance.font.style.title')} name='fontstyle' category='other'>
|
||||
<option value='normal'>{getMessage('modals.main.settings.sections.appearance.font.style.normal')}</option>
|
||||
<option value='italic'>{getMessage('modals.main.settings.sections.appearance.font.style.italic')}</option>
|
||||
<option value='oblique'>{getMessage('modals.main.settings.sections.appearance.font.style.oblique')}</option>
|
||||
</Dropdown>
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.title')}</h3>
|
||||
<Checkbox text={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.text_shadow')} name='textBorder' category='other'/>
|
||||
<Checkbox text={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.animations')} name='animations' category='other'/>
|
||||
<Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.toast_duration')} name='toastDisplayTime' default='2500' step='100' min='500' max='5000' toast={true} display={' ' + getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.miliseconds')} />
|
||||
<h3>{getMessage('modals.main.settings.sections.appearance.accessibility.title')}</h3>
|
||||
<Checkbox text={getMessage('modals.main.settings.sections.appearance.accessibility.text_shadow')} name='textBorder' category='other'/>
|
||||
<Checkbox text={getMessage('modals.main.settings.sections.appearance.accessibility.animations')} name='animations' category='other'/>
|
||||
<Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.toast_duration')} name='toastDisplayTime' default='2500' step='100' min='500' max='5000' toast={true} display={' ' + getMessage('modals.main.settings.sections.appearance.accessibility.miliseconds')} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -75,8 +75,7 @@ export default class Changelog extends PureComponent {
|
||||
}
|
||||
|
||||
render() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
const errorMessage = (msg) => {
|
||||
return (
|
||||
@@ -91,13 +90,13 @@ export default class Changelog extends PureComponent {
|
||||
if (navigator.onLine === false || this.offlineMode) {
|
||||
return errorMessage(<>
|
||||
<WifiOff/>
|
||||
<h1>{getMessage(languagecode, 'modals.main.marketplace.offline.title')}</h1>
|
||||
<p className='description'>{getMessage(languagecode, 'modals.main.marketplace.offline.description')}</p>
|
||||
<h1>{getMessage('modals.main.marketplace.offline.title')}</h1>
|
||||
<p className='description'>{getMessage('modals.main.marketplace.offline.description')}</p>
|
||||
</>);
|
||||
}
|
||||
|
||||
if (!this.state.title) {
|
||||
return errorMessage(<h1>{getMessage(languagecode, 'modals.main.loading')}</h1>);
|
||||
return errorMessage(<h1>{getMessage('modals.main.loading')}</h1>);
|
||||
}
|
||||
|
||||
return (
|
||||
|
||||
@@ -6,15 +6,14 @@ import { toast } from 'react-toastify';
|
||||
|
||||
import EventBus from 'modules/helpers/eventbus';
|
||||
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
const widget_name = {
|
||||
greeting: getMessage(languagecode, 'modals.main.settings.sections.greeting.title'),
|
||||
time: getMessage(languagecode, 'modals.main.settings.sections.time.title'),
|
||||
quicklinks: getMessage(languagecode, 'modals.main.settings.sections.quicklinks.title'),
|
||||
quote: getMessage(languagecode, 'modals.main.settings.sections.quote.title'),
|
||||
date: getMessage(languagecode, 'modals.main.settings.sections.greeting.title'),
|
||||
message: getMessage(languagecode, 'modals.main.settings.sections.message.title')
|
||||
greeting: getMessage('modals.main.settings.sections.greeting.title'),
|
||||
time: getMessage('modals.main.settings.sections.time.title'),
|
||||
quicklinks: getMessage('modals.main.settings.sections.quicklinks.title'),
|
||||
quote: getMessage('modals.main.settings.sections.quote.title'),
|
||||
date: getMessage('modals.main.settings.sections.greeting.title'),
|
||||
message: getMessage('modals.main.settings.sections.message.title')
|
||||
};
|
||||
|
||||
const SortableItem = sortableElement(({ value }) => (
|
||||
@@ -67,7 +66,7 @@ export default class OrderSettings extends PureComponent {
|
||||
items: JSON.parse(localStorage.getItem('order'))
|
||||
});
|
||||
|
||||
toast(getMessage(languagecode, 'toats.reset'));
|
||||
toast(getMessage('toats.reset'));
|
||||
}
|
||||
|
||||
enabled = (setting) => {
|
||||
@@ -88,8 +87,8 @@ export default class OrderSettings extends PureComponent {
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.order.title')}</h2>
|
||||
<span className='modalLink' onClick={this.reset}>{getMessage(languagecode, 'modals.main.settings.buttons.reset')}</span>
|
||||
<h2>{getMessage('modals.main.settings.sections.order.title')}</h2>
|
||||
<span className='modalLink' onClick={this.reset}>{getMessage('modals.main.settings.buttons.reset')}</span>
|
||||
<SortableContainer onSortEnd={this.onSortEnd} lockAxis='y' lockToContainerEdges disableAutoscroll>
|
||||
{this.state.items.map((value, index) => {
|
||||
if (!this.enabled(value)) {
|
||||
|
||||
@@ -5,18 +5,17 @@ import Checkbox from '../Checkbox';
|
||||
import Slider from '../Slider';
|
||||
|
||||
export default function QuickLinks() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.quicklinks.title')}</h2>
|
||||
<Switch name='quicklinksenabled' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='quicklinks' element='.quicklinks-container'/>
|
||||
<Checkbox name='quicklinksText' text={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.text_only')} category='quicklinks'/>
|
||||
<Checkbox name='quicklinksddgProxy' text={getMessage(languagecode, 'modals.main.settings.sections.background.ddg_image_proxy')} category='quicklinks'/>
|
||||
<Checkbox name='quicklinksnewtab' text={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.open_new')} category='quicklinks'/>
|
||||
<Checkbox name='quicklinkstooltip' text={getMessage(languagecode, 'modals.main.settings.sections.quicklinks.tooltip')} category='quicklinks'/>
|
||||
<Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuicklinks' min='10' max='400' default='100' display='%' category='quicklinks'/>
|
||||
<h2>{getMessage('modals.main.settings.sections.quicklinks.title')}</h2>
|
||||
<Switch name='quicklinksenabled' text={getMessage('modals.main.settings.enabled')} category='quicklinks' element='.quicklinks-container'/>
|
||||
<Checkbox name='quicklinksText' text={getMessage('modals.main.settings.sections.quicklinks.text_only')} category='quicklinks'/>
|
||||
<Checkbox name='quicklinksddgProxy' text={getMessage('modals.main.settings.sections.background.ddg_image_proxy')} category='quicklinks'/>
|
||||
<Checkbox name='quicklinksnewtab' text={getMessage('modals.main.settings.sections.quicklinks.open_new')} category='quicklinks'/>
|
||||
<Checkbox name='quicklinkstooltip' text={getMessage('modals.main.settings.sections.quicklinks.tooltip')} category='quicklinks'/>
|
||||
<Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuicklinks' min='10' max='400' default='100' display='%' category='quicklinks'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -8,8 +8,7 @@ import Slider from '../Slider';
|
||||
import Dropdown from '../Dropdown';
|
||||
|
||||
export default class QuoteSettings extends PureComponent {
|
||||
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
languagecode = variables.languagecode;
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -20,7 +19,7 @@ export default class QuoteSettings extends PureComponent {
|
||||
|
||||
marketplaceType = () => {
|
||||
if (localStorage.getItem('quote_packs')) {
|
||||
return <option value='quote_pack'>{this.getMessage(this.languagecode, 'modals.main.navbar.marketplace')}</option>;
|
||||
return <option value='quote_pack'>{this.getMessage('modals.main.navbar.marketplace')}</option>;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -29,8 +28,8 @@ export default class QuoteSettings extends PureComponent {
|
||||
if (this.state.quoteType === 'custom') {
|
||||
customSettings = (
|
||||
<>
|
||||
<Text title={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.custom')} name='customQuote' category='quote' />
|
||||
<Text title={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.custom_author')} name='customQuoteAuthor' category='quote'/>
|
||||
<Text title={this.getMessage('modals.main.settings.sections.quote.custom')} name='customQuote' category='quote' />
|
||||
<Text title={this.getMessage('modals.main.settings.sections.quote.custom_author')} name='customQuoteAuthor' category='quote'/>
|
||||
</>
|
||||
);
|
||||
} else {
|
||||
@@ -38,14 +37,14 @@ export default class QuoteSettings extends PureComponent {
|
||||
customSettings = (
|
||||
<>
|
||||
<br/><br/>
|
||||
<Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.title')} name='quotechange'>
|
||||
<option value='refresh'>{this.getMessage(this.languagecode, 'tabname')}</option>
|
||||
<option value='60000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.minute')}</option>
|
||||
<option value='1800000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.half_hour')}</option>
|
||||
<option value='3600000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.hour')}</option>
|
||||
<option value='86400000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.day')}</option>
|
||||
<option value='604800000'>{this.getMessage(this.languagecode, 'widgets.date.week')}</option>
|
||||
<option value='2628000000'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.interval.month')}</option>
|
||||
<Dropdown label={this.getMessage('modals.main.settings.sections.background.interval.title')} name='quotechange'>
|
||||
<option value='refresh'>{this.getMessage('tabname')}</option>
|
||||
<option value='60000'>{this.getMessage('modals.main.settings.sections.background.interval.minute')}</option>
|
||||
<option value='1800000'>{this.getMessage('modals.main.settings.sections.background.interval.half_hour')}</option>
|
||||
<option value='3600000'>{this.getMessage('modals.main.settings.sections.background.interval.hour')}</option>
|
||||
<option value='86400000'>{this.getMessage('modals.main.settings.sections.background.interval.day')}</option>
|
||||
<option value='604800000'>{this.getMessage('widgets.date.week')}</option>
|
||||
<option value='2628000000'>{this.getMessage('modals.main.settings.sections.background.interval.month')}</option>
|
||||
</Dropdown>
|
||||
</>
|
||||
);
|
||||
@@ -53,21 +52,21 @@ export default class QuoteSettings extends PureComponent {
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.title')}</h2>
|
||||
<Switch name='quote' text={this.getMessage(this.languagecode, 'modals.main.settings.enabled')} category='quote' element='.quotediv' />
|
||||
<Checkbox name='authorLink' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.author_link')} element='.other' />
|
||||
<Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.type.title')} name='quoteType' onChange={(value) => this.setState({ quoteType: value })} category='quote'>
|
||||
<h2>{this.getMessage('modals.main.settings.sections.quote.title')}</h2>
|
||||
<Switch name='quote' text={this.getMessage('modals.main.settings.enabled')} category='quote' element='.quotediv' />
|
||||
<Checkbox name='authorLink' text={this.getMessage('modals.main.settings.sections.quote.author_link')} element='.other' />
|
||||
<Dropdown label={this.getMessage('modals.main.settings.sections.background.type.title')} name='quoteType' onChange={(value) => this.setState({ quoteType: value })} category='quote'>
|
||||
{this.marketplaceType()}
|
||||
<option value='api'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.type.api')}</option>
|
||||
<option value='custom'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.custom')}</option>
|
||||
<option value='api'>{this.getMessage('modals.main.settings.sections.background.type.api')}</option>
|
||||
<option value='custom'>{this.getMessage('modals.main.settings.sections.quote.custom')}</option>
|
||||
</Dropdown>
|
||||
{customSettings}
|
||||
<Slider title={this.getMessage(this.languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuote' min='10' max='400' default='100' display='%' category='quote' />
|
||||
<Slider title={this.getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomQuote' min='10' max='400' default='100' display='%' category='quote' />
|
||||
|
||||
<h3>{this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.title')}</h3>
|
||||
<Checkbox name='copyButton' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.copy')} category='quote'/>
|
||||
<Checkbox name='tweetButton' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.tweet')} category='quote'/>
|
||||
<Checkbox name='favouriteQuoteEnabled' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.quote.buttons.favourite')} category='quote'/>
|
||||
<h3>{this.getMessage('modals.main.settings.sections.quote.buttons.title')}</h3>
|
||||
<Checkbox name='copyButton' text={this.getMessage('modals.main.settings.sections.quote.buttons.copy')} category='quote'/>
|
||||
<Checkbox name='tweetButton' text={this.getMessage('modals.main.settings.sections.quote.buttons.tweet')} category='quote'/>
|
||||
<Checkbox name='favouriteQuoteEnabled' text={this.getMessage('modals.main.settings.sections.quote.buttons.favourite')} category='quote'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -13,8 +13,7 @@ const searchEngines = require('components/widgets/search/search_engines.json');
|
||||
const autocompleteProviders = require('components/widgets/search/autocomplete_providers.json');
|
||||
|
||||
export default class SearchSettings extends PureComponent {
|
||||
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
languagecode = variables.languagecode;
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -31,7 +30,7 @@ export default class SearchSettings extends PureComponent {
|
||||
customValue: ''
|
||||
});
|
||||
|
||||
toast(this.getMessage(this.languagecode, 'toasts.reset'));
|
||||
toast(this.getMessage('toasts.reset'));
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
@@ -73,27 +72,27 @@ export default class SearchSettings extends PureComponent {
|
||||
render() {
|
||||
return (
|
||||
<>
|
||||
<h2>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.title')}</h2>
|
||||
<Switch name='searchBar' text={this.getMessage(this.languagecode, 'modals.main.settings.enabled')} category='widgets' />
|
||||
<h2>{this.getMessage('modals.main.settings.sections.search.title')}</h2>
|
||||
<Switch name='searchBar' text={this.getMessage('modals.main.settings.enabled')} category='widgets' />
|
||||
{/* not supported on firefox */}
|
||||
{(navigator.userAgent.includes('Chrome') && typeof InstallTrigger === 'undefined') ?
|
||||
<Checkbox name='voiceSearch' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.voice_search')} category='search'/>
|
||||
<Checkbox name='voiceSearch' text={this.getMessage('modals.main.settings.sections.search.voice_search')} category='search'/>
|
||||
: null}
|
||||
<Checkbox name='searchDropdown' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.dropdown')} category='search' element='.other'/>
|
||||
<Dropdown label={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.search_engine')} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
|
||||
<Checkbox name='searchDropdown' text={this.getMessage('modals.main.settings.sections.search.dropdown')} category='search' element='.other'/>
|
||||
<Dropdown label={this.getMessage('modals.main.settings.sections.search.search_engine')} name='searchEngine' onChange={(value) => this.setSearchEngine(value)}>
|
||||
{searchEngines.map((engine) => (
|
||||
<option key={engine.name} value={engine.settingsName}>{engine.name}</option>
|
||||
))}
|
||||
<option value='custom'>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.custom').split(' ')[0]}</option>
|
||||
<option value='custom'>{this.getMessage('modals.main.settings.sections.search.custom').split(' ')[0]}</option>
|
||||
</Dropdown>
|
||||
<ul style={{ display: this.state.customDisplay }}>
|
||||
<br/>
|
||||
<p style={{ marginTop: '0px' }}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.search.custom')} <span className='modalLink' onClick={() => this.resetSearch()}>{this.getMessage(this.languagecode, 'modals.main.settings.buttons.reset')}</span></p>
|
||||
<p style={{ marginTop: '0px' }}>{this.getMessage('modals.main.settings.sections.search.custom')} <span className='modalLink' onClick={() => this.resetSearch()}>{this.getMessage('modals.main.settings.buttons.reset')}</span></p>
|
||||
<input type='text' value={this.state.customValue} onInput={(e) => this.setState({ customValue: e.target.value })}></input>
|
||||
</ul>
|
||||
<br/>
|
||||
<Checkbox name='autocomplete' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.autocomplete')} category='search' />
|
||||
<Radio title={this.getMessage(this.languagecode, 'modals.main.settings.sections.search.autocomplete_provider')} options={autocompleteProviders} name='autocompleteProvider' category='search'/>
|
||||
<Checkbox name='autocomplete' text={this.getMessage('modals.main.settings.sections.search.autocomplete')} category='search' />
|
||||
<Radio title={this.getMessage('modals.main.settings.sections.search.autocomplete_provider')} options={autocompleteProviders} name='autocompleteProvider' category='search'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -32,30 +32,29 @@ export default class Stats extends PureComponent {
|
||||
}
|
||||
|
||||
render() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
if (localStorage.getItem('stats') === 'false') {
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.reminder.title')}</h2>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.warning')}</p>
|
||||
<Switch name='stats' text={getMessage(languagecode, 'modals.main.settings.sections.stats.usage')} category='stats'/>
|
||||
<h2>{getMessage('modals.main.settings.reminder.title')}</h2>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.warning')}</p>
|
||||
<Switch name='stats' text={getMessage('modals.main.settings.sections.stats.usage')} category='stats'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.stats.title')}</h2>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.tabs_opened')}: {this.state.stats['tabs-opened'] || 0}</p>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.backgrounds_favourited')}: {this.state.stats.feature ? this.state.stats.feature['background-favourite'] || 0 : 0}</p>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.backgrounds_downloaded')}: {this.state.stats.feature ? this.state.stats.feature['background-download'] || 0 : 0}</p>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.quotes_favourited')}: {this.state.stats.feature ? this.state.stats.feature['quoted-favourite'] || 0 : 0}</p>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.quicklinks_added')}: {this.state.stats.feature ? this.state.stats.feature['quicklink-add'] || 0 : 0}</p>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.settings_changed')}: {this.state.stats.setting ? Object.keys(this.state.stats.setting).length : 0}</p>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.stats.sections.addons_installed')}: {this.state.stats.marketplace ? this.state.stats.marketplace['install'] : 0}</p>
|
||||
<Switch name='stats' text={getMessage(languagecode, 'modals.main.settings.sections.stats.usage')} category='stats'/>
|
||||
<h2>{getMessage('modals.main.settings.sections.stats.title')}</h2>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}: {this.state.stats['tabs-opened'] || 0}</p>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.backgrounds_favourited')}: {this.state.stats.feature ? this.state.stats.feature['background-favourite'] || 0 : 0}</p>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.backgrounds_downloaded')}: {this.state.stats.feature ? this.state.stats.feature['background-download'] || 0 : 0}</p>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.quotes_favourited')}: {this.state.stats.feature ? this.state.stats.feature['quoted-favourite'] || 0 : 0}</p>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.quicklinks_added')}: {this.state.stats.feature ? this.state.stats.feature['quicklink-add'] || 0 : 0}</p>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.settings_changed')}: {this.state.stats.setting ? Object.keys(this.state.stats.setting).length : 0}</p>
|
||||
<p>{getMessage('modals.main.settings.sections.stats.sections.addons_installed')}: {this.state.stats.marketplace ? this.state.stats.marketplace['install'] : 0}</p>
|
||||
<Switch name='stats' text={getMessage('modals.main.settings.sections.stats.usage')} category='stats'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -17,40 +17,39 @@ export default class TimeSettings extends PureComponent {
|
||||
}
|
||||
|
||||
render() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
let timeSettings;
|
||||
|
||||
const digitalOptions = [
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.time.digital.twentyfourhour'),
|
||||
name: getMessage('modals.main.settings.sections.time.digital.twentyfourhour'),
|
||||
value: 'twentyfourhour'
|
||||
},
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.time.digital.twelvehour'),
|
||||
name: getMessage('modals.main.settings.sections.time.digital.twelvehour'),
|
||||
value: 'twelvehour'
|
||||
}
|
||||
];
|
||||
|
||||
const digitalSettings = (
|
||||
<>
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.time.digital.title')}</h3>
|
||||
<Radio title={getMessage(languagecode, 'modals.main.settings.sections.time.format')} name='timeformat' options={digitalOptions} smallTitle={true} category='clock' />
|
||||
<h3>{getMessage('modals.main.settings.sections.time.digital.title')}</h3>
|
||||
<Radio title={getMessage('modals.main.settings.sections.time.format')} name='timeformat' options={digitalOptions} smallTitle={true} category='clock' />
|
||||
<br/>
|
||||
<Checkbox name='seconds' text={getMessage(languagecode, 'modals.main.settings.sections.time.digital.seconds')} category='clock' />
|
||||
<Checkbox name='zero' text={getMessage(languagecode, 'modals.main.settings.sections.time.digital.zero')} category='clock' />
|
||||
<Checkbox name='seconds' text={getMessage('modals.main.settings.sections.time.digital.seconds')} category='clock' />
|
||||
<Checkbox name='zero' text={getMessage('modals.main.settings.sections.time.digital.zero')} category='clock' />
|
||||
</>
|
||||
);
|
||||
|
||||
const analogSettings = (
|
||||
<>
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.time.analogue.title')}</h3>
|
||||
<Checkbox name='secondHand' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.second_hand')} category='clock' />
|
||||
<Checkbox name='minuteHand' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.minute_hand')} category='clock' />
|
||||
<Checkbox name='hourHand' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.hour_hand')} category='clock' />
|
||||
<Checkbox name='hourMarks' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.hour_marks')} category='clock' />
|
||||
<Checkbox name='minuteMarks' text={getMessage(languagecode, 'modals.main.settings.sections.time.analogue.minute_marks')} category='clock' />
|
||||
<h3>{getMessage('modals.main.settings.sections.time.analogue.title')}</h3>
|
||||
<Checkbox name='secondHand' text={getMessage('modals.main.settings.sections.time.analogue.second_hand')} category='clock' />
|
||||
<Checkbox name='minuteHand' text={getMessage('modals.main.settings.sections.time.analogue.minute_hand')} category='clock' />
|
||||
<Checkbox name='hourHand' text={getMessage('modals.main.settings.sections.time.analogue.hour_hand')} category='clock' />
|
||||
<Checkbox name='hourMarks' text={getMessage('modals.main.settings.sections.time.analogue.hour_marks')} category='clock' />
|
||||
<Checkbox name='minuteMarks' text={getMessage('modals.main.settings.sections.time.analogue.minute_marks')} category='clock' />
|
||||
</>
|
||||
);
|
||||
|
||||
@@ -64,25 +63,25 @@ export default class TimeSettings extends PureComponent {
|
||||
|
||||
const longSettings = (
|
||||
<>
|
||||
<Checkbox name='dayofweek' text={getMessage(languagecode, 'modals.main.settings.sections.time.date.day_of_week')} category='date' />
|
||||
<Checkbox name='datenth' text={getMessage(languagecode, 'modals.main.settings.sections.time.date.datenth')} category='date' />
|
||||
<Checkbox name='dayofweek' text={getMessage('modals.main.settings.sections.time.date.day_of_week')} category='date' />
|
||||
<Checkbox name='datenth' text={getMessage('modals.main.settings.sections.time.date.datenth')} category='date' />
|
||||
</>
|
||||
);
|
||||
|
||||
const shortSettings = (
|
||||
<>
|
||||
<br/>
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.date.short_format')} name='dateFormat' category='date'>
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.time.date.short_format')} name='dateFormat' category='date'>
|
||||
<option value='DMY'>DMY</option>
|
||||
<option value='MDY'>MDY</option>
|
||||
<option value='YMD'>YMD</option>
|
||||
</Dropdown>
|
||||
<br/><br/>
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.title')} name='shortFormat' category='date'>
|
||||
<option value='dash'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.dash')}</option>
|
||||
<option value='dots'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.dots')}</option>
|
||||
<option value='gaps'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.gaps')}</option>
|
||||
<option value='slashes'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.short_separator.slashes')}</option>
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.time.date.short_separator.title')} name='shortFormat' category='date'>
|
||||
<option value='dash'>{getMessage('modals.main.settings.sections.time.date.short_separator.dash')}</option>
|
||||
<option value='dots'>{getMessage('modals.main.settings.sections.time.date.short_separator.dots')}</option>
|
||||
<option value='gaps'>{getMessage('modals.main.settings.sections.time.date.short_separator.gaps')}</option>
|
||||
<option value='slashes'>{getMessage('modals.main.settings.sections.time.date.short_separator.slashes')}</option>
|
||||
</Dropdown>
|
||||
</>
|
||||
);
|
||||
@@ -95,29 +94,29 @@ export default class TimeSettings extends PureComponent {
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.time.title')}</h2>
|
||||
<Switch name='time' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='clock' element='.clock-container' />
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.type')} name='timeType' onChange={(value) => this.setState({ timeType: value })} category='clock'>
|
||||
<option value='digital'>{getMessage(languagecode, 'modals.main.settings.sections.time.digital.title')}</option>
|
||||
<option value='analogue'>{getMessage(languagecode, 'modals.main.settings.sections.time.analogue.title')}</option>
|
||||
<option value='percentageComplete'>{getMessage(languagecode, 'modals.main.settings.sections.time.percentage_complete')}</option>
|
||||
<h2>{getMessage('modals.main.settings.sections.time.title')}</h2>
|
||||
<Switch name='time' text={getMessage('modals.main.settings.enabled')} category='clock' element='.clock-container' />
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.time.type')} name='timeType' onChange={(value) => this.setState({ timeType: value })} category='clock'>
|
||||
<option value='digital'>{getMessage('modals.main.settings.sections.time.digital.title')}</option>
|
||||
<option value='analogue'>{getMessage('modals.main.settings.sections.time.analogue.title')}</option>
|
||||
<option value='percentageComplete'>{getMessage('modals.main.settings.sections.time.percentage_complete')}</option>
|
||||
</Dropdown>
|
||||
{timeSettings}
|
||||
{this.state.timeType !== 'analogue' ?
|
||||
<Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomClock' min='10' max='400' default='100' display='%' category='clock'/>
|
||||
<Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomClock' min='10' max='400' default='100' display='%' category='clock'/>
|
||||
: null}
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.time.date.title')}</h3>
|
||||
<Switch name='date' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='date' element='.date'/>
|
||||
<Dropdown label={getMessage(languagecode, 'modals.main.settings.sections.time.type')} name='dateType' onChange={(value) => this.setState({ dateType: value })} category='date'>
|
||||
<option value='long'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.type.long')}</option>
|
||||
<option value='short'>{getMessage(languagecode, 'modals.main.settings.sections.time.date.type.short')}</option>
|
||||
<h3>{getMessage('modals.main.settings.sections.time.date.title')}</h3>
|
||||
<Switch name='date' text={getMessage('modals.main.settings.enabled')} category='date' element='.date'/>
|
||||
<Dropdown label={getMessage('modals.main.settings.sections.time.type')} name='dateType' onChange={(value) => this.setState({ dateType: value })} category='date'>
|
||||
<option value='long'>{getMessage('modals.main.settings.sections.time.date.type.long')}</option>
|
||||
<option value='short'>{getMessage('modals.main.settings.sections.time.date.type.short')}</option>
|
||||
</Dropdown>
|
||||
<br/>
|
||||
<Checkbox name='datezero' text={getMessage(languagecode, 'modals.main.settings.sections.time.digital.zero')} category='date'/>
|
||||
<Checkbox name='weeknumber' text={getMessage(languagecode, 'modals.main.settings.sections.time.date.week_number')} category='date'/>
|
||||
<Checkbox name='datezero' text={getMessage('modals.main.settings.sections.time.digital.zero')} category='date'/>
|
||||
<Checkbox name='weeknumber' text={getMessage('modals.main.settings.sections.time.date.week_number')} category='date'/>
|
||||
{dateSettings}
|
||||
<Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomDate' min='10' max='400' default='100' display='%' category='date'/>
|
||||
<Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomDate' min='10' max='400' default='100' display='%' category='date'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -48,47 +48,46 @@ export default class TimeSettings extends PureComponent {
|
||||
}
|
||||
|
||||
render() {
|
||||
const getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
const languagecode = variables.languagecode;
|
||||
const getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
const tempFormat = [
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.celsius') + ' (°C)',
|
||||
name: getMessage('modals.main.settings.sections.weather.temp_format.celsius') + ' (°C)',
|
||||
value: 'celsius'
|
||||
},
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.fahrenheit') + ' (°F)',
|
||||
name: getMessage('modals.main.settings.sections.weather.temp_format.fahrenheit') + ' (°F)',
|
||||
value: 'fahrenheit'
|
||||
},
|
||||
{
|
||||
name: getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.kelvin') + ' (K)',
|
||||
name: getMessage('modals.main.settings.sections.weather.temp_format.kelvin') + ' (K)',
|
||||
value: 'kelvin'
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<>
|
||||
<h2>{getMessage(languagecode, 'modals.main.settings.sections.weather.title')}</h2>
|
||||
<Switch name='weatherEnabled' text={getMessage(languagecode, 'modals.main.settings.enabled')} category='widgets'/>
|
||||
<h2>{getMessage('modals.main.settings.sections.weather.title')}</h2>
|
||||
<Switch name='weatherEnabled' text={getMessage('modals.main.settings.enabled')} category='widgets'/>
|
||||
<ul>
|
||||
<p>{getMessage(languagecode, 'modals.main.settings.sections.weather.location')} <span className='modalLink' onClick={() => this.getAuto()}>{getMessage(languagecode, 'modals.main.settings.sections.weather.auto')}</span></p>
|
||||
<p>{getMessage('modals.main.settings.sections.weather.location')} <span className='modalLink' onClick={() => this.getAuto()}>{getMessage('modals.main.settings.sections.weather.auto')}</span></p>
|
||||
<input type='text' value={this.state.location} onChange={(e) => this.changeLocation(e)}></input>
|
||||
</ul>
|
||||
<br/>
|
||||
<Radio name='tempformat' title={getMessage(languagecode, 'modals.main.settings.sections.weather.temp_format.title')} options={tempFormat} category='weather'/>
|
||||
<Slider title={getMessage(languagecode, 'modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomWeather' min='10' max='400' default='100' display='%' category='weather'/>
|
||||
<Radio name='tempformat' title={getMessage('modals.main.settings.sections.weather.temp_format.title')} options={tempFormat} category='weather'/>
|
||||
<Slider title={getMessage('modals.main.settings.sections.appearance.accessibility.widget_zoom')} name='zoomWeather' min='10' max='400' default='100' display='%' category='weather'/>
|
||||
|
||||
<h3>{getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.title')}</h3>
|
||||
<Checkbox name='showlocation' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.show_location')} category='weather'/>
|
||||
<Checkbox name='weatherdescription' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.show_description')} category='weather'/>
|
||||
<Checkbox name='cloudiness' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.cloudiness')} category='weather'/>
|
||||
<Checkbox name='humidity' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.humidity')} category='weather'/>
|
||||
<Checkbox name='visibility' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.visibility')} category='weather'/>
|
||||
<Checkbox name='windspeed' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.wind_speed')} category='weather'/>
|
||||
<Checkbox name='windDirection' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.wind_direction')} category='weather'/>
|
||||
<Checkbox name='mintemp' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.min_temp')} category='weather'/>
|
||||
<Checkbox name='maxtemp' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.max_temp')} category='weather'/>
|
||||
<Checkbox name='atmosphericpressure' text={getMessage(languagecode, 'modals.main.settings.sections.weather.extra_info.atmospheric_pressure')} category='weather'/>
|
||||
<h3>{getMessage('modals.main.settings.sections.weather.extra_info.title')}</h3>
|
||||
<Checkbox name='showlocation' text={getMessage('modals.main.settings.sections.weather.extra_info.show_location')} category='weather'/>
|
||||
<Checkbox name='weatherdescription' text={getMessage('modals.main.settings.sections.weather.extra_info.show_description')} category='weather'/>
|
||||
<Checkbox name='cloudiness' text={getMessage('modals.main.settings.sections.weather.extra_info.cloudiness')} category='weather'/>
|
||||
<Checkbox name='humidity' text={getMessage('modals.main.settings.sections.weather.extra_info.humidity')} category='weather'/>
|
||||
<Checkbox name='visibility' text={getMessage('modals.main.settings.sections.weather.extra_info.visibility')} category='weather'/>
|
||||
<Checkbox name='windspeed' text={getMessage('modals.main.settings.sections.weather.extra_info.wind_speed')} category='weather'/>
|
||||
<Checkbox name='windDirection' text={getMessage('modals.main.settings.sections.weather.extra_info.wind_direction')} category='weather'/>
|
||||
<Checkbox name='mintemp' text={getMessage('modals.main.settings.sections.weather.extra_info.min_temp')} category='weather'/>
|
||||
<Checkbox name='maxtemp' text={getMessage('modals.main.settings.sections.weather.extra_info.max_temp')} category='weather'/>
|
||||
<Checkbox name='atmosphericpressure' text={getMessage('modals.main.settings.sections.weather.extra_info.atmospheric_pressure')} category='weather'/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -15,15 +15,14 @@ import ColourSettings from './Colour';
|
||||
import EventBus from 'modules/helpers/eventbus';
|
||||
|
||||
export default class BackgroundSettings extends PureComponent {
|
||||
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
languagecode = variables.languagecode;
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
this.state = {
|
||||
customBackground: this.getCustom(),
|
||||
backgroundType: localStorage.getItem('backgroundType') || 'api',
|
||||
backgroundCategories: [this.getMessage(this.languagecode, 'modals.main.loading')]
|
||||
backgroundCategories: [this.getMessage('modals.main.loading')]
|
||||
};
|
||||
this.controller = new AbortController();
|
||||
}
|
||||
@@ -33,7 +32,7 @@ export default class BackgroundSettings extends PureComponent {
|
||||
this.setState({
|
||||
customBackground: ['']
|
||||
});
|
||||
toast(this.getMessage(this.languagecode, 'toasts.reset'));
|
||||
toast(this.getMessage('toasts.reset'));
|
||||
EventBus.dispatch('refresh', 'background');
|
||||
}
|
||||
|
||||
@@ -73,8 +72,8 @@ export default class BackgroundSettings extends PureComponent {
|
||||
if (customBackground.startsWith('data:video/') || customBackground.endsWith('.mp4') || customBackground.endsWith('.webm') || customBackground.endsWith('.ogg')) {
|
||||
return (
|
||||
<>
|
||||
<Checkbox name='backgroundVideoLoop' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.loop_video')}/>
|
||||
<Checkbox name='backgroundVideoMute' text={this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.mute_video')}/>
|
||||
<Checkbox name='backgroundVideoLoop' text={this.getMessage('modals.main.settings.sections.background.source.loop_video')}/>
|
||||
<Checkbox name='backgroundVideoMute' text={this.getMessage('modals.main.settings.sections.background.source.mute_video')}/>
|
||||
</>
|
||||
);
|
||||
} else {
|
||||
@@ -84,7 +83,7 @@ export default class BackgroundSettings extends PureComponent {
|
||||
|
||||
marketplaceType = () => {
|
||||
if (localStorage.getItem('photo_packs')) {
|
||||
return <option value='photo_pack'>{this.getMessage(this.languagecode, 'modals.main.navbar.marketplace')}</option>;
|
||||
return <option value='photo_pack'>{this.getMessage('modals.main.navbar.marketplace')}</option>;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -123,7 +122,7 @@ export default class BackgroundSettings extends PureComponent {
|
||||
componentDidMount() {
|
||||
if (navigator.onLine === false || localStorage.getItem('offlineMode') === 'true') {
|
||||
return this.setState({
|
||||
backgroundCategories: [this.getMessage(this.languagecode, 'modals.update.offline.title')]
|
||||
backgroundCategories: [this.getMessage('modals.update.offline.title')]
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
@@ -13,8 +13,7 @@ export default class ColourSettings extends PureComponent {
|
||||
DefaultGradientSettings = { angle: '180', gradient: [{ colour: '#ffb032', stop: 0 }], type: 'linear' };
|
||||
GradientPickerInitalState = undefined;
|
||||
|
||||
getMessage = (languagecode, text) => variables.language.getMessage(languagecode, text);
|
||||
languagecode = variables.languagecode;
|
||||
getMessage = (text) => variables.language.getMessage(variables.languagecode, text);
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
@@ -28,7 +27,7 @@ export default class ColourSettings extends PureComponent {
|
||||
this.setState({
|
||||
gradientSettings: this.DefaultGradientSettings
|
||||
});
|
||||
toast(this.getMessage(this.languagecode, 'toasts.reset'));
|
||||
toast(this.getMessage('toasts.reset'));
|
||||
}
|
||||
|
||||
initialiseColourPickerState(gradientSettings) {
|
||||
@@ -105,14 +104,14 @@ export default class ColourSettings extends PureComponent {
|
||||
}
|
||||
|
||||
currentGradientSettings = () => {
|
||||
if (typeof this.state.gradientSettings === 'object' && this.state.gradientSettings.gradient.every(g => g.colour !== this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.disabled'))) {
|
||||
if (typeof this.state.gradientSettings === 'object' && this.state.gradientSettings.gradient.every(g => g.colour !== this.getMessage('modals.main.settings.sections.background.source.disabled'))) {
|
||||
const clampNumber = (num, a, b) => Math.max(Math.min(num, Math.max(a, b)), Math.min(a, b));
|
||||
return JSON.stringify({
|
||||
...this.state.gradientSettings,
|
||||
gradient: [...this.state.gradientSettings.gradient.map(g => { return { ...g, stop: clampNumber(+g.stop, 0, 100) } })].sort((a, b) => (a.stop > b.stop) ? 1 : -1)
|
||||
});
|
||||
}
|
||||
return this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.disabled');
|
||||
return this.getMessage('modals.main.settings.sections.background.source.disabled');
|
||||
}
|
||||
|
||||
onColourPickerChange = (attrs, name) => {
|
||||
@@ -176,14 +175,14 @@ export default class ColourSettings extends PureComponent {
|
||||
colourSettings = (
|
||||
<>
|
||||
{gradientInputs}
|
||||
{!gradientHasMoreThanOneColour ? (<><br/><br/><button type='button' className='add' onClick={this.addColour}>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.add_colour')}</button></>) : null}
|
||||
{!gradientHasMoreThanOneColour ? (<><br/><br/><button type='button' className='add' onClick={this.addColour}>{this.getMessage('modals.main.settings.sections.background.source.add_colour')}</button></>) : null}
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<p>{this.getMessage(this.languagecode, 'modals.main.settings.sections.background.source.custom_colour')} <span className='modalLink' onClick={() => this.resetColour()}>{this.getMessage(this.languagecode, 'modals.main.settings.buttons.reset')}</span></p>
|
||||
<p>{this.getMessage('modals.main.settings.sections.background.source.custom_colour')} <span className='modalLink' onClick={() => this.resetColour()}>{this.getMessage('modals.main.settings.buttons.reset')}</span></p>
|
||||
{colourSettings}
|
||||
</>
|
||||
);
|
||||
|
||||
Reference in New Issue
Block a user