mirror of https://github.com/mue/mue.git
style(settings): use variables for localization
This commit is contained in:
parent
df0e7bfec5
commit
4f0a8207b1
|
@ -24,10 +24,12 @@ export default class GreetingSettings extends PureComponent {
|
|||
};
|
||||
|
||||
render() {
|
||||
const GREETING_SECTION = 'modals.main.settings.sections.greeting';
|
||||
|
||||
return (
|
||||
<>
|
||||
<Header
|
||||
title={variables.getMessage('modals.main.settings.sections.greeting.title')}
|
||||
title={variables.getMessage(`${GREETING_SECTION}.title`)}
|
||||
setting="greeting"
|
||||
category="greeting"
|
||||
element=".greeting"
|
||||
|
@ -36,26 +38,26 @@ export default class GreetingSettings extends PureComponent {
|
|||
/>
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.additional_settings')}
|
||||
subtitle={variables.getMessage('modals.main.settings.sections.greeting.additional')}
|
||||
subtitle={variables.getMessage(`${GREETING_SECTION}.additional`)}
|
||||
>
|
||||
<Checkbox
|
||||
name="events"
|
||||
text={variables.getMessage('modals.main.settings.sections.greeting.events')}
|
||||
text={variables.getMessage(`${GREETING_SECTION}.events`)}
|
||||
category="greeting"
|
||||
/>
|
||||
<Checkbox
|
||||
name="defaultGreetingMessage"
|
||||
text={variables.getMessage('modals.main.settings.sections.greeting.default')}
|
||||
text={variables.getMessage(`${GREETING_SECTION}.default`)}
|
||||
category="greeting"
|
||||
/>
|
||||
<Text
|
||||
title={variables.getMessage('modals.main.settings.sections.greeting.name')}
|
||||
title={variables.getMessage(`${GREETING_SECTION}.name`)}
|
||||
name="greetingName"
|
||||
category="greeting"
|
||||
/>
|
||||
</SettingsItem>
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.sections.greeting.birthday')}
|
||||
title={variables.getMessage(`${GREETING_SECTION}.birthday`)}
|
||||
subtitle={variables.getMessage(
|
||||
'modals.main.settings.sections.greeting.birthday_subtitle',
|
||||
)}
|
||||
|
@ -68,11 +70,11 @@ export default class GreetingSettings extends PureComponent {
|
|||
/>
|
||||
<Checkbox
|
||||
name="birthdayage"
|
||||
text={variables.getMessage('modals.main.settings.sections.greeting.birthday_age')}
|
||||
text={variables.getMessage(`${GREETING_SECTION}.birthday_age`)}
|
||||
category="greeting"
|
||||
/>
|
||||
<p style={{ marginRight: 'auto' }}>
|
||||
{variables.getMessage('modals.main.settings.sections.greeting.birthday_date')}
|
||||
{variables.getMessage(`${GREETING_SECTION}.birthday_date`)}
|
||||
</p>
|
||||
<input
|
||||
type="date"
|
||||
|
|
|
@ -58,22 +58,21 @@ export default class Message extends PureComponent {
|
|||
}
|
||||
|
||||
render() {
|
||||
const MESSAGE_SECTION = 'modals.main.settings.sections.message';
|
||||
|
||||
return (
|
||||
<>
|
||||
<Header
|
||||
title={variables.getMessage('modals.main.settings.sections.message.title')}
|
||||
title={variables.getMessage(`${MESSAGE_SECTION}.title`)}
|
||||
setting="message"
|
||||
category="message"
|
||||
element=".message"
|
||||
zoomSetting="zoomMessage"
|
||||
switch={true}
|
||||
/>
|
||||
<SettingsItem
|
||||
title={variables.getMessage('modals.main.settings.sections.message.messages')}
|
||||
final={true}
|
||||
>
|
||||
<SettingsItem title={variables.getMessage(`${MESSAGE_SECTION}.messages`)} final={true}>
|
||||
<button onClick={() => this.modifyMessage('add')}>
|
||||
{variables.getMessage('modals.main.settings.sections.message.add')} <MdAdd />
|
||||
{variables.getMessage(`${MESSAGE_SECTION}.add`)} <MdAdd />
|
||||
</button>
|
||||
</SettingsItem>
|
||||
<div className="messagesContainer">
|
||||
|
@ -85,7 +84,7 @@ export default class Message extends PureComponent {
|
|||
</div>
|
||||
<div className="messageText">
|
||||
<span className="subtitle">
|
||||
{variables.getMessage('modals.main.settings.sections.message.title')}
|
||||
{variables.getMessage(`${MESSAGE_SECTION}.title`)}
|
||||
</span>
|
||||
<TextareaAutosize
|
||||
value={this.state.messages[index]}
|
||||
|
@ -117,13 +116,13 @@ export default class Message extends PureComponent {
|
|||
<div className="emptyNewMessage">
|
||||
<MdOutlineTextsms />
|
||||
<span className="title">
|
||||
{variables.getMessage('modals.main.settings.sections.message.no_messages')}
|
||||
{variables.getMessage(`${MESSAGE_SECTION}.no_messages`)}
|
||||
</span>
|
||||
<span className="subtitle">
|
||||
{variables.getMessage('modals.main.settings.sections.message.add_some')}
|
||||
{variables.getMessage(`${MESSAGE_SECTION}.add_some`)}
|
||||
</span>
|
||||
<button onClick={() => this.modifyMessage('add')}>
|
||||
{variables.getMessage('modals.main.settings.sections.message.add')}
|
||||
{variables.getMessage(`${MESSAGE_SECTION}.add`)}
|
||||
<MdAdd />
|
||||
</button>
|
||||
</div>
|
||||
|
|
|
@ -107,12 +107,12 @@ export default class Stats extends PureComponent {
|
|||
</div>
|
||||
);
|
||||
|
||||
const STATS_SECTION = 'modals.main.settings.sections.stats';
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="statsTopBar">
|
||||
<span className="mainTitle">
|
||||
{variables.getMessage('modals.main.settings.sections.stats.title')}
|
||||
</span>
|
||||
<span className="mainTitle">{variables.getMessage(`${STATS_SECTION}.title`)}</span>
|
||||
<div className="headerActions">
|
||||
<button onClick={() => this.downloadStats()}>
|
||||
<MdDownload /> {variables.getMessage('widgets.background.download')}
|
||||
|
@ -130,7 +130,7 @@ export default class Stats extends PureComponent {
|
|||
<div className="statGrid">
|
||||
<div>
|
||||
<span className="subtitle">
|
||||
{variables.getMessage('modals.main.settings.sections.stats.sections.tabs_opened')}{' '}
|
||||
{variables.getMessage(`${STATS_SECTION}.sections.tabs_opened`)}{' '}
|
||||
</span>
|
||||
<span>{this.state.stats['tabs-opened'] || 0}</span>
|
||||
</div>
|
||||
|
@ -201,12 +201,10 @@ export default class Stats extends PureComponent {
|
|||
</div>
|
||||
</div>
|
||||
<div className="statSection leftPanel">
|
||||
<span className="title">
|
||||
{variables.getMessage('modals.main.settings.sections.stats.achievements')}
|
||||
</span>
|
||||
<span className="title">{variables.getMessage(`${STATS_SECTION}.achievements`)}</span>
|
||||
<br />
|
||||
<span className="subtitle">
|
||||
{variables.getMessage('modals.main.settings.sections.stats.unlocked', {
|
||||
{variables.getMessage(`${STATS_SECTION}.unlocked`, {
|
||||
count: this.getUnlockedCount() + '/' + this.state.achievements.length,
|
||||
})}
|
||||
</span>
|
||||
|
|
Loading…
Reference in New Issue