From a0976ecb77440ba501bb460fcdab284b668d6e42 Mon Sep 17 00:00:00 2001 From: chr Date: Sun, 20 Jan 2019 20:27:04 -0800 Subject: [PATCH] Roll up changes for 2.7.0 (also on feature branches) --- app/javascript/mastodon/components/status.js | 5 +- .../mastodon/components/status_action_bar.js | 2 +- app/javascript/styles/cybre-base.scss | 10 ++ app/javascript/styles/cybre-light.scss | 11 ++ app/javascript/styles/win95.scss | 147 +++++++++++------- config/locales/en.yml | 1 + config/locales/simple_form.en-CY.yml | 95 +++++++++-- 7 files changed, 198 insertions(+), 73 deletions(-) diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js index 20d838500..7339af4db 100644 --- a/app/javascript/mastodon/components/status.js +++ b/app/javascript/mastodon/components/status.js @@ -308,14 +308,15 @@ class Status extends ImmutablePureComponent { - {media} - {showThread && status.get('in_reply_to_id') && status.get('in_reply_to_account_id') === status.getIn(['account', 'id']) && ( )} + {media} + diff --git a/app/javascript/mastodon/components/status_action_bar.js b/app/javascript/mastodon/components/status_action_bar.js index ab9454d8b..4bbeb9192 100644 --- a/app/javascript/mastodon/components/status_action_bar.js +++ b/app/javascript/mastodon/components/status_action_bar.js @@ -211,7 +211,7 @@ class StatusActionBar extends ImmutablePureComponent { return (
-
/div> + {shareButton} diff --git a/app/javascript/styles/cybre-base.scss b/app/javascript/styles/cybre-base.scss index 83212c713..b9bb4ecb8 100644 --- a/app/javascript/styles/cybre-base.scss +++ b/app/javascript/styles/cybre-base.scss @@ -33,6 +33,16 @@ } } +/* Less emphatic show more */ +.status__content__read-more-button { + font-size: 14px; + color: $dark-text-color; + + .status__prepend-icon { + padding-right: 4px; + } +} + /* Show a little arrowey thing after the time in a * status to signal that you can click it to see * a detailed view */ diff --git a/app/javascript/styles/cybre-light.scss b/app/javascript/styles/cybre-light.scss index 15f2f0e03..c2457e3c2 100644 --- a/app/javascript/styles/cybre-light.scss +++ b/app/javascript/styles/cybre-light.scss @@ -7,6 +7,7 @@ $ui-secondary-color: #ead0d6; // "lightest" $ui-primary-color: #bf5677; // "lighter" $ui-highlight-color: #bf5677; // "vibrant" $primary-text-color: #382b32; +$dark-text-color: #ca748f; $secondary-text-color: #382b32; $header-color: $ui-primary-color; @@ -761,6 +762,16 @@ button.icon-button { } } } + a { + &.selected { + background-color: $ui-primary-color; + color: $white; + + &:hover { + background-color: lighten($ui-primary-color, 10%); + } + } + } } } } diff --git a/app/javascript/styles/win95.scss b/app/javascript/styles/win95.scss index 65078e37d..f550d383e 100644 --- a/app/javascript/styles/win95.scss +++ b/app/javascript/styles/win95.scss @@ -92,6 +92,9 @@ $ui-highlight-color: $win95-window-header; @import 'cybre-base'; +html { + scrollbar-color: $win95-mid-grey transparent; +} body { font-size:13px; @@ -112,7 +115,7 @@ body.admin { .tabs-bar { background: $win95-bg; - @include win95-outset() + @include win95-outset(); height: 30px; } @@ -190,7 +193,7 @@ body.admin { .column > .scrollable { background: $win95-bg; - @include win95-border-outset() + @include win95-border-outset(); border-top-width:0px; } @@ -204,7 +207,7 @@ body.admin { padding:0px; font-size:13px; background:#7f7f7f; - @include win95-border-outset() + @include win95-border-outset(); border-bottom-width:0px; color:white; font-weight:bold; @@ -246,7 +249,7 @@ body.admin { .column-header__button { background: $win95-bg; color: black; - @include win95-outset() + @include win95-outset(); line-height:0px; font-size:14px; @@ -271,7 +274,7 @@ body.admin { max-height: 20px; min-height: unset; margin: 2px; - @include win95-outset() + @include win95-outset(); font-size: 13px; line-height: 17px; font-weight:bold; @@ -284,7 +287,7 @@ body.admin { .column-back-button { background:$win95-bg; color:black; - @include win95-outset() + @include win95-outset(); font-size:13px; font-weight:bold; @@ -413,7 +416,7 @@ body.admin { .text-btn { background-color:$win95-bg; - @include win95-outset() + @include win95-outset(); padding:4px; } @@ -451,12 +454,11 @@ body.admin { .missing-indicator { background-color:$win95-bg; color:black; - @include win95-outset() + @include win95-outset(); } .missing-indicator > div { - background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRUaXRsZQAACJnLyy9Jyy/NSwEAD5IDblIFOhoAAAAXelRYdEF1dGhvcgAACJlLzijKz0vMAQALmgLoDsFj8gAAAQpJREFUOMuVlD0OwjAMhd2oQl04Axfo0IGBgYELcAY6cqQuSO0ZOEAZGBg6VKg74gwsEaoESRVHjusI8aQqzY8/PbtOEz1qkFSn2YevlaNOpLMJh2DwvixhuXtOa6/LCh51DUMEFkAsgAZD207Doin8mQ562JpRE5CHBAAhmIqD1L8AqzUUUJkxc6kr3AgAJ+NuvIWRdk7WcrKl0AUqcIBBHOiEbpS4m27mIL5Onfg3k0rgggeQuS2sDOGSahKR+glgqaGLgUJs951NN1q9D72cQqQWR9cr3sm9YcEssEuz6eEuZh2bu0aSOhQ1MBezu2O/+TVSvEFII3qLsZWrSA2AAUQIh1HpyP/kC++zjVSMj6ntAAAAAElFTkSuQmCC') - no-repeat; + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAARCAYAAAA7bUf6AAAACXBIWXMAAC4jAAAuIwF4pT92AAAAF3pUWHRUaXRsZQAACJnLyy9Jyy/NSwEAD5IDblIFOhoAAAAXelRYdEF1dGhvcgAACJlLzijKz0vMAQALmgLoDsFj8gAAAQpJREFUOMuVlD0OwjAMhd2oQl04Axfo0IGBgYELcAY6cqQuSO0ZOEAZGBg6VKg74gwsEaoESRVHjusI8aQqzY8/PbtOEz1qkFSn2YevlaNOpLMJh2DwvixhuXtOa6/LCh51DUMEFkAsgAZD207Doin8mQ562JpRE5CHBAAhmIqD1L8AqzUUUJkxc6kr3AgAJ+NuvIWRdk7WcrKl0AUqcIBBHOiEbpS4m27mIL5Onfg3k0rgggeQuS2sDOGSahKR+glgqaGLgUJs951NN1q9D72cQqQWR9cr3sm9YcEssEuz6eEuZh2bu0aSOhQ1MBezu2O/+TVSvEFII3qLsZWrSA2AAUQIh1HpyP/kC++zjVSMj6ntAAAAAElFTkSuQmCC') no-repeat; background-position:center center; } @@ -466,6 +468,35 @@ body.admin { color: black; } +.notification__filter-bar { + background: $win95-bg; + @include win95-border-outset-sides-only(); + padding-top: 10px; + padding-left: 10px; + padding-right: 10px; + border-bottom: 2px solid #efefef; + overflow-y: visible; + + button { + background: transparent; + color: black; + padding: 4px 0; + align-self: end; + @include win95-tab(); + + &.active { + color: black; + top: 2px; + padding:8px 0; + background-color: $win95-bg; + + &::before, &::after { + display:none; + } + } + } +} + .status__wrapper { border: 2px groove $win95-bg; margin:4px; @@ -484,6 +515,10 @@ body.admin { &:focus, &:active { background:$win95-bg; } + + &:not(.read) { + background: white; + } } .focusable:focus .status.status-direct { background:$win95-bg; @@ -494,6 +529,14 @@ body.admin { .status__wrapper:focus, .status__content__text:focus { background-color: $win95-bg; } + + .status.status-direct, .detailed-status { + &:not(.read) { + .status__content:focus { + background-color: white; + } + } + } } .status__content, .reply-indicator__content { @@ -541,10 +584,6 @@ body.admin { color:blue; } -.status__content { - padding-bottom: 40px; -} - .focusable:focus { background: $win95-bg; .detailed-status__action-bar { @@ -601,7 +640,7 @@ body.admin { .icon-button { background:$win95-bg; - @include win95-border-outset() + @include win95-border-outset(); padding:0px 0px 0px 0px; margin-right:4px; @@ -635,7 +674,7 @@ body.admin { .icon-button.star-icon > i { background:$win95-bg; - @include win95-border-outset() + @include win95-border-outset(); padding-bottom:3px; } @@ -662,15 +701,15 @@ body.admin { padding-right:25px; } -.status-card { +.status-card, .status-card.compact, a.status-card, a.status-card.compact { border-radius:0px; background:white; border: 1px solid black; color:black; -} -.status-card:hover { - background-color:white; + &:hover { + background-color:white; + } } .status-card__title { @@ -712,7 +751,7 @@ body.admin { .reply-indicator__content .status__content__spoiler-link, .status__content .status__content__spoiler-link { background:$win95-bg; - @include win95-outset() + @include win95-outset(); } .reply-indicator__content .status__content__spoiler-link:hover, .status__content .status__content__spoiler-link:hover { @@ -744,7 +783,7 @@ body.admin { .drawer__header { background: $win95-bg; - @include win95-border-outset() + @include win95-border-outset(); justify-content:left; margin-bottom:0px; padding-bottom:2px; @@ -753,7 +792,7 @@ body.admin { .drawer__tab { color:black; - @include win95-outset() + @include win95-outset(); padding:5px; margin:2px; flex: 0 0 auto; @@ -969,7 +1008,7 @@ body.admin { { box-shadow:unset; color:black; - @include win95-outset() + @include win95-outset(); background: $win95-bg; } @@ -981,32 +1020,34 @@ body.admin { font-weight:bold; } -.compose-form__warning::before { - content:"Tip:"; - font-weight:bold; - display:block; - position:absolute; - top:-10px; - background-color:$win95-bg; - font-size:11px; - padding: 0px 5px; -} +.compose-form { + .compose-form__warning::before { + content:"Tip:"; + font-weight:bold; + display:block; + position:absolute; + top:-10px; + background-color:$win95-bg; + font-size:11px; + padding: 0px 5px; + } -.compose-form__warning { - position:relative; - box-shadow:unset; - border:2px groove $win95-bg; - background-color:$win95-bg; - color:black; -} + .compose-form__warning { + position:relative; + box-shadow:unset; + border:2px groove $win95-bg; + background-color:$win95-bg; + color:black; + } -.compose-form__warning a { - color:blue; -} + .compose-form__warning a { + color:blue; + } -.compose-form__warning strong { - color:black; - text-decoration:underline; + .compose-form__warning strong { + color:black; + text-decoration:underline; + } } .compose-form__buttons button.active:last-child { @@ -1077,7 +1118,7 @@ body.admin { .button { background-color:$win95-bg; - @include win95-outset() + @include win95-outset(); border-radius:0px; color:black; font-weight:bold; @@ -1389,7 +1430,7 @@ body.admin { background-image: url("../images/icon_tos.png"); &:hover { background-image: url("../images/icon_tos.png"); } } -.getting-started__footer ul li a[href="https://github.com/tootsuite/documentation#documentation"] { +.getting-started__footer ul li a[href="https://docs.joinmastodon.org"] { background-image: url("../images/icon_docs.png"); &:hover { background-image: url("../images/icon_docs.png"); } } @@ -1638,7 +1679,7 @@ body.admin { .embed-modal, .error-modal, .onboarding-modal, .actions-modal, .boost-modal, .confirmation-modal, .report-modal { - @include win95-outset() + @include win95-outset(); background:$win95-bg; } @@ -1762,7 +1803,7 @@ body.admin { .admin-wrapper { position:relative; background: $win95-bg; - @include win95-outset() + @include win95-outset(); width:70vw; height:80vh; margin:10vh auto; @@ -1799,7 +1840,7 @@ body.admin { .admin-wrapper .content-wrapper { flex: 1 1 auto; width:calc(100% - 20px); - @include win95-border-outset() + @include win95-border-outset(); position:relative; margin-left:10px; margin-right:10px; @@ -2053,7 +2094,7 @@ a.table-action-link:hover, .simple_form .block-button { background: $win95-bg; - @include win95-outset() + @include win95-outset(); color:black; font-weight: normal; diff --git a/config/locales/en.yml b/config/locales/en.yml index d2a1be7ad..4ae3cdec4 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -934,6 +934,7 @@ en: mastodon: Mastodon mastodon-light: Mastodon (light) win95: Windows 95 + light: Cybre Lite time: formats: default: "%b %d, %Y, %H:%M" diff --git a/config/locales/simple_form.en-CY.yml b/config/locales/simple_form.en-CY.yml index 6d5265cf5..44acd8a39 100644 --- a/config/locales/simple_form.en-CY.yml +++ b/config/locales/simple_form.en-CY.yml @@ -2,63 +2,124 @@ en-CY: simple_form: hints: + account_warning_preset: + text: You can use ping syntax, such as URLs, hashtags and mentions + admin_account_action: + send_email_notification: The user will receive an explanation of what happened with their account + text_html: Optional. You can use ping syntax. You can add warning presets to save time + type_html: Choose what to do with %{acct} + warning_preset_id: Optional. You can still add custom text to end of the preset defaults: - avatar: PNG, GIF or JPG. At most 2MB. Will be downscaled to 120x120px - display_name: - one: 1 character left - other: %{count} characters left - header: PNG, GIF or JPG. At most 2MB. Will be downscaled to 700x335px - locked: Requires you to manually approve followers and defaults ping privacy to followers-only - note: - one: 1 character left - other: %{count} characters left + autofollow: People who sign up through the invite will automatically follow you + avatar: PNG, GIF or JPG. At most %{size}. Will be downscaled to %{dimensions}px + bot: This account mainly performs automated actions and might not be monitored + context: One or multiple contexts where the filter should apply + digest: Only sent after a long period of inactivity and only if you have received any personal messages in your absence + discoverable_html: The directory lets people find accounts based on interests and activity. Requires at least %{min_followers} followers + email: You will be sent a confirmation e-mail + fields: You can have up to 4 items displayed as a table on your profile + header: PNG, GIF or JPG. At most %{size}. Will be downscaled to %{dimensions}px + inbox_url: Copy the URL from the frontpage of the relay you want to use + irreversible: Filtered pings will disappear irreversibly, even if filter is later removed + locale: The language of the user interface, e-mails and push notifications + locked: Requires you to manually approve followers + password: Use at least 8 characters + phrase: Will be matched regardless of casing in text or content warning of a pings + scopes: Which APIs the application will be allowed to access. If you select a top-level scope, you don't need to select individual ones. + setting_aggregate_reblogs: Do not show new relays for pings that have been recently relayed (only affects newly-received relays) + setting_default_language: The language of your pings can be detected automatically, but it's not always accurate + setting_display_media_default: Hide media marked as sensitive + setting_display_media_hide_all: Always hide all media + setting_display_media_show_all: Always show media marked as sensitive + setting_hide_network: Who you follow and who follows you will not be shown on your profile setting_noindex: Affects your public profile and status pages setting_theme: Affects how Mastodon looks when you're logged in from any device. + username: Your username will be unique on %{domain} + whole_word: When the keyword or phrase is alphanumeric only, it will only be applied if it matches the whole word imports: data: CSV file exported from another Mastodon instance sessions: - otp: Enter the Two-factor code from your phone or use one of your recovery codes. + otp: 'Enter the two-factor code generated by your phone app or use one of your recovery codes:' user: - filtered_languages: Selected languages will be removed from your public timelines. + chosen_languages: When checked, only pings in selected languages will be displayed in public timelines labels: + account: + fields: + name: Label + value: Content + account_warning_preset: + text: Preset text + admin_account_action: + send_email_notification: Notify the user per e-mail + text: Custom warning + type: Action + types: + disable: Disable + none: Do nothing + silence: Silence + suspend: Suspend and irreversibly delete account data + warning_preset_id: Use a warning preset defaults: + autofollow: Invite to follow your account avatar: Avatar + bot: This is a bot account + chosen_languages: Filter languages confirm_new_password: Confirm new password confirm_password: Confirm password + context: Filter contexts current_password: Current password data: Data + discoverable: List this account on the directory display_name: Display name email: E-mail address - filtered_languages: Filtered languages + expires_in: Expire after + fields: Profile metadata header: Header - locale: Language + inbox_url: URL of the relay inbox + irreversible: Drop instead of hide + locale: Interface language locked: Lock account + max_uses: Max number of uses new_password: New password note: Bio otp_attempt: Two-factor code password: Password + phrase: Keyword or phrase + setting_aggregate_reblogs: Group relays in timelines setting_auto_play_gif: Auto-play animated GIFs - setting_boost_modal: Show confirmation dialog before boosting + setting_boost_modal: Show confirmation dialog before relaying + setting_default_language: Posting language setting_default_privacy: Post privacy setting_default_sensitive: Always mark media as sensitive setting_delete_modal: Show confirmation dialog before deleting a ping + setting_display_media: Media display + setting_display_media_default: Default + setting_display_media_hide_all: Hide all + setting_display_media_show_all: Show all + setting_expand_spoilers: Always expand pings marked with content warnings + setting_hide_network: Hide your network setting_noindex: Opt-out of search engine indexing - setting_system_font_ui: Use a heuristic-based approximation of what Mastodon thinks your system font might be + setting_reduce_motion: Reduce motion in animations + setting_system_font_ui: Use system's default font setting_theme: Site theme setting_unfollow_modal: Show confirmation dialog before unfollowing someone severity: Severity type: Import type username: Username + username_or_email: Username or Email + whole_word: Whole word interactions: must_be_follower: Block notifications from non-followers must_be_following: Block notifications from people you don't follow + must_be_following_dm: Block direct messages from people you don't follow notification_emails: digest: Send digest e-mails - favourite: Send e-mail when someone florps your ping + favourite: Send e-mail when someone favourites your status follow: Send e-mail when someone follows you follow_request: Send e-mail when someone requests to follow you mention: Send e-mail when someone mentions you - reblog: Send e-mail when someone boosts your ping + reblog: Send e-mail when someone relays your status + report: Send e-mail when a new report is submitted 'no': 'No' required: mark: "*"