From c66dc0d11469622d89267f8109aa0223a283fec9 Mon Sep 17 00:00:00 2001 From: shel Date: Sat, 25 Mar 2017 19:59:38 -0400 Subject: [PATCH 1/3] Clarify privacy options Descriptions of differences between scope are more clear --- .../features/compose/components/privacy_dropdown.jsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/app/assets/javascripts/components/features/compose/components/privacy_dropdown.jsx b/app/assets/javascripts/components/features/compose/components/privacy_dropdown.jsx index e7c7cf179..3516197ea 100644 --- a/app/assets/javascripts/components/features/compose/components/privacy_dropdown.jsx +++ b/app/assets/javascripts/components/features/compose/components/privacy_dropdown.jsx @@ -4,13 +4,13 @@ import IconButton from '../../../components/icon_button'; const messages = defineMessages({ public_short: { id: 'privacy.public.short', defaultMessage: 'Public' }, - public_long: { id: 'privacy.public.long', defaultMessage: 'Anyone can see' }, + public_long: { id: 'privacy.public.long', defaultMessage: 'Post to Public Timelines' }, unlisted_short: { id: 'privacy.unlisted.short', defaultMessage: 'Unlisted' }, - unlisted_long: { id: 'privacy.unlisted.long', defaultMessage: 'Anyone can see' }, + unlisted_long: { id: 'privacy.unlisted.long', defaultMessage: 'Do not show in public timelines' }, private_short: { id: 'privacy.private.short', defaultMessage: 'Private' }, - private_long: { id: 'privacy.private.long', defaultMessage: 'Followers can see' }, + private_long: { id: 'privacy.private.long', defaultMessage: 'Post to followers only, cannot be boosted' }, direct_short: { id: 'privacy.direct.short', defaultMessage: 'Direct' }, - direct_long: { id: 'privacy.direct.long', defaultMessage: 'Mentions can see' } + direct_long: { id: 'privacy.direct.long', defaultMessage: 'Post to mentioned users only' } }); const PrivacyDropdown = React.createClass({ @@ -65,9 +65,9 @@ const PrivacyDropdown = React.createClass({ const options = [ { icon: 'globe', value: 'public', shortText: intl.formatMessage(messages.public_short), longText: intl.formatMessage(messages.public_long) }, - { icon: 'globe', value: 'unlisted', shortText: intl.formatMessage(messages.unlisted_short), longText: intl.formatMessage(messages.unlisted_long) }, + { icon: 'unlock-alt', value: 'unlisted', shortText: intl.formatMessage(messages.unlisted_short), longText: intl.formatMessage(messages.unlisted_long) }, { icon: 'lock', value: 'private', shortText: intl.formatMessage(messages.private_short), longText: intl.formatMessage(messages.private_long) }, - { icon: 'envelope', value: 'direct', shortText: intl.formatMessage(messages.direct_short), longText: intl.formatMessage(messages.direct_long) } + { icon: 'paper-plane', value: 'direct', shortText: intl.formatMessage(messages.direct_short), longText: intl.formatMessage(messages.direct_long) } ]; const valueOption = options.find(item => item.value === value); From 2b7e3d56c85cd9de8a15bf90628bc14f5eef1b5c Mon Sep 17 00:00:00 2001 From: shel Date: Sat, 25 Mar 2017 20:02:36 -0400 Subject: [PATCH 2/3] Increase color contrast Privacy descriptions were very difficult to reason. This is the minimal level of color contrast to be WCAG AA compliant. --- app/assets/stylesheets/components.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss index 822700c9c..75f7003b4 100644 --- a/app/assets/stylesheets/components.scss +++ b/app/assets/stylesheets/components.scss @@ -1703,7 +1703,7 @@ button.active i.fa-retweet { .privacy-dropdown__option__content { flex: 1 1 auto; - color: $color3; + color: #536f96; strong { font-weight: 500; From 5f7c9976549a2ae883dba1e012bb9f929eb8b422 Mon Sep 17 00:00:00 2001 From: shel Date: Sat, 25 Mar 2017 20:42:49 -0400 Subject: [PATCH 3/3] Change to using variables Thanks garg --- app/assets/stylesheets/components.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/assets/stylesheets/components.scss b/app/assets/stylesheets/components.scss index 75f7003b4..d47214bbb 100644 --- a/app/assets/stylesheets/components.scss +++ b/app/assets/stylesheets/components.scss @@ -1703,7 +1703,7 @@ button.active i.fa-retweet { .privacy-dropdown__option__content { flex: 1 1 auto; - color: #536f96; + color: darken($color3, 24%); strong { font-weight: 500;