Add icons for each of the local-setting pages
parent
641d056e0f
commit
edb9ec8543
|
@ -38,30 +38,35 @@ export default class LocalSettingsNavigation extends React.PureComponent {
|
|||
active={index === 0}
|
||||
index={0}
|
||||
onNavigate={onNavigate}
|
||||
icon='cogs'
|
||||
title={intl.formatMessage(messages.general)}
|
||||
/>
|
||||
<LocalSettingsNavigationItem
|
||||
active={index === 1}
|
||||
index={1}
|
||||
onNavigate={onNavigate}
|
||||
icon='pencil'
|
||||
title={intl.formatMessage(messages.compose)}
|
||||
/>
|
||||
<LocalSettingsNavigationItem
|
||||
active={index === 2}
|
||||
index={2}
|
||||
onNavigate={onNavigate}
|
||||
textIcon='CW'
|
||||
title={intl.formatMessage(messages.content_warnings)}
|
||||
/>
|
||||
<LocalSettingsNavigationItem
|
||||
active={index === 3}
|
||||
index={3}
|
||||
onNavigate={onNavigate}
|
||||
icon='angle-double-up'
|
||||
title={intl.formatMessage(messages.collapsed)}
|
||||
/>
|
||||
<LocalSettingsNavigationItem
|
||||
active={index === 4}
|
||||
index={4}
|
||||
onNavigate={onNavigate}
|
||||
icon='image'
|
||||
title={intl.formatMessage(messages.media)}
|
||||
/>
|
||||
<LocalSettingsNavigationItem
|
||||
|
@ -76,6 +81,7 @@ export default class LocalSettingsNavigation extends React.PureComponent {
|
|||
className='close'
|
||||
index={6}
|
||||
onNavigate={onClose}
|
||||
icon='times'
|
||||
title={intl.formatMessage(messages.close)}
|
||||
/>
|
||||
</nav>
|
||||
|
|
|
@ -12,6 +12,7 @@ export default class LocalSettingsPage extends React.PureComponent {
|
|||
className: PropTypes.string,
|
||||
href: PropTypes.string,
|
||||
icon: PropTypes.string,
|
||||
textIcon: PropTypes.string,
|
||||
index: PropTypes.number.isRequired,
|
||||
onNavigate: PropTypes.func,
|
||||
title: PropTypes.string,
|
||||
|
@ -32,6 +33,7 @@ export default class LocalSettingsPage extends React.PureComponent {
|
|||
className,
|
||||
href,
|
||||
icon,
|
||||
textIcon,
|
||||
onNavigate,
|
||||
title,
|
||||
} = this.props;
|
||||
|
@ -40,14 +42,14 @@ export default class LocalSettingsPage extends React.PureComponent {
|
|||
active,
|
||||
}, className);
|
||||
|
||||
const iconElem = icon ? <i className={`fa fa-fw fa-${icon}`} /> : null;
|
||||
const iconElem = icon ? <i className={`fa fa-fw fa-${icon}`} /> : (textIcon ? <span className='text-icon-button'>{textIcon}</span> : null);
|
||||
|
||||
if (href) return (
|
||||
<a
|
||||
href={href}
|
||||
className={finalClassName}
|
||||
>
|
||||
{iconElem} {title}
|
||||
{iconElem} <span>{title}</span>
|
||||
</a>
|
||||
);
|
||||
else if (onNavigate) return (
|
||||
|
@ -57,7 +59,7 @@ export default class LocalSettingsPage extends React.PureComponent {
|
|||
tabIndex='0'
|
||||
className={finalClassName}
|
||||
>
|
||||
{iconElem} {title}
|
||||
{iconElem} <span>{title}</span>
|
||||
</a>
|
||||
);
|
||||
else return null;
|
||||
|
|
|
@ -72,7 +72,7 @@
|
|||
|
||||
.glitch.local-settings__navigation {
|
||||
background: lighten($ui-secondary-color, 8%);
|
||||
width: 200px;
|
||||
width: 212px;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
overflow-y: auto;
|
||||
|
|
Loading…
Reference in New Issue