djsundog/tootlab-mastodon
1
0
Fork 0
mirror of https://github.com/glitch-soc/mastodon.git synced 2024-11-24 17:14:15 -05:00
Code Issues Packages Projects Releases Wiki Activity

Add icons for each of the local-setting pages

Browse Source
This commit is contained in:
Thibaut Girka 2018-10-01 22:09:57 +02:00 committed by ThibG
parent 641d056e0f
commit edb9ec8543
3 changed files with 12 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/javascript/flavours/glitch/features/local_settings/navigation/index.js
View File

@ -38,30 +38,35 @@ export default class LocalSettingsNavigation extends React.PureComponent {
active={index === 0} active={index === 0}
index={0} index={0}
onNavigate={onNavigate} onNavigate={onNavigate}
icon='cogs'
title={intl.formatMessage(messages.general)} title={intl.formatMessage(messages.general)}
/> />
<LocalSettingsNavigationItem <LocalSettingsNavigationItem
active={index === 1} active={index === 1}
index={1} index={1}
onNavigate={onNavigate} onNavigate={onNavigate}
icon='pencil'
title={intl.formatMessage(messages.compose)} title={intl.formatMessage(messages.compose)}
/> />
<LocalSettingsNavigationItem <LocalSettingsNavigationItem
active={index === 2} active={index === 2}
index={2} index={2}
onNavigate={onNavigate} onNavigate={onNavigate}
textIcon='CW'
title={intl.formatMessage(messages.content_warnings)} title={intl.formatMessage(messages.content_warnings)}
/> />
<LocalSettingsNavigationItem <LocalSettingsNavigationItem
active={index === 3} active={index === 3}
index={3} index={3}
onNavigate={onNavigate} onNavigate={onNavigate}
icon='angle-double-up'
title={intl.formatMessage(messages.collapsed)} title={intl.formatMessage(messages.collapsed)}
/> />
<LocalSettingsNavigationItem <LocalSettingsNavigationItem
active={index === 4} active={index === 4}
index={4} index={4}
onNavigate={onNavigate} onNavigate={onNavigate}
icon='image'
title={intl.formatMessage(messages.media)} title={intl.formatMessage(messages.media)}
/> />
<LocalSettingsNavigationItem <LocalSettingsNavigationItem
@ -76,6 +81,7 @@ export default class LocalSettingsNavigation extends React.PureComponent {
className='close' className='close'
index={6} index={6}
onNavigate={onClose} onNavigate={onClose}
icon='times'
title={intl.formatMessage(messages.close)} title={intl.formatMessage(messages.close)}
/> />
</nav> </nav>

8
app/javascript/flavours/glitch/features/local_settings/navigation/item/index.js
View File

@ -12,6 +12,7 @@ export default class LocalSettingsPage extends React.PureComponent {
className: PropTypes.string, className: PropTypes.string,
href: PropTypes.string, href: PropTypes.string,
icon: PropTypes.string, icon: PropTypes.string,
textIcon: PropTypes.string,
index: PropTypes.number.isRequired, index: PropTypes.number.isRequired,
onNavigate: PropTypes.func, onNavigate: PropTypes.func,
title: PropTypes.string, title: PropTypes.string,
@ -32,6 +33,7 @@ export default class LocalSettingsPage extends React.PureComponent {
className, className,
href, href,
icon, icon,
textIcon,
onNavigate, onNavigate,
title, title,
} = this.props; } = this.props;
@ -40,14 +42,14 @@ export default class LocalSettingsPage extends React.PureComponent {
active, active,
}, className); }, 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 ( if (href) return (
<a <a
href={href} href={href}
className={finalClassName} className={finalClassName}
> >
{iconElem} {title} {iconElem} <span>{title}</span>
</a> </a>
); );
else if (onNavigate) return ( else if (onNavigate) return (
@ -57,7 +59,7 @@ export default class LocalSettingsPage extends React.PureComponent {
tabIndex='0' tabIndex='0'
className={finalClassName} className={finalClassName}
> >
{iconElem} {title} {iconElem} <span>{title}</span>
</a> </a>
); );
else return null; else return null;

2
app/javascript/flavours/glitch/styles/components/local_settings.scss
View File

@ -72,7 +72,7 @@
.glitch.local-settings__navigation { .glitch.local-settings__navigation {
background: lighten($ui-secondary-color, 8%); background: lighten($ui-secondary-color, 8%);
width: 200px; width: 212px;
font-size: 15px; font-size: 15px;
line-height: 20px; line-height: 20px;
overflow-y: auto; overflow-y: auto;