From 36d426cec90741df0b8eb449695d16661a60aa7b Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 13:13:58 +0200 Subject: [Glitch] Separate font-family into variable Port d0d65b5a2899546c4134d1fca60aef2c23c4932d to glitch-soc --- app/javascript/flavours/glitch/styles/about.scss | 46 +++++++++++----------- app/javascript/flavours/glitch/styles/admin.scss | 2 +- app/javascript/flavours/glitch/styles/basics.scss | 6 +-- .../flavours/glitch/styles/containers.scss | 4 +- .../flavours/glitch/styles/dashboard.scss | 2 +- app/javascript/flavours/glitch/styles/forms.scss | 8 ++-- app/javascript/flavours/glitch/styles/tables.scss | 2 +- .../flavours/glitch/styles/variables.scss | 4 ++ 8 files changed, 39 insertions(+), 35 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/about.scss b/app/javascript/flavours/glitch/styles/about.scss index ba46c65c5..f676a8c77 100644 --- a/app/javascript/flavours/glitch/styles/about.scss +++ b/app/javascript/flavours/glitch/styles/about.scss @@ -16,7 +16,7 @@ $small-breakpoint: 960px; } .rich-formatting { - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 16px; font-weight: 400; font-size: 16px; @@ -31,7 +31,7 @@ $small-breakpoint: 960px; p, li { - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 16px; font-weight: 400; font-size: 16px; @@ -62,7 +62,7 @@ $small-breakpoint: 960px; } h1 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 26px; line-height: 30px; font-weight: 500; @@ -70,7 +70,7 @@ $small-breakpoint: 960px; color: $secondary-text-color; small { - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; display: block; font-size: 18px; font-weight: 400; @@ -79,7 +79,7 @@ $small-breakpoint: 960px; } h2 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 22px; line-height: 26px; font-weight: 500; @@ -88,7 +88,7 @@ $small-breakpoint: 960px; } h3 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 18px; line-height: 24px; font-weight: 500; @@ -97,7 +97,7 @@ $small-breakpoint: 960px; } h4 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 16px; line-height: 24px; font-weight: 500; @@ -106,7 +106,7 @@ $small-breakpoint: 960px; } h5 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 14px; line-height: 24px; font-weight: 500; @@ -115,7 +115,7 @@ $small-breakpoint: 960px; } h6 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 12px; line-height: 24px; font-weight: 500; @@ -180,7 +180,7 @@ $small-breakpoint: 960px; &__section { flex: 1 0 0; - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 16px; line-height: 28px; color: $primary-text-color; @@ -221,7 +221,7 @@ $small-breakpoint: 960px; bottom: -40px; .panel-header { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 14px; line-height: 24px; font-weight: 500; @@ -452,7 +452,7 @@ $small-breakpoint: 960px; p, li { - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 16px; font-weight: 400; font-size: 16px; @@ -501,7 +501,7 @@ $small-breakpoint: 960px; } h1 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 26px; line-height: 30px; font-weight: 500; @@ -509,7 +509,7 @@ $small-breakpoint: 960px; color: $secondary-text-color; small { - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; display: block; font-size: 18px; font-weight: 400; @@ -518,7 +518,7 @@ $small-breakpoint: 960px; } h2 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 22px; line-height: 26px; font-weight: 500; @@ -527,7 +527,7 @@ $small-breakpoint: 960px; } h3 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 18px; line-height: 24px; font-weight: 500; @@ -536,7 +536,7 @@ $small-breakpoint: 960px; } h4 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 16px; line-height: 24px; font-weight: 500; @@ -545,7 +545,7 @@ $small-breakpoint: 960px; } h5 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 14px; line-height: 24px; font-weight: 500; @@ -554,7 +554,7 @@ $small-breakpoint: 960px; } h6 { - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-size: 12px; line-height: 24px; font-weight: 500; @@ -621,7 +621,7 @@ $small-breakpoint: 960px; .hero .heading { padding-bottom: 20px; - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 16px; font-weight: 400; font-size: 16px; @@ -672,7 +672,7 @@ $small-breakpoint: 960px; text-decoration: none; padding: 12px 16px; line-height: 32px; - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-weight: 500; font-size: 14px; @@ -745,7 +745,7 @@ $small-breakpoint: 960px; .about-short { background: darken($ui-base-color, 4%); padding: 50px 0 30px; - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 16px; font-weight: 400; font-size: 16px; @@ -1015,7 +1015,7 @@ $small-breakpoint: 960px; display: flex; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar; - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; font-size: 13px; line-height: 18px; font-weight: 400; diff --git a/app/javascript/flavours/glitch/styles/admin.scss b/app/javascript/flavours/glitch/styles/admin.scss index b8cc33039..e16920dd4 100644 --- a/app/javascript/flavours/glitch/styles/admin.scss +++ b/app/javascript/flavours/glitch/styles/admin.scss @@ -443,7 +443,7 @@ $no-columns-breakpoint: 600px; border-radius: 0 0 4px 4px; padding: 10px; color: $darker-text-color; - font-family: 'mastodon-font-monospace', monospace; + font-family: $font-monospace, monospace; font-size: 12px; word-wrap: break-word; min-height: 20px; diff --git a/app/javascript/flavours/glitch/styles/basics.scss b/app/javascript/flavours/glitch/styles/basics.scss index 9c2499ac4..550b7fdfc 100644 --- a/app/javascript/flavours/glitch/styles/basics.scss +++ b/app/javascript/flavours/glitch/styles/basics.scss @@ -6,7 +6,7 @@ } body { - font-family: 'mastodon-font-sans-serif', sans-serif; + font-family: $font-sans-serif, sans-serif; background: darken($ui-base-color, 8%); font-size: 13px; line-height: 18px; @@ -29,8 +29,8 @@ body { // Fira Sans => Firefox OS // Droid Sans => Older Androids (<4.0) // Helvetica Neue => Older macOS <10.11 - // mastodon-font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0) - font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", mastodon-font-sans-serif, sans-serif; + // $font-sans-serif => web-font (Roboto) fallback and newer Androids (>=4.0) + font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", $font-sans-serif, sans-serif; } &.app-body { diff --git a/app/javascript/flavours/glitch/styles/containers.scss b/app/javascript/flavours/glitch/styles/containers.scss index d1b9934d7..398458e47 100644 --- a/app/javascript/flavours/glitch/styles/containers.scss +++ b/app/javascript/flavours/glitch/styles/containers.scss @@ -37,7 +37,7 @@ outline: 0; padding: 12px 16px; line-height: 32px; - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; font-weight: 500; font-size: 14px; } @@ -633,7 +633,7 @@ font-size: 18px; margin-bottom: 5px; color: $primary-text-color; - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; } } diff --git a/app/javascript/flavours/glitch/styles/dashboard.scss b/app/javascript/flavours/glitch/styles/dashboard.scss index 949ca733f..86cf6c61b 100644 --- a/app/javascript/flavours/glitch/styles/dashboard.scss +++ b/app/javascript/flavours/glitch/styles/dashboard.scss @@ -35,7 +35,7 @@ font-weight: 500; font-size: 24px; color: $primary-text-color; - font-family: 'mastodon-font-display', sans-serif; + font-family: $font-display, sans-serif; margin-bottom: 20px; } diff --git a/app/javascript/flavours/glitch/styles/forms.scss b/app/javascript/flavours/glitch/styles/forms.scss index cbd3de94c..be2bf7cea 100644 --- a/app/javascript/flavours/glitch/styles/forms.scss +++ b/app/javascript/flavours/glitch/styles/forms.scss @@ -1,7 +1,7 @@ $no-columns-breakpoint: 600px; code { - font-family: 'mastodon-font-monospace', monospace; + font-family: $font-monospace, monospace; font-weight: 400; } @@ -474,7 +474,7 @@ code { width: 100%; border: none; padding: 10px; - font-family: 'mastodon-font-monospace', monospace; + font-family: $font-monospace, monospace; background: $ui-base-color; color: $primary-text-color; font-size: 14px; @@ -718,7 +718,7 @@ code { .form_admin_settings_custom_css, .form_admin_settings_closed_registrations_message { textarea { - font-family: 'mastodon-font-monospace', monospace; + font-family: $font-monospace, monospace; } } @@ -742,7 +742,7 @@ code { border: 0; padding: 10px; font-size: 14px; - font-family: 'mastodon-font-monospace', monospace; + font-family: $font-monospace, monospace; } button { diff --git a/app/javascript/flavours/glitch/styles/tables.scss b/app/javascript/flavours/glitch/styles/tables.scss index fa876e603..9fd0b95bb 100644 --- a/app/javascript/flavours/glitch/styles/tables.scss +++ b/app/javascript/flavours/glitch/styles/tables.scss @@ -90,7 +90,7 @@ } samp { - font-family: 'mastodon-font-monospace', monospace; + font-family: $font-monospace, monospace; } button.table-action-link { diff --git a/app/javascript/flavours/glitch/styles/variables.scss b/app/javascript/flavours/glitch/styles/variables.scss index 715ecf98f..1ed1a5778 100644 --- a/app/javascript/flavours/glitch/styles/variables.scss +++ b/app/javascript/flavours/glitch/styles/variables.scss @@ -51,6 +51,10 @@ $media-modal-media-max-height: 80%; $no-gap-breakpoint: 415px; +$font-sans-serif: 'mastodon-font-sans-serif' !default; +$font-display: 'mastodon-font-display' !default; +$font-monospace: 'mastodon-font-monospace' !default; + // Avatar border size (8% default, 100% for rounded avatars) $ui-avatar-border-size: 8%; -- cgit From 884a898442d6d29e340304020094f208adc4c2b0 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 13:15:11 +0200 Subject: [Glitch] RTL: fix statubar action buttons/counter margins Port 9f6662fcc979d497b09fbd9b3ab06dd7538b92c9 to glitch-soc --- app/javascript/flavours/glitch/styles/rtl.scss | 13 +++++++++++++ 1 file changed, 13 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss index b8c0efad8..e3d854505 100644 --- a/app/javascript/flavours/glitch/styles/rtl.scss +++ b/app/javascript/flavours/glitch/styles/rtl.scss @@ -145,6 +145,19 @@ body.rtl { margin-right: 6px; } + .status__action-bar { + + &__counter { + margin-right: 0; + margin-left: 11px; + + .status__action-bar-button { + margin-right: 0; + margin-left: 4px; + } + } + } + .status__action-bar-button { float: right; margin-right: 0; -- cgit From 15197a831c479393ad6517d1d4f34e48e04e2500 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 13:17:07 +0200 Subject: [Glitch] RTL: fix margins: public-layout.header.nav-button Port df2f4052b84e68d36341df5fb58755276e9bf3ce to glitch-soc --- app/javascript/flavours/glitch/styles/rtl.scss | 9 +++++++++ 1 file changed, 9 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss index e3d854505..23953304a 100644 --- a/app/javascript/flavours/glitch/styles/rtl.scss +++ b/app/javascript/flavours/glitch/styles/rtl.scss @@ -298,4 +298,13 @@ body.rtl { } } } + + .public-layout { + .header { + .nav-button { + margin-left: 8px; + margin-right: 0; + } + } + } } -- cgit From 6ad76069096005d7b55d9c63a567f843997a8068 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 14:15:47 +0200 Subject: [Glitch] Add support for new display_media setting Port f7a6f9489da9b2a1820366654df47b8a52f5c5bc to glitch-soc [API] [vanilla required] [glitch-soc optional] initial_state show_sensitive_media boolean changed to show_media string with options "default", "hide_all", "show_all" --- app/javascript/flavours/glitch/components/media_gallery.js | 4 ++-- app/javascript/flavours/glitch/features/video/index.js | 4 ++-- app/javascript/flavours/glitch/util/initial_state.js | 1 + 3 files changed, 5 insertions(+), 4 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/components/media_gallery.js b/app/javascript/flavours/glitch/components/media_gallery.js index 605a2862b..613318102 100644 --- a/app/javascript/flavours/glitch/components/media_gallery.js +++ b/app/javascript/flavours/glitch/components/media_gallery.js @@ -6,7 +6,7 @@ import IconButton from './icon_button'; import { defineMessages, injectIntl, FormattedMessage } from 'react-intl'; import { isIOS } from 'flavours/glitch/util/is_mobile'; import classNames from 'classnames'; -import { autoPlayGif, displaySensitiveMedia } from 'flavours/glitch/util/initial_state'; +import { autoPlayGif, displayMedia } from 'flavours/glitch/util/initial_state'; const messages = defineMessages({ hidden: { @@ -226,7 +226,7 @@ export default class MediaGallery extends React.PureComponent { }; state = { - visible: this.props.revealed === undefined ? (!this.props.sensitive || displaySensitiveMedia) : this.props.revealed, + visible: this.props.revealed === undefined ? (displayMedia !== 'hide_all' && !this.props.sensitive || displayMedia === 'show_all') : this.props.revealed, }; componentWillReceiveProps (nextProps) { diff --git a/app/javascript/flavours/glitch/features/video/index.js b/app/javascript/flavours/glitch/features/video/index.js index 5cbe01f26..227f298e4 100644 --- a/app/javascript/flavours/glitch/features/video/index.js +++ b/app/javascript/flavours/glitch/features/video/index.js @@ -5,7 +5,7 @@ import { fromJS } from 'immutable'; import { throttle } from 'lodash'; import classNames from 'classnames'; import { isFullscreen, requestFullscreen, exitFullscreen } from 'flavours/glitch/util/fullscreen'; -import { displaySensitiveMedia } from 'flavours/glitch/util/initial_state'; +import { displayMedia } from 'flavours/glitch/util/initial_state'; const messages = defineMessages({ play: { id: 'video.play', defaultMessage: 'Play' }, @@ -114,7 +114,7 @@ export default class Video extends React.PureComponent { fullscreen: false, hovered: false, muted: false, - revealed: this.props.revealed === undefined ? (!this.props.sensitive || displaySensitiveMedia) : this.props.revealed, + revealed: this.props.revealed === undefined ? (displayMedia !== 'hide_all' && !this.props.sensitive || displayMedia === 'show_all') : this.props.revealed, }; setPlayerRef = c => { diff --git a/app/javascript/flavours/glitch/util/initial_state.js b/app/javascript/flavours/glitch/util/initial_state.js index fdf004527..0aaf65904 100644 --- a/app/javascript/flavours/glitch/util/initial_state.js +++ b/app/javascript/flavours/glitch/util/initial_state.js @@ -14,6 +14,7 @@ const getMeta = (prop) => initialState && initialState.meta && initialState.meta export const reduceMotion = getMeta('reduce_motion'); export const autoPlayGif = getMeta('auto_play_gif'); export const displaySensitiveMedia = getMeta('display_sensitive_media'); +export const displayMedia = getMeta('display_media') || (getMeta('display_sensitive_media') ? 'show_all' : 'default'); export const unfollowModal = getMeta('unfollow_modal'); export const boostModal = getMeta('boost_modal'); export const favouriteModal = getMeta('favourite_modal'); -- cgit From eb854275764d13c114729fbd0dc083fe3a3bb38c Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 2 Oct 2018 15:48:55 +0200 Subject: [Glitch] Honour displayMedia setting in accountMedia gallery Inspired by b79ab15859e7f8383526afd147e8416d2df2f7a7 --- .../account_gallery/components/media_item.js | 21 +++++++++++++++++---- .../flavours/glitch/styles/components/accounts.scss | 10 +++++++++- 2 files changed, 26 insertions(+), 5 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js index c2cf48d7b..2e48ab799 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js +++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js @@ -2,6 +2,7 @@ import React from 'react'; import ImmutablePropTypes from 'react-immutable-proptypes'; import ImmutablePureComponent from 'react-immutable-pure-component'; import Permalink from 'flavours/glitch/components/permalink'; +import { displayMedia } from 'flavours/glitch/util/initial_state'; export default class MediaItem extends ImmutablePureComponent { @@ -9,8 +10,13 @@ export default class MediaItem extends ImmutablePureComponent { media: ImmutablePropTypes.map.isRequired, }; + state = { + visible: displayMedia !== 'hide_all' && !this.props.media.getIn(['status', 'sensitive']) || displayMedia === 'show_all', + }; + render () { const { media } = this.props; + const { visible } = this.state; const status = media.get('status'); const focusX = media.getIn(['meta', 'focus', 'x']); const focusY = media.getIn(['meta', 'focus', 'y']); @@ -18,21 +24,28 @@ export default class MediaItem extends ImmutablePureComponent { const y = ((focusY / -2) + .5) * 100; const style = {}; - let content; + let label, icon; if (media.get('type') === 'gifv') { - content = GIF; + label = GIF; } - if (!status.get('sensitive')) { + if (visible) { style.backgroundImage = `url(${media.get('preview_url')})`; style.backgroundPosition = `${x}% ${y}%`; + } else { + icon = ( + + + + ); } return (
- {content} + {icon} + {label}
); diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss index 3eddd7fb4..ea748b72b 100644 --- a/app/javascript/flavours/glitch/styles/components/accounts.scss +++ b/app/javascript/flavours/glitch/styles/components/accounts.scss @@ -415,7 +415,7 @@ background-size: cover; background-position: center; position: absolute; - color: inherit; + color: $ui-primary-color; text-decoration: none; border-radius: 4px; @@ -434,6 +434,14 @@ } } } + + &__icons { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + font-size: 24px; + } } .account__section-headline { -- cgit From bd1f08fa9a15ce1d40760b0321c370cb38232397 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 2 Oct 2018 15:50:19 +0200 Subject: Fix account gallery hidden media background color in mastodon-light --- app/javascript/flavours/glitch/styles/mastodon-light/diff.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss index aba8baf70..55a8983e5 100644 --- a/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss +++ b/app/javascript/flavours/glitch/styles/mastodon-light/diff.scss @@ -84,7 +84,8 @@ // Change the background colors of media and video spoilers .media-spoiler, -.video-player__spoiler { +.video-player__spoiler, +.account-gallery__item a { background: $ui-base-color; } -- cgit From d82c495c0fcfe259f0b52386349a01a89c3e13cb Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 2 Oct 2018 15:54:25 +0200 Subject: Add media description (or status spoiler) in account media gallery --- .../glitch/features/account_gallery/components/media_item.js | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js index 2e48ab799..3740b614f 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js +++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js @@ -24,7 +24,7 @@ export default class MediaItem extends ImmutablePureComponent { const y = ((focusY / -2) + .5) * 100; const style = {}; - let label, icon; + let label, icon, title; if (media.get('type') === 'gifv') { label = GIF; @@ -33,17 +33,24 @@ export default class MediaItem extends ImmutablePureComponent { if (visible) { style.backgroundImage = `url(${media.get('preview_url')})`; style.backgroundPosition = `${x}% ${y}%`; + title = media.get('description'); } else { icon = ( ); + title = status.get('spoiler_text') || media.get('description'); } return (
- + {icon} {label} -- cgit From a9e8f98a9d32c57956d41009bd09a1f33310676e Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Tue, 2 Oct 2018 16:01:28 +0200 Subject: Make hidden media clickable in account media gallery --- app/javascript/flavours/glitch/components/permalink.js | 15 ++++++++++++--- .../features/account_gallery/components/media_item.js | 10 ++++++++++ .../flavours/glitch/styles/components/accounts.scss | 1 + 3 files changed, 23 insertions(+), 3 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/components/permalink.js b/app/javascript/flavours/glitch/components/permalink.js index d6556b584..1ea6a2915 100644 --- a/app/javascript/flavours/glitch/components/permalink.js +++ b/app/javascript/flavours/glitch/components/permalink.js @@ -12,12 +12,20 @@ export default class Permalink extends React.PureComponent { href: PropTypes.string.isRequired, to: PropTypes.string.isRequired, children: PropTypes.node, + onInterceptClick: PropTypes.func, }; handleClick = (e) => { - if (this.context.router && e.button === 0 && !(e.ctrlKey || e.metaKey)) { - e.preventDefault(); - this.context.router.history.push(this.props.to); + if (e.button === 0 && !(e.ctrlKey || e.metaKey)) { + if (this.props.onInterceptClick && this.props.onInterceptClick()) { + e.preventDefault(); + return; + } + + if (this.context.router) { + e.preventDefault(); + this.context.router.history.push(this.props.to); + } } } @@ -27,6 +35,7 @@ export default class Permalink extends React.PureComponent { className, href, to, + onInterceptClick, ...other } = this.props; diff --git a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js index 3740b614f..89778e123 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js +++ b/app/javascript/flavours/glitch/features/account_gallery/components/media_item.js @@ -14,6 +14,15 @@ export default class MediaItem extends ImmutablePureComponent { visible: displayMedia !== 'hide_all' && !this.props.media.getIn(['status', 'sensitive']) || displayMedia === 'show_all', }; + handleClick = () => { + if (!this.state.visible) { + this.setState({ visible: true }); + return true; + } + + return false; + } + render () { const { media } = this.props; const { visible } = this.state; @@ -50,6 +59,7 @@ export default class MediaItem extends ImmutablePureComponent { href={status.get('url')} style={style} title={title} + onInterceptClick={this.handleClick} > {icon} {label} diff --git a/app/javascript/flavours/glitch/styles/components/accounts.scss b/app/javascript/flavours/glitch/styles/components/accounts.scss index ea748b72b..d87cd9c43 100644 --- a/app/javascript/flavours/glitch/styles/components/accounts.scss +++ b/app/javascript/flavours/glitch/styles/components/accounts.scss @@ -423,6 +423,7 @@ &:active, &:focus { outline: 0; + color: $ui-secondary-color; &::before { content: ""; -- cgit From c6e4c489425bd3b66a07d37f39e1678d69226fa8 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Fri, 5 Oct 2018 17:46:35 +0200 Subject: [Glitch] Add a confirmation dialog when hitting reply and the compose box isn't empty --- .../flavours/glitch/containers/status_container.js | 15 ++++++++++++++- app/javascript/flavours/glitch/features/status/index.js | 15 ++++++++++++++- 2 files changed, 28 insertions(+), 2 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/containers/status_container.js b/app/javascript/flavours/glitch/containers/status_container.js index 5ac92ea39..663bfbebc 100644 --- a/app/javascript/flavours/glitch/containers/status_container.js +++ b/app/javascript/flavours/glitch/containers/status_container.js @@ -31,6 +31,8 @@ const messages = defineMessages({ redraftConfirm: { id: 'confirmations.redraft.confirm', defaultMessage: 'Delete & redraft' }, redraftMessage: { id: 'confirmations.redraft.message', defaultMessage: 'Are you sure you want to delete this status and re-draft it? You will lose all replies, boosts and favourites to it.' }, blockConfirm: { id: 'confirmations.block.confirm', defaultMessage: 'Block' }, + replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' }, + replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' }, }); const makeMapStateToProps = () => { @@ -67,7 +69,18 @@ const makeMapStateToProps = () => { const mapDispatchToProps = (dispatch, { intl }) => ({ onReply (status, router) { - dispatch(replyCompose(status, router)); + dispatch((_, getState) => { + let state = getState(); + if (state.getIn(['compose', 'text']).trim().length !== 0) { + dispatch(openModal('CONFIRM', { + message: intl.formatMessage(messages.replyMessage), + confirm: intl.formatMessage(messages.replyConfirm), + onConfirm: () => dispatch(replyCompose(status, router)), + })); + } else { + dispatch(replyCompose(status, router)); + } + }); }, onModalReblog (status) { diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js index 5759a575c..b3147a2fa 100644 --- a/app/javascript/flavours/glitch/features/status/index.js +++ b/app/javascript/flavours/glitch/features/status/index.js @@ -50,6 +50,8 @@ const messages = defineMessages({ revealAll: { id: 'status.show_more_all', defaultMessage: 'Show more for all' }, hideAll: { id: 'status.show_less_all', defaultMessage: 'Show less for all' }, detailedStatus: { id: 'status.detailed_status', defaultMessage: 'Detailed conversation view' }, + replyConfirm: { id: 'confirmations.reply.confirm', defaultMessage: 'Reply' }, + replyMessage: { id: 'confirmations.reply.message', defaultMessage: 'Replying now will overwrite the message you are currently composing. Are you sure you want to proceed?' }, }); const makeMapStateToProps = () => { @@ -60,6 +62,7 @@ const makeMapStateToProps = () => { settings: state.get('local_settings'), ancestorsIds: state.getIn(['contexts', 'ancestors', props.params.statusId]), descendantsIds: state.getIn(['contexts', 'descendants', props.params.statusId]), + askReplyConfirmation: state.getIn(['compose', 'text']).trim().length !== 0, }); return mapStateToProps; @@ -81,6 +84,7 @@ export default class Status extends ImmutablePureComponent { ancestorsIds: ImmutablePropTypes.list, descendantsIds: ImmutablePropTypes.list, intl: PropTypes.object.isRequired, + askReplyConfirmation: PropTypes.bool, }; state = { @@ -140,7 +144,16 @@ export default class Status extends ImmutablePureComponent { } handleReplyClick = (status) => { - this.props.dispatch(replyCompose(status, this.context.router.history)); + let { askReplyConfirmation, dispatch, intl } = this.props; + if (askReplyConfirmation) { + dispatch(openModal('CONFIRM', { + message: intl.formatMessage(messages.replyMessage), + confirm: intl.formatMessage(messages.replyConfirm), + onConfirm: () => dispatch(replyCompose(status, this.context.router.history)), + })); + } else { + dispatch(replyCompose(status, this.context.router.history)); + } } handleModalReblog = (status) => { -- cgit From 7cc78431092edb0996372bc93bbc398a34af2395 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Sat, 6 Oct 2018 18:53:49 +0200 Subject: Do not scroll timelines when *closing* media modals Media modals push an history state so that pressing back on mobile closes them. We made sure to not scroll when opening them, but not when *closing* them, which caused some issues in rare cases. --- app/javascript/flavours/glitch/components/scrollable_list.js | 1 + app/javascript/flavours/glitch/features/account_gallery/index.js | 3 ++- app/javascript/flavours/glitch/features/blocks/index.js | 3 ++- app/javascript/flavours/glitch/features/favourites/index.js | 1 + app/javascript/flavours/glitch/features/follow_requests/index.js | 1 + app/javascript/flavours/glitch/features/followers/index.js | 1 + app/javascript/flavours/glitch/features/following/index.js | 3 ++- app/javascript/flavours/glitch/features/mutes/index.js | 1 + app/javascript/flavours/glitch/features/reblogs/index.js | 1 + app/javascript/flavours/glitch/features/status/index.js | 3 ++- 10 files changed, 14 insertions(+), 4 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/components/scrollable_list.js b/app/javascript/flavours/glitch/components/scrollable_list.js index a677cbf5b..3ee710dc9 100644 --- a/app/javascript/flavours/glitch/components/scrollable_list.js +++ b/app/javascript/flavours/glitch/components/scrollable_list.js @@ -150,6 +150,7 @@ export default class ScrollableList extends PureComponent { } defaultShouldUpdateScroll = (prevRouterProps, { location }) => { + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; return !(location.state && location.state.mastodonModalOpen); } diff --git a/app/javascript/flavours/glitch/features/account_gallery/index.js b/app/javascript/flavours/glitch/features/account_gallery/index.js index de8318964..53b906d16 100644 --- a/app/javascript/flavours/glitch/features/account_gallery/index.js +++ b/app/javascript/flavours/glitch/features/account_gallery/index.js @@ -90,7 +90,8 @@ export default class AccountGallery extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { - return !(location.state && location.state.mastodonModalOpen) + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; + return !(location.state && location.state.mastodonModalOpen); } render () { diff --git a/app/javascript/flavours/glitch/features/blocks/index.js b/app/javascript/flavours/glitch/features/blocks/index.js index 4c8b16504..386a0ce63 100644 --- a/app/javascript/flavours/glitch/features/blocks/index.js +++ b/app/javascript/flavours/glitch/features/blocks/index.js @@ -43,7 +43,8 @@ export default class Blocks extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { - return !(location.state && location.state.mastodonModalOpen) + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; + return !(location.state && location.state.mastodonModalOpen); } render () { diff --git a/app/javascript/flavours/glitch/features/favourites/index.js b/app/javascript/flavours/glitch/features/favourites/index.js index cf8b31eb3..65cd4a19b 100644 --- a/app/javascript/flavours/glitch/features/favourites/index.js +++ b/app/javascript/flavours/glitch/features/favourites/index.js @@ -34,6 +34,7 @@ export default class Favourites extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; return !(location.state && location.state.mastodonModalOpen); } diff --git a/app/javascript/flavours/glitch/features/follow_requests/index.js b/app/javascript/flavours/glitch/features/follow_requests/index.js index 1e4633984..bce6338ea 100644 --- a/app/javascript/flavours/glitch/features/follow_requests/index.js +++ b/app/javascript/flavours/glitch/features/follow_requests/index.js @@ -43,6 +43,7 @@ export default class FollowRequests extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; return !(location.state && location.state.mastodonModalOpen); } diff --git a/app/javascript/flavours/glitch/features/followers/index.js b/app/javascript/flavours/glitch/features/followers/index.js index cdde1775c..a977142ed 100644 --- a/app/javascript/flavours/glitch/features/followers/index.js +++ b/app/javascript/flavours/glitch/features/followers/index.js @@ -57,6 +57,7 @@ export default class Followers extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; return !(location.state && location.state.mastodonModalOpen); } diff --git a/app/javascript/flavours/glitch/features/following/index.js b/app/javascript/flavours/glitch/features/following/index.js index e7a72d036..70aeefaad 100644 --- a/app/javascript/flavours/glitch/features/following/index.js +++ b/app/javascript/flavours/glitch/features/following/index.js @@ -57,7 +57,8 @@ export default class Following extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { - return !(location.state && location.state.mastodonModalOpen) + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; + return !(location.state && location.state.mastodonModalOpen); } render () { diff --git a/app/javascript/flavours/glitch/features/mutes/index.js b/app/javascript/flavours/glitch/features/mutes/index.js index d94c1d8ad..bbcbea701 100644 --- a/app/javascript/flavours/glitch/features/mutes/index.js +++ b/app/javascript/flavours/glitch/features/mutes/index.js @@ -43,6 +43,7 @@ export default class Mutes extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; return !(location.state && location.state.mastodonModalOpen); } diff --git a/app/javascript/flavours/glitch/features/reblogs/index.js b/app/javascript/flavours/glitch/features/reblogs/index.js index c0a65d1de..75f8390a1 100644 --- a/app/javascript/flavours/glitch/features/reblogs/index.js +++ b/app/javascript/flavours/glitch/features/reblogs/index.js @@ -34,6 +34,7 @@ export default class Reblogs extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; return !(location.state && location.state.mastodonModalOpen); } diff --git a/app/javascript/flavours/glitch/features/status/index.js b/app/javascript/flavours/glitch/features/status/index.js index b3147a2fa..4382748d5 100644 --- a/app/javascript/flavours/glitch/features/status/index.js +++ b/app/javascript/flavours/glitch/features/status/index.js @@ -364,7 +364,8 @@ export default class Status extends ImmutablePureComponent { } shouldUpdateScroll = (prevRouterProps, { location }) => { - return !(location.state && location.state.mastodonModalOpen) + if ((((prevRouterProps || {}).location || {}).state || {}).mastodonModalOpen) return false; + return !(location.state && location.state.mastodonModalOpen); } render () { -- cgit From b4ba1058b870ceee27a8c94aab380e4a964d9ad9 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Sun, 7 Oct 2018 20:44:02 +0200 Subject: [Glitch] RTL: fix margins of public-account-header__tabs Port 185cb2dc3aac59ee27aa962fff48b064bd638567 to glitch-soc --- app/javascript/flavours/glitch/styles/rtl.scss | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/rtl.scss b/app/javascript/flavours/glitch/styles/rtl.scss index 23953304a..70aaa5bb1 100644 --- a/app/javascript/flavours/glitch/styles/rtl.scss +++ b/app/javascript/flavours/glitch/styles/rtl.scss @@ -306,5 +306,10 @@ body.rtl { margin-right: 0; } } + + .public-account-header__tabs { + margin-left: 0; + margin-right: 20px; + } } } -- cgit From a3677a828d4e52b09422d4f800f3482785b03243 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Sun, 7 Oct 2018 20:51:50 +0200 Subject: [Glitch] Change documentation URL Port 28401962caff028f328d674878e1f0abd16ffdfd to glitch-soc --- app/javascript/flavours/glitch/features/getting_started/index.js | 9 +++------ .../flavours/glitch/features/ui/components/onboarding_modal.js | 2 +- 2 files changed, 4 insertions(+), 7 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/getting_started/index.js b/app/javascript/flavours/glitch/features/getting_started/index.js index 09dcbe716..c1897cc33 100644 --- a/app/javascript/flavours/glitch/features/getting_started/index.js +++ b/app/javascript/flavours/glitch/features/getting_started/index.js @@ -165,13 +165,10 @@ export default class GettingStarted extends ImmutablePureComponent {

- - + +  •  - - -  •  - +

diff --git a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.js b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.js index 4c910daec..16355a446 100644 --- a/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.js +++ b/app/javascript/flavours/glitch/features/ui/components/onboarding_modal.js @@ -133,7 +133,7 @@ const PageSix = ({ admin, domain }) => {

{adminSection}

fork, Mastodon: Mastodon, github: GitHub }} />

-

}} />

+

}} />

); -- cgit From faecb35fe0197ddc025b971aa9538d5ddbdea713 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 17:40:56 +0200 Subject: Switch from selects to radio buttons for local settings, improve styling --- .../features/local_settings/page/item/index.js | 93 ++++++++++++---------- .../glitch/styles/components/local_settings.scss | 25 +++++- 2 files changed, 70 insertions(+), 48 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js index fe237f11e..eacc7419c 100644 --- a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js @@ -48,57 +48,62 @@ export default class LocalSettingsPageItem extends React.PureComponent { if (options && options.length > 0) { const currentValue = settings.getIn(item); - const optionElems = options && options.length > 0 && options.map((opt) => ( - - )); - return ( - + checked={ currentValue === opt.value } + disabled={!enabled} + /> + {opt.message} + + ); + }); + return ( +
+
+ {children} + {optionElems} +
+
); } else if (placeholder) { return ( - +
+ +
); } else return ( - +
+ +
); } diff --git a/app/javascript/flavours/glitch/styles/components/local_settings.scss b/app/javascript/flavours/glitch/styles/components/local_settings.scss index 9cd4e1fbe..a6e5c9892 100644 --- a/app/javascript/flavours/glitch/styles/components/local_settings.scss +++ b/app/javascript/flavours/glitch/styles/components/local_settings.scss @@ -11,8 +11,21 @@ max-height: 450px; overflow: hidden; - label { + label, legend { display: block; + font-size: 14px; + } + + .boolean label, .radio_buttons label { + position: relative; + padding-left: 28px; + padding-top: 3px; + + input { + position: absolute; + left: 0; + top: 0; + } } h1 { @@ -74,7 +87,11 @@ } .glitch.local-settings__page__item { - select { - margin-bottom: 5px; - } + margin-bottom: 2px; +} + +.glitch.local-settings__page__item.string, +.glitch.local-settings__page__item.radio_buttons { + margin-top: 10px; + margin-bottom: 10px; } -- cgit From 96c3d26870d4c8db1978c86b259e85d060d6f271 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 19:21:36 +0200 Subject: Move “Show action buttons in collapsed toots” option MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../glitch/features/local_settings/page/index.js | 21 +++++++++------------ 1 file changed, 9 insertions(+), 12 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.js b/app/javascript/flavours/glitch/features/local_settings/page/index.js index ece80c4da..d7ac55e48 100644 --- a/app/javascript/flavours/glitch/features/local_settings/page/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/page/index.js @@ -186,6 +186,15 @@ export default class LocalSettingsPage extends React.PureComponent { > + + +

-
-

- - - -
), ({ onChange, settings }) => ( -- cgit From d0b1369a853dc2e5b7934c148547f71f8d103859 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 8 Oct 2018 16:28:48 +0200 Subject: Fix app-wide hotkeys randomly failing to work --- app/javascript/flavours/glitch/features/ui/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js index ecbac1f8f..0a9beacab 100644 --- a/app/javascript/flavours/glitch/features/ui/index.js +++ b/app/javascript/flavours/glitch/features/ui/index.js @@ -456,7 +456,7 @@ export default class UI extends React.Component { }; return ( - +
{navbarUnder ? null : ()} -- cgit From edb9ec8543e49a8992ea76c04d6c595830996683 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 22:09:57 +0200 Subject: Add icons for each of the local-setting pages --- .../flavours/glitch/features/local_settings/navigation/index.js | 6 ++++++ .../glitch/features/local_settings/navigation/item/index.js | 8 +++++--- .../flavours/glitch/styles/components/local_settings.scss | 2 +- 3 files changed, 12 insertions(+), 4 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/local_settings/navigation/index.js b/app/javascript/flavours/glitch/features/local_settings/navigation/index.js index a992b1ffc..1a6485753 100644 --- a/app/javascript/flavours/glitch/features/local_settings/navigation/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/navigation/index.js @@ -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)} /> diff --git a/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.js b/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.js index b67d479e7..68a998b6c 100644 --- a/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/navigation/item/index.js @@ -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 ? : null; + const iconElem = icon ? : (textIcon ? {textIcon} : null); if (href) return ( - {iconElem} {title} + {iconElem} {title} ); else if (onNavigate) return ( @@ -57,7 +59,7 @@ export default class LocalSettingsPage extends React.PureComponent { tabIndex='0' className={finalClassName} > - {iconElem} {title} + {iconElem} {title} ); else return null; diff --git a/app/javascript/flavours/glitch/styles/components/local_settings.scss b/app/javascript/flavours/glitch/styles/components/local_settings.scss index a6e5c9892..288248f7c 100644 --- a/app/javascript/flavours/glitch/styles/components/local_settings.scss +++ b/app/javascript/flavours/glitch/styles/components/local_settings.scss @@ -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; -- cgit From 6cd793f0ac42a1af962de488f65cd207e55723d4 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 21:37:21 +0200 Subject: Change “preferences” icon to match settings page icon MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../flavours/glitch/features/local_settings/navigation/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/local_settings/navigation/index.js b/app/javascript/flavours/glitch/features/local_settings/navigation/index.js index 1a6485753..cf02101cf 100644 --- a/app/javascript/flavours/glitch/features/local_settings/navigation/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/navigation/index.js @@ -73,7 +73,7 @@ export default class LocalSettingsNavigation extends React.PureComponent { active={index === 5} href='/settings/preferences' index={5} - icon='cog' + icon='sliders' title={intl.formatMessage(messages.preferences)} /> Date: Mon, 1 Oct 2018 22:10:30 +0200 Subject: When screen width is too narrow, hide local-settings page text, keep only icons --- .../flavours/glitch/styles/components/local_settings.scss | 15 +++++++++++++++ 1 file changed, 15 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/components/local_settings.scss b/app/javascript/flavours/glitch/styles/components/local_settings.scss index 288248f7c..1adf54a1b 100644 --- a/app/javascript/flavours/glitch/styles/components/local_settings.scss +++ b/app/javascript/flavours/glitch/styles/components/local_settings.scss @@ -95,3 +95,18 @@ margin-top: 10px; margin-bottom: 10px; } + +@media screen and (max-width: 630px) { + .glitch.local-settings__navigation { + width: 40px; + flex-shrink: 0; + } + + .glitch.local-settings__navigation__item { + padding: 10px; + + span:last-of-type { + display: none; + } + } +} -- cgit From 26409f3e8e00b9d8fb2c072951068e7628128baa Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 22:11:11 +0200 Subject: Add support for hints (or extended descriptions) in local-settings pages --- .../flavours/glitch/features/local_settings/page/item/index.js | 2 ++ app/javascript/flavours/glitch/styles/components/local_settings.scss | 5 +++++ 2 files changed, 7 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js index eacc7419c..66b937365 100644 --- a/app/javascript/flavours/glitch/features/local_settings/page/item/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/page/item/index.js @@ -17,6 +17,7 @@ export default class LocalSettingsPageItem extends React.PureComponent { options: PropTypes.arrayOf(PropTypes.shape({ value: PropTypes.string.isRequired, message: PropTypes.string.isRequired, + hint: PropTypes.string, })), settings: ImmutablePropTypes.map.isRequired, placeholder: PropTypes.string, @@ -62,6 +63,7 @@ export default class LocalSettingsPageItem extends React.PureComponent { disabled={!enabled} /> {opt.message} + {opt.hint && {opt.hint}} ); }); diff --git a/app/javascript/flavours/glitch/styles/components/local_settings.scss b/app/javascript/flavours/glitch/styles/components/local_settings.scss index 1adf54a1b..75e7d370d 100644 --- a/app/javascript/flavours/glitch/styles/components/local_settings.scss +++ b/app/javascript/flavours/glitch/styles/components/local_settings.scss @@ -28,6 +28,11 @@ } } + span.hint { + display: block; + color: $lighter-text-color; + } + h1 { font-size: 18px; font-weight: 500; -- cgit From 721aec40cd2610a8c9c55da0d98068ffc718c073 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Mon, 1 Oct 2018 22:12:46 +0200 Subject: Define some local-settings hints --- .../flavours/glitch/features/local_settings/page/index.js | 11 ++++++++--- 1 file changed, 8 insertions(+), 3 deletions(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/local_settings/page/index.js b/app/javascript/flavours/glitch/features/local_settings/page/index.js index d7ac55e48..4f1b8525f 100644 --- a/app/javascript/flavours/glitch/features/local_settings/page/index.js +++ b/app/javascript/flavours/glitch/features/local_settings/page/index.js @@ -50,7 +50,8 @@ export default class LocalSettingsPage extends React.PureComponent { id='mastodon-settings--notifications-tab_badge' onChange={onChange} > - + + - + +
@@ -83,6 +85,7 @@ export default class LocalSettingsPage extends React.PureComponent { onChange={onChange} > + - + + + Date: Tue, 2 Oct 2018 00:17:22 +0200 Subject: Fix CW icon color in local-settings modal --- app/javascript/flavours/glitch/styles/components/local_settings.scss | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/styles/components/local_settings.scss b/app/javascript/flavours/glitch/styles/components/local_settings.scss index 75e7d370d..0b7a74575 100644 --- a/app/javascript/flavours/glitch/styles/components/local_settings.scss +++ b/app/javascript/flavours/glitch/styles/components/local_settings.scss @@ -60,6 +60,11 @@ outline: none; transition: background .3s; + .text-icon-button { + color: inherit; + transition: unset; + } + &:hover { background: $ui-secondary-color; } -- cgit From bb1103d9742f088252f8156968a474ca8a58b087 Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Wed, 10 Oct 2018 17:23:40 +0200 Subject: Really fix HotKeys --- app/javascript/flavours/glitch/features/ui/index.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/features/ui/index.js b/app/javascript/flavours/glitch/features/ui/index.js index 0a9beacab..510bb9540 100644 --- a/app/javascript/flavours/glitch/features/ui/index.js +++ b/app/javascript/flavours/glitch/features/ui/index.js @@ -456,7 +456,7 @@ export default class UI extends React.Component { }; return ( - +
{navbarUnder ? null : ()} -- cgit From 70d346ea951ebfa002225759310d72882a435a5c Mon Sep 17 00:00:00 2001 From: Thibaut Girka Date: Fri, 12 Oct 2018 23:12:39 +0200 Subject: Fix auto-unfold CWs when no regexp is set Fixes #778 --- app/javascript/flavours/glitch/util/content_warning.js | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'app/javascript/flavours') diff --git a/app/javascript/flavours/glitch/util/content_warning.js b/app/javascript/flavours/glitch/util/content_warning.js index 29e221c8e..5e874a49c 100644 --- a/app/javascript/flavours/glitch/util/content_warning.js +++ b/app/javascript/flavours/glitch/util/content_warning.js @@ -4,6 +4,11 @@ export function autoUnfoldCW (settings, status) { } const rawRegex = settings.getIn(['content_warnings', 'filter']); + + if (!rawRegex) { + return true; + } + let regex = null; try { -- cgit