Add high color privacy icons

Fixes #1015
master
Thibaut Girka 6 years ago committed by ThibG
parent be6ef1947e
commit ac54292d69
  1. 9
      app/javascript/flavours/glitch/features/local_settings/page/index.js
  2. 2
      app/javascript/flavours/glitch/features/ui/index.js
  3. 1
      app/javascript/flavours/glitch/reducers/local_settings.js
  4. 22
      app/javascript/flavours/glitch/styles/accessibility.scss

@ -42,6 +42,15 @@ export default class LocalSettingsPage extends React.PureComponent {
> >
<FormattedMessage id='settings.show_reply_counter' defaultMessage='Display an estimate of the reply count' /> <FormattedMessage id='settings.show_reply_counter' defaultMessage='Display an estimate of the reply count' />
</LocalSettingsPageItem> </LocalSettingsPageItem>
<LocalSettingsPageItem
settings={settings}
item={['hicolor_privacy_icons']}
id='mastodon-settings--hicolor_privacy_icons'
onChange={onChange}
>
<FormattedMessage id='settings.hicolor_privacy_icons' defaultMessage='High color privacy icons' />
<span className='hint'><FormattedMessage id='settings.hicolor_privacy_icons.hint' defaultMessage="Display privacy icons in bright and easily distinguishable colors" /></span>
</LocalSettingsPageItem>
<section> <section>
<h2><FormattedMessage id='settings.notifications_opts' defaultMessage='Notifications options' /></h2> <h2><FormattedMessage id='settings.notifications_opts' defaultMessage='Notifications options' /></h2>
<LocalSettingsPageItem <LocalSettingsPageItem

@ -68,6 +68,7 @@ const mapStateToProps = state => ({
dropdownMenuIsOpen: state.getIn(['dropdown_menu', 'openId']) !== null, dropdownMenuIsOpen: state.getIn(['dropdown_menu', 'openId']) !== null,
unreadNotifications: state.getIn(['notifications', 'unread']), unreadNotifications: state.getIn(['notifications', 'unread']),
showFaviconBadge: state.getIn(['local_settings', 'notifications', 'favicon_badge']), showFaviconBadge: state.getIn(['local_settings', 'notifications', 'favicon_badge']),
hicolorPrivacyIcons: state.getIn(['local_settings', 'hicolor_privacy_icons']),
}); });
const keyMap = { const keyMap = {
@ -446,6 +447,7 @@ export default class UI extends React.Component {
'wide': isWide, 'wide': isWide,
'system-font': this.props.systemFontUi, 'system-font': this.props.systemFontUi,
'navbar-under': navbarUnder, 'navbar-under': navbarUnder,
'hicolor-privacy-icons': this.props.hicolorPrivacyIcons,
}); });
const handlers = { const handlers = {

@ -18,6 +18,7 @@ const initialState = ImmutableMap({
confirm_before_clearing_draft: true, confirm_before_clearing_draft: true,
preselect_on_reply: true, preselect_on_reply: true,
inline_preview_cards: true, inline_preview_cards: true,
hicolor_privacy_icons: true,
content_warnings : ImmutableMap({ content_warnings : ImmutableMap({
auto_unfold : false, auto_unfold : false,
filter : null, filter : null,

@ -11,3 +11,25 @@ $emojis-requiring-outlines: '8ball' 'ant' 'back' 'black_circle' 'black_heart' 'b
} }
} }
} }
.hicolor-privacy-icons {
.status__visibility-icon.fa-globe,
.composer--options--dropdown--content--item .fa-globe {
color: #1976D2;
}
.status__visibility-icon.fa-unlock,
.composer--options--dropdown--content--item .fa-unlock {
color: #388E3C;
}
.status__visibility-icon.fa-lock,
.composer--options--dropdown--content--item .fa-lock {
color: #FFA000;
}
.status__visibility-icon.fa-envelope,
.composer--options--dropdown--content--item .fa-envelope {
color: #D32F2F;
}
}

Loading…
Cancel
Save