From 219aac7800a086a75f3ef36f71955bb8b6ccc2c0 Mon Sep 17 00:00:00 2001
From: abcang <abcang1015@gmail.com>
Date: Mon, 5 Mar 2018 04:29:12 +0900
Subject: Show media on report UI (#6619)

---
 app/javascript/styles/mastodon/components.scss | 27 ++++++++++++++++++++------
 1 file changed, 21 insertions(+), 6 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 626f51534..a0ff0953b 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -862,12 +862,27 @@
   border-bottom: 1px solid $ui-secondary-color;
   display: flex;
 
-  .status__content {
-    flex: 1 1 auto;
-    padding: 10px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
+  .status-check-box__status {
+    margin: 10px 0 10px 10px;
+    flex: 1;
+
+    .media-gallery {
+      max-width: 250px;
+    }
+
+    .status__content {
+      padding: 0;
+      white-space: normal;
+    }
+
+    .video-player {
+      margin-top: 8px;
+      max-width: 250px;
+    }
+
+    .media-gallery__item-thumbnail {
+      cursor: default;
+    }
   }
 }
 
-- 
cgit 


From 4e929b2d173fa22b722c58c0e9f8223eb4f44b0e Mon Sep 17 00:00:00 2001
From: Yuto Tokunaga <yuntan.sub1@gmail.com>
Date: Mon, 5 Mar 2018 04:32:24 +0900
Subject: [RFC] Improved media modal (#5956)

* Improved media modal

ImageLoader: Impliment pinch zoom by CSS `transform: scale(X)`
ImageLoader: Impliment panning by CSS `overflow: scroll`
ImageLoader: Larger image
MediaModal: Larger close button
MediaModal: Close the modal by swiping vertically
MediaModal: Show/hide close button and right/left navigation on tapping image
MediaModal: Change the `pointer-event` CSS prpp to get more blank space to close the modal
ImageLoader: Zoom/reset zoom on double tap
MediaModal: disable vertical swiping while horizontally swiped
ImageLoader: prevent propagating touchmove event to MediaModal
MediaModal: Adjust size and potision of buttons
ImageLoader: Adjust scroll potision on pinch zoom

* Remove "swipe to close" and "double tap to zoom" features

* remove unused prop and functions

removed `onScroll` prop and `handleScroll` func in ImageLoader

* separate zoom functionary to ZoomableImage component

adjust styling of ImageLoader
add styling for ZoomableImage

* adjust size and potision of close button of media modal

* Fix for gif video

add `onClick` prop to ExtendedVideoPlayer
specify `onClick` prop to video tag for switching nav of `MediaModal`
add `.video-modal` class to scss to separate styling for `VideoModal`

* fix styling for centering

specify height of `ZoomableImage` by pixel
clean styling for `ImageLoader`

* fix lint errors

* small fix

* fixed designated parts
---
 .../mastodon/components/extended_video_player.js   |   8 ++
 .../features/ui/components/image_loader.js         |  32 +++--
 .../mastodon/features/ui/components/media_modal.js |  84 +++++++++---
 .../mastodon/features/ui/components/video_modal.js |   2 +-
 .../features/ui/components/zoomable_image.js       | 151 +++++++++++++++++++++
 app/javascript/styles/mastodon/components.scss     | 146 +++++++++++---------
 6 files changed, 330 insertions(+), 93 deletions(-)
 create mode 100644 app/javascript/mastodon/features/ui/components/zoomable_image.js

(limited to 'app/javascript/styles')

diff --git a/app/javascript/mastodon/components/extended_video_player.js b/app/javascript/mastodon/components/extended_video_player.js
index f8bd067e8..9e2f6835a 100644
--- a/app/javascript/mastodon/components/extended_video_player.js
+++ b/app/javascript/mastodon/components/extended_video_player.js
@@ -11,6 +11,7 @@ export default class ExtendedVideoPlayer extends React.PureComponent {
     time: PropTypes.number,
     controls: PropTypes.bool.isRequired,
     muted: PropTypes.bool.isRequired,
+    onClick: PropTypes.func,
   };
 
   handleLoadedData = () => {
@@ -31,6 +32,12 @@ export default class ExtendedVideoPlayer extends React.PureComponent {
     this.video = c;
   }
 
+  handleClick = e => {
+    e.stopPropagation();
+    const handler = this.props.onClick;
+    if (handler) handler();
+  }
+
   render () {
     const { src, muted, controls, alt } = this.props;
 
@@ -46,6 +53,7 @@ export default class ExtendedVideoPlayer extends React.PureComponent {
           muted={muted}
           controls={controls}
           loop={!controls}
+          onClick={this.handleClick}
         />
       </div>
     );
diff --git a/app/javascript/mastodon/features/ui/components/image_loader.js b/app/javascript/mastodon/features/ui/components/image_loader.js
index e3e7197c5..c7360a726 100644
--- a/app/javascript/mastodon/features/ui/components/image_loader.js
+++ b/app/javascript/mastodon/features/ui/components/image_loader.js
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import classNames from 'classnames';
+import ZoomableImage from './zoomable_image';
 
 export default class ImageLoader extends React.PureComponent {
 
@@ -10,6 +11,7 @@ export default class ImageLoader extends React.PureComponent {
     previewSrc: PropTypes.string,
     width: PropTypes.number,
     height: PropTypes.number,
+    onClick: PropTypes.func,
   }
 
   static defaultProps = {
@@ -24,6 +26,7 @@ export default class ImageLoader extends React.PureComponent {
   }
 
   removers = [];
+  canvas = null;
 
   get canvasContext() {
     if (!this.canvas) {
@@ -43,6 +46,10 @@ export default class ImageLoader extends React.PureComponent {
     }
   }
 
+  componentWillUnmount () {
+    this.removeEventListeners();
+  }
+
   loadImage (props) {
     this.removeEventListeners();
     this.setState({ loading: true, error: false });
@@ -118,7 +125,7 @@ export default class ImageLoader extends React.PureComponent {
   }
 
   render () {
-    const { alt, src, width, height } = this.props;
+    const { alt, src, width, height, onClick } = this.props;
     const { loading } = this.state;
 
     const className = classNames('image-loader', {
@@ -128,22 +135,19 @@ export default class ImageLoader extends React.PureComponent {
 
     return (
       <div className={className}>
-        <canvas
-          className='image-loader__preview-canvas'
-          width={width}
-          height={height}
-          ref={this.setCanvasRef}
-          style={{ opacity: loading ? 1 : 0 }}
-        />
-
-        {!loading && (
-          <img
-            alt={alt}
-            className='image-loader__img'
-            src={src}
+        {loading ? (
+          <canvas
+            className='image-loader__preview-canvas'
+            ref={this.setCanvasRef}
             width={width}
             height={height}
           />
+        ) : (
+          <ZoomableImage
+            alt={alt}
+            src={src}
+            onClick={onClick}
+          />
         )}
       </div>
     );
diff --git a/app/javascript/mastodon/features/ui/components/media_modal.js b/app/javascript/mastodon/features/ui/components/media_modal.js
index 02591a51f..72ef32256 100644
--- a/app/javascript/mastodon/features/ui/components/media_modal.js
+++ b/app/javascript/mastodon/features/ui/components/media_modal.js
@@ -3,6 +3,7 @@ import ReactSwipeableViews from 'react-swipeable-views';
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import PropTypes from 'prop-types';
 import ExtendedVideoPlayer from '../../../components/extended_video_player';
+import classNames from 'classnames';
 import { defineMessages, injectIntl } from 'react-intl';
 import IconButton from '../../../components/icon_button';
 import ImmutablePureComponent from 'react-immutable-pure-component';
@@ -26,6 +27,7 @@ export default class MediaModal extends ImmutablePureComponent {
 
   state = {
     index: null,
+    navigationHidden: false,
   };
 
   handleSwipe = (index) => {
@@ -68,14 +70,21 @@ export default class MediaModal extends ImmutablePureComponent {
     return this.state.index !== null ? this.state.index : this.props.index;
   }
 
+  toggleNavigation = () => {
+    this.setState(prevState => ({
+      navigationHidden: !prevState.navigationHidden,
+    }));
+  };
+
   render () {
     const { media, intl, onClose } = this.props;
+    const { navigationHidden } = this.state;
 
     const index = this.getIndex();
     let pagination = [];
 
-    const leftNav  = media.size > 1 && <button tabIndex='0' className='modal-container__nav modal-container__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><i className='fa fa-fw fa-chevron-left' /></button>;
-    const rightNav = media.size > 1 && <button tabIndex='0' className='modal-container__nav  modal-container__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><i className='fa fa-fw fa-chevron-right' /></button>;
+    const leftNav  = media.size > 1 && <button tabIndex='0' className='media-modal__nav media-modal__nav--left' onClick={this.handlePrevClick} aria-label={intl.formatMessage(messages.previous)}><i className='fa fa-fw fa-chevron-left' /></button>;
+    const rightNav = media.size > 1 && <button tabIndex='0' className='media-modal__nav  media-modal__nav--right' onClick={this.handleNextClick} aria-label={intl.formatMessage(messages.next)}><i className='fa fa-fw fa-chevron-right' /></button>;
 
     if (media.size > 1) {
       pagination = media.map((item, i) => {
@@ -92,9 +101,30 @@ export default class MediaModal extends ImmutablePureComponent {
       const height = image.getIn(['meta', 'original', 'height']) || null;
 
       if (image.get('type') === 'image') {
-        return <ImageLoader previewSrc={image.get('preview_url')} src={image.get('url')} width={width} height={height} alt={image.get('description')} key={image.get('url')} />;
+        return (
+          <ImageLoader
+            previewSrc={image.get('preview_url')}
+            src={image.get('url')}
+            width={width}
+            height={height}
+            alt={image.get('description')}
+            key={image.get('url')}
+            onClick={this.toggleNavigation}
+          />
+        );
       } else if (image.get('type') === 'gifv') {
-        return <ExtendedVideoPlayer src={image.get('url')} muted controls={false} width={width} height={height} key={image.get('preview_url')} alt={image.get('description')} />;
+        return (
+          <ExtendedVideoPlayer
+            src={image.get('url')}
+            muted
+            controls={false}
+            width={width}
+            height={height}
+            key={image.get('preview_url')}
+            alt={image.get('description')}
+            onClick={this.toggleNavigation}
+          />
+        );
       }
 
       return null;
@@ -104,21 +134,43 @@ export default class MediaModal extends ImmutablePureComponent {
       alignItems: 'center', // center vertically
     };
 
+    const navigationClassName = classNames('media-modal__navigation', {
+      'media-modal__navigation--hidden': navigationHidden,
+    });
+
     return (
       <div className='modal-root__modal media-modal'>
-        {leftNav}
-
-        <div className='media-modal__content'>
-          <IconButton className='media-modal__close' title={intl.formatMessage(messages.close)} icon='times' onClick={onClose} size={16} />
-          <ReactSwipeableViews containerStyle={containerStyle} onChangeIndex={this.handleSwipe} index={index}>
-            {content}
-          </ReactSwipeableViews>
+        <div
+          className='media-modal__closer'
+          role='presentation'
+          onClick={onClose}
+        >
+          <div className='media-modal__content'>
+            <ReactSwipeableViews
+              style={{
+                // you can't use 100vh, because the viewport height is taller
+                // than the visible part of the document in some mobile
+                // browsers when it's address bar is visible.
+                // https://developers.google.com/web/updates/2016/12/url-bar-resizing
+                height: `${document.body.clientHeight}px`,
+              }}
+              containerStyle={containerStyle}
+              onChangeIndex={this.handleSwipe}
+              onSwitching={this.handleSwitching}
+              index={index}
+            >
+              {content}
+            </ReactSwipeableViews>
+          </div>
+        </div>
+        <div className={navigationClassName}>
+          <IconButton className='media-modal__close' title={intl.formatMessage(messages.close)} icon='times' onClick={onClose} size={40} />
+          {leftNav}
+          {rightNav}
+          <ul className='media-modal__pagination'>
+            {pagination}
+          </ul>
         </div>
-        <ul className='media-modal__pagination'>
-          {pagination}
-        </ul>
-
-        {rightNav}
       </div>
     );
   }
diff --git a/app/javascript/mastodon/features/ui/components/video_modal.js b/app/javascript/mastodon/features/ui/components/video_modal.js
index 6a883759f..9ed4a43ad 100644
--- a/app/javascript/mastodon/features/ui/components/video_modal.js
+++ b/app/javascript/mastodon/features/ui/components/video_modal.js
@@ -16,7 +16,7 @@ export default class VideoModal extends ImmutablePureComponent {
     const { media, time, onClose } = this.props;
 
     return (
-      <div className='modal-root__modal media-modal'>
+      <div className='modal-root__modal video-modal'>
         <div>
           <Video
             preview={media.get('preview_url')}
diff --git a/app/javascript/mastodon/features/ui/components/zoomable_image.js b/app/javascript/mastodon/features/ui/components/zoomable_image.js
new file mode 100644
index 000000000..0a0a4d41a
--- /dev/null
+++ b/app/javascript/mastodon/features/ui/components/zoomable_image.js
@@ -0,0 +1,151 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+
+const MIN_SCALE = 1;
+const MAX_SCALE = 4;
+
+const getMidpoint = (p1, p2) => ({
+  x: (p1.clientX + p2.clientX) / 2,
+  y: (p1.clientY + p2.clientY) / 2,
+});
+
+const getDistance = (p1, p2) =>
+  Math.sqrt(Math.pow(p1.clientX - p2.clientX, 2) + Math.pow(p1.clientY - p2.clientY, 2));
+
+const clamp = (min, max, value) => Math.min(max, Math.max(min, value));
+
+export default class ZoomableImage extends React.PureComponent {
+
+  static propTypes = {
+    alt: PropTypes.string,
+    src: PropTypes.string.isRequired,
+    width: PropTypes.number,
+    height: PropTypes.number,
+    onClick: PropTypes.func,
+  }
+
+  static defaultProps = {
+    alt: '',
+    width: null,
+    height: null,
+  };
+
+  state = {
+    scale: MIN_SCALE,
+  }
+
+  removers = [];
+  container = null;
+  image = null;
+  lastTouchEndTime = 0;
+  lastDistance = 0;
+
+  componentDidMount () {
+    let handler = this.handleTouchStart;
+    this.container.addEventListener('touchstart', handler);
+    this.removers.push(() => this.container.removeEventListener('touchstart', handler));
+    handler = this.handleTouchMove;
+    // on Chrome 56+, touch event listeners will default to passive
+    // https://www.chromestatus.com/features/5093566007214080
+    this.container.addEventListener('touchmove', handler, { passive: false });
+    this.removers.push(() => this.container.removeEventListener('touchend', handler));
+  }
+
+  componentWillUnmount () {
+    this.removeEventListeners();
+  }
+
+  removeEventListeners () {
+    this.removers.forEach(listeners => listeners());
+    this.removers = [];
+  }
+
+  handleTouchStart = e => {
+    if (e.touches.length !== 2) return;
+
+    this.lastDistance = getDistance(...e.touches);
+  }
+
+  handleTouchMove = e => {
+    const { scrollTop, scrollHeight, clientHeight } = this.container;
+    if (e.touches.length === 1 && scrollTop !== scrollHeight - clientHeight) {
+      // prevent propagating event to MediaModal
+      e.stopPropagation();
+      return;
+    }
+    if (e.touches.length !== 2) return;
+
+    e.preventDefault();
+    e.stopPropagation();
+
+    const distance = getDistance(...e.touches);
+    const midpoint = getMidpoint(...e.touches);
+    const scale = clamp(MIN_SCALE, MAX_SCALE, this.state.scale * distance / this.lastDistance);
+
+    this.zoom(scale, midpoint);
+
+    this.lastMidpoint = midpoint;
+    this.lastDistance = distance;
+  }
+
+  zoom(nextScale, midpoint) {
+    const { scale } = this.state;
+    const { scrollLeft, scrollTop } = this.container;
+
+    // math memo:
+    // x = (scrollLeft + midpoint.x) / scrollWidth
+    // x' = (nextScrollLeft + midpoint.x) / nextScrollWidth
+    // scrollWidth = clientWidth * scale
+    // scrollWidth' = clientWidth * nextScale
+    // Solve x = x' for nextScrollLeft
+    const nextScrollLeft = (scrollLeft + midpoint.x) * nextScale / scale - midpoint.x;
+    const nextScrollTop = (scrollTop + midpoint.y) * nextScale / scale - midpoint.y;
+
+    this.setState({ scale: nextScale }, () => {
+      this.container.scrollLeft = nextScrollLeft;
+      this.container.scrollTop = nextScrollTop;
+    });
+  }
+
+  handleClick = e => {
+    // don't propagate event to MediaModal
+    e.stopPropagation();
+    const handler = this.props.onClick;
+    if (handler) handler();
+  }
+
+  setContainerRef = c => {
+    this.container = c;
+  }
+
+  setImageRef = c => {
+    this.image = c;
+  }
+
+  render () {
+    const { alt, src } = this.props;
+    const { scale } = this.state;
+    const overflow = scale === 1 ? 'hidden' : 'scroll';
+
+    return (
+      <div
+        className='zoomable-image'
+        ref={this.setContainerRef}
+        style={{ overflow }}
+      >
+        <img
+          role='presentation'
+          ref={this.setImageRef}
+          alt={alt}
+          src={src}
+          style={{
+            transform: `scale(${scale})`,
+            transformOrigin: '0 0',
+          }}
+          onClick={this.handleClick}
+        />
+      </div>
+    );
+  }
+
+}
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index a0ff0953b..bc6123cc7 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -1433,36 +1433,29 @@
 
 .image-loader {
   position: relative;
+  width: 100%;
+  height: 100%;
 
   &.image-loader--loading {
+    display: flex;
+    align-content: center;
+
     .image-loader__preview-canvas {
       filter: blur(2px);
     }
   }
 
-  .image-loader__img {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    max-width: 100%;
-    max-height: 100%;
-    background-image: none;
+  &.image-loader--amorphous .image-loader__preview-canvas {
+    display: none;
   }
+}
 
-  &.image-loader--amorphous {
-    position: static;
-
-    .image-loader__preview-canvas {
-      display: none;
-    }
-
-    .image-loader__img {
-      position: static;
-      width: auto;
-      height: auto;
-    }
-  }
+.zoomable-image {
+  position: relative;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-content: center;
 }
 
 .navigation-bar {
@@ -2799,29 +2792,6 @@ a.status-card {
   }
 }
 
-.modal-container__nav {
-  align-items: center;
-  background: rgba($base-overlay-background, 0.5);
-  box-sizing: border-box;
-  border: 0;
-  color: $primary-text-color;
-  cursor: pointer;
-  display: flex;
-  font-size: 24px;
-  height: 100%;
-  padding: 30px 15px;
-  position: absolute;
-  top: 0;
-}
-
-.modal-container__nav--left {
-  left: -61px;
-}
-
-.modal-container__nav--right {
-  right: -61px;
-}
-
 .account--follows-info {
   color: $primary-text-color;
   position: absolute;
@@ -3418,29 +3388,27 @@ a.status-card {
   z-index: 9999;
 }
 
+.video-modal {
+  max-width: 100vw;
+  max-height: 100vh;
+  position: relative;
+}
+
 .media-modal {
-  max-width: 80vw;
-  max-height: 80vh;
+  width: 100%;
+  height: 100%;
   position: relative;
 
-  .extended-video-player,
   img,
   canvas,
   video {
-    max-width: 80vw;
-    max-height: 80vh;
+    max-width: 100vw;
+    max-height: 100vh;
     width: auto;
     height: auto;
     margin: auto;
   }
 
-  .extended-video-player,
-  video {
-    display: flex;
-    width: 80vw;
-    height: 80vh;
-  }
-
   img,
   canvas {
     display: block;
@@ -3449,12 +3417,65 @@ a.status-card {
   }
 
   .react-swipeable-view-container {
-    max-width: 80vw;
+    width: 100vw;
+    height: 100%;
   }
 }
 
-.media-modal__content {
-  background: $base-overlay-background;
+.media-modal__closer {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+}
+
+.media-modal__navigation {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  pointer-events: none;
+  transition: opacity 0.3s linear;
+  will-change: opacity;
+
+  * {
+    pointer-events: auto;
+  }
+
+  &.media-modal__navigation--hidden {
+    opacity: 0;
+
+    * {
+      pointer-events: none;
+    }
+  }
+}
+
+.media-modal__nav {
+  background: rgba($base-overlay-background, 0.5);
+  box-sizing: border-box;
+  border: 0;
+  color: $primary-text-color;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  font-size: 24px;
+  height: 20vmax;
+  margin: auto 0;
+  padding: 30px 15px;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+}
+
+.media-modal__nav--left {
+  left: 0;
+}
+
+.media-modal__nav--right {
+  right: 0;
 }
 
 .media-modal__pagination {
@@ -3462,7 +3483,8 @@ a.status-card {
   text-align: center;
   position: absolute;
   left: 0;
-  bottom: -40px;
+  bottom: 20px;
+  pointer-events: none;
 }
 
 .media-modal__page-dot {
@@ -3486,8 +3508,8 @@ a.status-card {
 
 .media-modal__close {
   position: absolute;
-  right: 4px;
-  top: 4px;
+  right: 8px;
+  top: 8px;
   z-index: 100;
 }
 
-- 
cgit 


From 46a9a23749d58eb3ec415fef99da065ca69ea9fc Mon Sep 17 00:00:00 2001
From: ThibG <thib@sitedethib.com>
Date: Mon, 5 Mar 2018 05:09:35 +0100
Subject: Make more apparent that an account is blocked or muted (fixes #6544)
 (#6627)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Add button to unblock blocked accounts from their profile

* Add “Blocked” badge in place of “Follows you” when the user is blocked

* Add “Muted” badge (below “follows you” badge)
---
 .../mastodon/features/account/components/header.js       | 16 ++++++++++++++++
 .../features/account_timeline/components/header.js       |  1 +
 app/javascript/styles/mastodon/components.scss           | 16 ++++++++++++++++
 3 files changed, 33 insertions(+)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/mastodon/features/account/components/header.js b/app/javascript/mastodon/features/account/components/header.js
index b8605d11f..075bad3f7 100644
--- a/app/javascript/mastodon/features/account/components/header.js
+++ b/app/javascript/mastodon/features/account/components/header.js
@@ -13,6 +13,7 @@ const messages = defineMessages({
   unfollow: { id: 'account.unfollow', defaultMessage: 'Unfollow' },
   follow: { id: 'account.follow', defaultMessage: 'Follow' },
   requested: { id: 'account.requested', defaultMessage: 'Awaiting approval. Click to cancel follow request' },
+  unblock: { id: 'account.unblock', defaultMessage: 'Unblock @{name}' },
 });
 
 class Avatar extends ImmutablePureComponent {
@@ -69,6 +70,7 @@ export default class Header extends ImmutablePureComponent {
   static propTypes = {
     account: ImmutablePropTypes.map,
     onFollow: PropTypes.func.isRequired,
+    onBlock: PropTypes.func.isRequired,
     intl: PropTypes.object.isRequired,
   };
 
@@ -80,11 +82,18 @@ export default class Header extends ImmutablePureComponent {
     }
 
     let info        = '';
+    let mutingInfo  = '';
     let actionBtn   = '';
     let lockedIcon  = '';
 
     if (me !== account.get('id') && account.getIn(['relationship', 'followed_by'])) {
       info = <span className='account--follows-info'><FormattedMessage id='account.follows_you' defaultMessage='Follows you' /></span>;
+    } else if (me !== account.get('id') && account.getIn(['relationship', 'blocking'])) {
+      info = <span className='account--follows-info'><FormattedMessage id='account.blocked' defaultMessage='Blocked' /></span>;
+    }
+
+    if (me !== account.get('id') && account.getIn(['relationship', 'muting'])) {
+      mutingInfo = <span className='account--muting-info'><FormattedMessage id='account.muted' defaultMessage='Muted' /></span>;
     }
 
     if (me !== account.get('id')) {
@@ -100,6 +109,12 @@ export default class Header extends ImmutablePureComponent {
             <IconButton size={26} icon={account.getIn(['relationship', 'following']) ? 'user-times' : 'user-plus'} active={account.getIn(['relationship', 'following'])} title={intl.formatMessage(account.getIn(['relationship', 'following']) ? messages.unfollow : messages.follow)} onClick={this.props.onFollow} />
           </div>
         );
+      } else if (account.getIn(['relationship', 'blocking'])) {
+        actionBtn = (
+          <div className='account--action-button'>
+            <IconButton size={26} icon='unlock-alt' title={intl.formatMessage(messages.unblock, { name: account.get('username') })} onClick={this.props.onBlock} />
+          </div>
+        );
       }
     }
 
@@ -124,6 +139,7 @@ export default class Header extends ImmutablePureComponent {
           <div className='account__header__content' dangerouslySetInnerHTML={content} />
 
           {info}
+          {mutingInfo}
           {actionBtn}
         </div>
       </div>
diff --git a/app/javascript/mastodon/features/account_timeline/components/header.js b/app/javascript/mastodon/features/account_timeline/components/header.js
index b143e1d36..9d594fb0c 100644
--- a/app/javascript/mastodon/features/account_timeline/components/header.js
+++ b/app/javascript/mastodon/features/account_timeline/components/header.js
@@ -82,6 +82,7 @@ export default class Header extends ImmutablePureComponent {
         <InnerHeader
           account={account}
           onFollow={this.handleFollow}
+          onBlock={this.handleBlock}
         />
 
         <ActionBar
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index bc6123cc7..c8850dede 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -2808,6 +2808,22 @@ a.status-card {
   border-radius: 4px;
 }
 
+.account--muting-info {
+  color: $primary-text-color;
+  position: absolute;
+  top: 40px;
+  left: 10px;
+  opacity: 0.7;
+  display: inline-block;
+  vertical-align: top;
+  background-color: rgba($base-overlay-background, 0.4);
+  text-transform: uppercase;
+  font-size: 11px;
+  font-weight: 500;
+  padding: 4px;
+  border-radius: 4px;
+}
+
 .account--action-button {
   position: absolute;
   top: 10px;
-- 
cgit 


From cb74c0cfe4aa89f9656c054253665ef4965b41df Mon Sep 17 00:00:00 2001
From: Sylvhem <Sylvhem@users.noreply.github.com>
Date: Wed, 7 Mar 2018 01:39:40 +0100
Subject: Add headings to the security settings page (#6661)

* Changes the headings' rank of the security settings section

This commit changes the existing headings' rank of the security settings section from level 6 to level 4.

* Renames the auth.change_password string into auth.security

The "Security" preferences' section used to be called "Change password". When it was renamed, the string name wasn't changed.
This commits changes auth.change_password to auth.security.

* Adds a heading to the password change form

There was previously no heading for the part of the "Security" page that contain the password change form.
This commit adds a rank 4 heading to this section and reintroduces an "auth.change_password" string to be used inside it.

* Removes useless HR elements

The various sections of the "Security" settings page were previously separated by HR elements.
Now that there is proper headings, they're not required anymore.

* Updates CSS

This commit updates CSS in such a way that the same style is applied to all the H4 elements of the settings.

* Correct a mistake

A character went missing on one of the previous commits, broking the CSS.
This new commit fixes it.
---
 app/javascript/styles/mastodon/admin.scss        | 10 ++++++++++
 app/javascript/styles/mastodon/forms.scss        | 10 ----------
 app/views/auth/registrations/_sessions.html.haml |  2 +-
 app/views/auth/registrations/edit.html.haml      |  8 +++-----
 config/locales/ar.yml                            |  2 +-
 config/locales/bg.yml                            |  2 +-
 config/locales/ca.yml                            |  2 +-
 config/locales/de.yml                            |  2 +-
 config/locales/en.yml                            |  3 ++-
 config/locales/eo.yml                            |  2 +-
 config/locales/es.yml                            |  2 +-
 config/locales/fa.yml                            |  2 +-
 config/locales/fi.yml                            |  2 +-
 config/locales/fr.yml                            |  2 +-
 config/locales/gl.yml                            |  2 +-
 config/locales/he.yml                            |  2 +-
 config/locales/hr.yml                            |  2 +-
 config/locales/hu.yml                            |  2 +-
 config/locales/id.yml                            |  2 +-
 config/locales/io.yml                            |  2 +-
 config/locales/it.yml                            |  2 +-
 config/locales/ja.yml                            |  2 +-
 config/locales/ko.yml                            |  2 +-
 config/locales/nl.yml                            |  2 +-
 config/locales/no.yml                            |  2 +-
 config/locales/oc.yml                            |  2 +-
 config/locales/pl.yml                            |  2 +-
 config/locales/pt-BR.yml                         |  2 +-
 config/locales/pt.yml                            |  2 +-
 config/locales/ru.yml                            |  2 +-
 config/locales/sk.yml                            |  2 +-
 config/locales/sr-Latn.yml                       |  2 +-
 config/locales/sr.yml                            |  2 +-
 config/locales/sv.yml                            |  2 +-
 config/locales/th.yml                            |  2 +-
 config/locales/tr.yml                            |  2 +-
 config/locales/uk.yml                            |  2 +-
 config/locales/zh-CN.yml                         |  2 +-
 config/locales/zh-HK.yml                         |  2 +-
 config/locales/zh-TW.yml                         |  2 +-
 config/navigation.rb                             |  2 +-
 41 files changed, 52 insertions(+), 53 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/styles/mastodon/admin.scss b/app/javascript/styles/mastodon/admin.scss
index 0c343e1df..e6bd0c717 100644
--- a/app/javascript/styles/mastodon/admin.scss
+++ b/app/javascript/styles/mastodon/admin.scss
@@ -105,6 +105,16 @@
       margin-bottom: 30px;
     }
 
+    h4 {
+      text-transform: uppercase;
+      font-size: 13px;
+      font-weight: 500;
+      color: $ui-primary-color;
+      padding-bottom: 8px;
+      margin-bottom: 8px;
+      border-bottom: 1px solid lighten($ui-base-color, 8%);
+    }
+
     h6 {
       font-size: 16px;
       color: $ui-secondary-color;
diff --git a/app/javascript/styles/mastodon/forms.scss b/app/javascript/styles/mastodon/forms.scss
index 2e38cda4e..d74c5a4fd 100644
--- a/app/javascript/styles/mastodon/forms.scss
+++ b/app/javascript/styles/mastodon/forms.scss
@@ -22,16 +22,6 @@ code {
     margin-top: 4px;
   }
 
-  h4 {
-    text-transform: uppercase;
-    font-size: 13px;
-    font-weight: 500;
-    color: $ui-primary-color;
-    padding-bottom: 8px;
-    margin-bottom: 8px;
-    border-bottom: 1px solid lighten($ui-base-color, 8%);
-  }
-
   p.hint {
     margin-bottom: 15px;
     color: $ui-primary-color;
diff --git a/app/views/auth/registrations/_sessions.html.haml b/app/views/auth/registrations/_sessions.html.haml
index 8424a8901..8586c0549 100644
--- a/app/views/auth/registrations/_sessions.html.haml
+++ b/app/views/auth/registrations/_sessions.html.haml
@@ -1,4 +1,4 @@
-%h6= t 'sessions.title'
+%h4= t 'sessions.title'
 %p.muted-hint= t 'sessions.explanation'
 
 .table-wrapper
diff --git a/app/views/auth/registrations/edit.html.haml b/app/views/auth/registrations/edit.html.haml
index fac702b38..05fc7df31 100644
--- a/app/views/auth/registrations/edit.html.haml
+++ b/app/views/auth/registrations/edit.html.haml
@@ -1,6 +1,7 @@
 - content_for :page_title do
-  = t('auth.change_password')
+  = t('auth.security')
 
+%h4= t('auth.change_password')
 = simple_form_for(resource, as: resource_name, url: registration_path(resource_name), html: { method: :put, class: 'auth_edit' }) do |f|
   = render 'shared/error_messages', object: resource
 
@@ -15,12 +16,9 @@
   - else
     %p.hint= t('users.seamless_external_login')
 
-%hr/
-
 = render 'sessions'
 
 - if open_deletion?
-  %hr/
 
-  %h6= t('auth.delete_account')
+  %h4= t('auth.delete_account')
   %p.muted-hint= t('auth.delete_account_html', path: settings_delete_path)
diff --git a/config/locales/ar.yml b/config/locales/ar.yml
index f641d3c2e..bc71d9c87 100644
--- a/config/locales/ar.yml
+++ b/config/locales/ar.yml
@@ -220,7 +220,6 @@ ar:
     regenerate_token: إعادة توليد رمز النفاذ
     your_token: رمز نفاذك
   auth:
-    change_password: الهوية
     confirm_email: تأكيد عنوان البريد الإلكتروني
     delete_account: حذف حساب
     delete_account_html: إن كنت ترغب في حذف حسابك يُمكنك <a href="%{path}">المواصلة هنا</a>. سوف يُطلَبُ منك التأكيد قبل الحذف.
@@ -237,6 +236,7 @@ ar:
     register: إنشاء حساب
     resend_confirmation: إعادة إرسال تعليمات التأكيد
     reset_password: إعادة تعيين كلمة المرور
+    security: الهوية
     set_new_password: تعيين كلمة مرور جديدة
   authorize_follow:
     error: يا للأسف، وقع هناك خطأ إثر عملية البحث عن الحساب عن بعد
diff --git a/config/locales/bg.yml b/config/locales/bg.yml
index 56a904895..cb3ed2244 100644
--- a/config/locales/bg.yml
+++ b/config/locales/bg.yml
@@ -30,7 +30,6 @@ bg:
   applications:
     invalid_url: Предоставеният URL е невалиден
   auth:
-    change_password: Идентификационни данни
     didnt_get_confirmation: Не получих инструкции за потвърждение
     forgot_password: Забравих си паролата
     login: Влизане
@@ -38,6 +37,7 @@ bg:
     register: Регистрация
     resend_confirmation: Изпрати отново инструкции за потвърждение
     reset_password: Подновяване на паролата
+    security: Идентификационни данни
     set_new_password: Задай нова парола
   authorize_follow:
     error: Възникна грешка в откриването на потребителя
diff --git a/config/locales/ca.yml b/config/locales/ca.yml
index 5552202e5..c069adb4b 100644
--- a/config/locales/ca.yml
+++ b/config/locales/ca.yml
@@ -359,7 +359,6 @@ ca:
     your_token: El teu identificador d'accés
   auth:
     agreement_html: En inscriure't, acceptes seguir <a href="%{rules_path}">els nostres termes del servei</a> i <a href="%{terms_path}">la nostra política de privadesa</a>.
-    change_password: Seguretat
     confirm_email: Confirmar correu electrònic
     delete_account: Suprimeix el compte
     delete_account_html: Si vols suprimir el compte pots <a href="%{path}">fer-ho aquí</a>. Se't demanarà confirmació.
@@ -378,6 +377,7 @@ ca:
     register: Registre
     resend_confirmation: Torna a enviar el correu de confirmació
     reset_password: Restableix la contrasenya
+    security: Seguretat
     set_new_password: Estableix una contrasenya nova
   authorize_follow:
     error: Malauradament, ha ocorregut un error cercant el compte remot
diff --git a/config/locales/de.yml b/config/locales/de.yml
index 8f17413e1..e55ad151a 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -353,7 +353,6 @@ de:
     your_token: Dein Zugangs-Token
   auth:
     agreement_html: Indem du dich registrierst, erklärst du dich mit den Regeln, die <a href="%{rules_path}">auf dieser Instanz gelten</a> und der <a href="%{terms_path}">Datenschutzerklärung</a> einverstanden.
-    change_password: Sicherheit
     delete_account: Konto löschen
     delete_account_html: Falls du dein Konto löschen willst, kannst du <a href="%{path}">hier damit fortfahren</a>. Du wirst um Bestätigung gebeten werden.
     didnt_get_confirmation: Keine Bestätigungs-Mail erhalten?
@@ -366,6 +365,7 @@ de:
     register: Registrieren
     resend_confirmation: Bestätigungs-Mail erneut versenden
     reset_password: Passwort zurücksetzen
+    security: Sicherheit
     set_new_password: Neues Passwort setzen
   authorize_follow:
     error: Das Profil konnte nicht geladen werden
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 971a9976f..176135657 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -359,7 +359,7 @@ en:
     your_token: Your access token
   auth:
     agreement_html: By signing up you agree to follow <a href="%{rules_path}">the rules of the instance</a> and <a href="%{terms_path}">our terms of service</a>.
-    change_password: Security
+    change_password: Password
     confirm_email: Confirm email
     delete_account: Delete account
     delete_account_html: If you wish to delete your account, you can <a href="%{path}">proceed here</a>. You will be asked for confirmation.
@@ -378,6 +378,7 @@ en:
     register: Sign up
     resend_confirmation: Resend confirmation instructions
     reset_password: Reset password
+    security: Security
     set_new_password: Set new password
   authorize_follow:
     error: Unfortunately, there was an error looking up the remote account
diff --git a/config/locales/eo.yml b/config/locales/eo.yml
index dee6d4a18..6daa1caed 100644
--- a/config/locales/eo.yml
+++ b/config/locales/eo.yml
@@ -358,7 +358,6 @@ eo:
     your_token: Via alira ĵetono
   auth:
     agreement_html: Per registriĝo, vi konsentas kun <a href="%{rules_path}">la reguloj de la nodo</a> kaj <a href="%{terms_path}">niaj uzkondiĉoj</a>.
-    change_password: Sekureco
     confirm_email: Konfirmi retadreson
     delete_account: Forigi konton
     delete_account_html: Se vi deziras forigi vian konton, vi povas <a href="%{path}">fari tion ĉi tie</a>. Vi bezonos konfirmi vian peton.
@@ -376,6 +375,7 @@ eo:
     register: Registriĝi
     resend_confirmation: Resendi la instrukciojn por konfirmi
     reset_password: Ŝanĝi pasvorton
+    security: Sekureco
     set_new_password: Elekti novan pasvorton
   authorize_follow:
     error: Bedaŭrinde, estis eraro en la serĉado de la fora konto
diff --git a/config/locales/es.yml b/config/locales/es.yml
index 9eb61aaac..f55b8bb51 100644
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -353,7 +353,6 @@ es:
     your_token: Tu token de acceso
   auth:
     agreement_html: Al registrarte, acepta seguir <a href="%{rules_path}">las reglas de la instancia</a> y <a href="%{terms_path}">nuestros términos de servicio</a>.
-    change_password: Cambiar contraseña
     delete_account: Borrar cuenta
     delete_account_html: Si desea eliminar su cuenta, puede <a href="%{path}">proceder aquí</a>. Será pedido de una confirmación.
     didnt_get_confirmation: "¿No recibió el correo de confirmación?"
@@ -366,6 +365,7 @@ es:
     register: Registrarse
     resend_confirmation: Volver a enviar el correo de confirmación
     reset_password: Restablecer contraseña
+    security: Cambiar contraseña
     set_new_password: Establecer nueva contraseña
   authorize_follow:
     error: Desafortunadamente, ha ocurrido un error buscando la cuenta remota
diff --git a/config/locales/fa.yml b/config/locales/fa.yml
index 395d226bd..86756c01b 100644
--- a/config/locales/fa.yml
+++ b/config/locales/fa.yml
@@ -344,7 +344,6 @@ fa:
     your_token: کد دسترسی شما
   auth:
     agreement_html: پیش از عضو شدن باید <a href="%{rules_path}">قوانین این سرور</a> و <a href="%{terms_path}">شرایط استفادهٔ</a> ما را بپذیرید.
-    change_password: امنیت
     delete_account: پاک‌کردن حساب
     delete_account_html: اگر می‌خواهید حساب خود را پاک کنید، از <a href="%{path}">این‌جا</a> پیش بروید. از شما درخواست تأیید خواهد شد.
     didnt_get_confirmation: راهنمایی برای تأیید را دریافت نکردید؟
@@ -357,6 +356,7 @@ fa:
     register: عضو شوید
     resend_confirmation: راهنمایی برای تأیید را دوباره بفرست
     reset_password: بازنشانی رمز
+    security: امنیت
     set_new_password: تعیین رمز تازه
   authorize_follow:
     error: متأسفانه حین یافتن آن حساب خطایی رخ داد
diff --git a/config/locales/fi.yml b/config/locales/fi.yml
index e9c7273ce..71e019e54 100644
--- a/config/locales/fi.yml
+++ b/config/locales/fi.yml
@@ -67,7 +67,6 @@ fi:
   applications:
     invalid_url: Annettu URL on väärä
   auth:
-    change_password: Tunnukset
     didnt_get_confirmation: Etkö saanut varmennusohjeita?
     forgot_password: Unohditko salasanasi?
     login: Kirjaudu sisään
@@ -75,6 +74,7 @@ fi:
     register: Rekisteröidy
     resend_confirmation: Lähetä varmennusohjeet uudestaan
     reset_password: Palauta salasana
+    security: Tunnukset
     set_new_password: Aseta uusi salasana
   authorize_follow:
     error: Valitettavasti tapahtui virhe etätilin haussa.
diff --git a/config/locales/fr.yml b/config/locales/fr.yml
index 34910488f..65effe700 100644
--- a/config/locales/fr.yml
+++ b/config/locales/fr.yml
@@ -359,7 +359,6 @@ fr:
     your_token: Votre jeton d’accès
   auth:
     agreement_html: En vous inscrivant, vous souscrivez <a href="%{rules_path}">aux règles de l’instance</a> et à <a href="%{terms_path}">nos conditions d’utilisation</a>.
-    change_password: Sécurité
     confirm_email: Confirmer mon adresse mail
     delete_account: Supprimer le compte
     delete_account_html: Si vous désirez supprimer votre compte, vous pouvez <a href="%{path}">cliquer ici</a>. Il vous sera demandé de confirmer cette action.
@@ -377,6 +376,7 @@ fr:
     register: S’inscrire
     resend_confirmation: Envoyer à nouveau les consignes de confirmation
     reset_password: Réinitialiser le mot de passe
+    security: Sécurité
     set_new_password: Définir le nouveau mot de passe
   authorize_follow:
     error: Malheureusement, il y a eu une erreur en cherchant les détails du compte distant
diff --git a/config/locales/gl.yml b/config/locales/gl.yml
index def9168cc..ca02ea693 100644
--- a/config/locales/gl.yml
+++ b/config/locales/gl.yml
@@ -359,7 +359,6 @@ gl:
     your_token: O seu testemuño de acceso
   auth:
     agreement_html: Rexistrándose acorda seguir <a href="%{rules_path}">as normas da instancia</a> e <a href="%{terms_path}">os termos do servizo</a>.
-    change_password: Seguridade
     confirm_email: Confirmar correo-e
     delete_account: Eliminar conta
     delete_account_html: Se desexa eliminar a súa conta, pode <a href="%{path}">facelo aquí</a>. Pediráselle confirmación.
@@ -378,6 +377,7 @@ gl:
     register: Rexistro
     resend_confirmation: Voltar a enviar intruccións de confirmación
     reset_password: Restablecer contrasinal
+    security: Seguridade
     set_new_password: Establecer novo contrasinal
   authorize_follow:
     error: Desgraciadamente, algo fallou ao buscar a conta remota
diff --git a/config/locales/he.yml b/config/locales/he.yml
index c83f4ba10..1a7c84d7c 100644
--- a/config/locales/he.yml
+++ b/config/locales/he.yml
@@ -232,7 +232,6 @@ he:
   applications:
     invalid_url: כתובת הקישורית אינה חוקית
   auth:
-    change_password: החלפת סיסמא
     didnt_get_confirmation: לא התקבלו הוראות אימות?
     forgot_password: הנשתכחה סיסמתך?
     login: כניסה
@@ -240,6 +239,7 @@ he:
     register: הרשמה
     resend_confirmation: שלח הוראות אימות בשנית
     reset_password: איפוס סיסמא
+    security: החלפת סיסמא
     set_new_password: שינוי סיסמא
   authorize_follow:
     error: למרבה הצער, היתה שגיאה בחיפוש החשבון המרוחק
diff --git a/config/locales/hr.yml b/config/locales/hr.yml
index a3c9aa436..2d2eddc08 100644
--- a/config/locales/hr.yml
+++ b/config/locales/hr.yml
@@ -30,7 +30,6 @@ hr:
   applications:
     invalid_url: Uneseni link nije valjan
   auth:
-    change_password: Vjerodajnica
     didnt_get_confirmation: Niste primili instrukcije za potvrđivanje?
     forgot_password: Zaboravljena lozinka?
     login: Prijavi se
@@ -38,6 +37,7 @@ hr:
     register: Registriraj se
     resend_confirmation: Ponovo pošalji instrukcije za potvrđivanje
     reset_password: Resetiraj lozinku
+    security: Vjerodajnica
     set_new_password: Postavi novu lozinku
   authorize_follow:
     error: Nažalost, došlo je do greške looking up the remote račun
diff --git a/config/locales/hu.yml b/config/locales/hu.yml
index de35044d4..6be82c1de 100644
--- a/config/locales/hu.yml
+++ b/config/locales/hu.yml
@@ -353,7 +353,6 @@ hu:
     your_token: Hozzáférési kulcsod
   auth:
     agreement_html: A feliratkozással elfogatod az <a href="%{rules_path}">instancia szabályzatát</a> és a <a href="%{terms_path}">felhasználási feltételeket</a>.
-    change_password: Biztonság
     delete_account: Felhasználói fiók törlése
     delete_account_html: Felhasználói fiókod törléséhez <a href="%{path}">kattints ide</a>. A rendszer újbóli megerősítést fog kérni.
     didnt_get_confirmation: Nem kaptad meg a megerősítési lépéseket?
@@ -366,6 +365,7 @@ hu:
     register: Regisztráció
     resend_confirmation: Megerősítési lépések újraküldése
     reset_password: Jelszó visszaállítása
+    security: Biztonság
     set_new_password: Új jelszó beállítása
   authorize_follow:
     error: Hiba történt a távoli felhasználó keresésekor
diff --git a/config/locales/id.yml b/config/locales/id.yml
index 6e4d60fd8..0ef1d5040 100644
--- a/config/locales/id.yml
+++ b/config/locales/id.yml
@@ -155,7 +155,6 @@ id:
   applications:
     invalid_url: URL tidak sesuai
   auth:
-    change_password: Identitas
     didnt_get_confirmation: Tidak menerima petunjuk konfirmasi?
     forgot_password: Lupa kata sandi?
     login: Masuk
@@ -163,6 +162,7 @@ id:
     register: Daftar
     resend_confirmation: Kirim ulang email konfirmasi
     reset_password: Reset kata sandi
+    security: Identitas
     set_new_password: Tentukan kata sandi baru
   authorize_follow:
     error: Sayangnya, ada error saat melihat akun remote
diff --git a/config/locales/io.yml b/config/locales/io.yml
index db8214768..29ab4516b 100644
--- a/config/locales/io.yml
+++ b/config/locales/io.yml
@@ -153,7 +153,6 @@ io:
   applications:
     invalid_url: La URL donita ne esas valida
   auth:
-    change_password: Chanjar pasvorto
     didnt_get_confirmation: Ka tu ne recevis la instrucioni por konfirmar?
     forgot_password: Pasvorto obliviita?
     login: Enirar
@@ -161,6 +160,7 @@ io:
     register: Membreskar
     resend_confirmation: Risendar la instrucioni por konfirmar
     reset_password: Chanjar la pasvorto
+    security: Chanjar pasvorto
     set_new_password: Selektar nova pasvorto
   authorize_follow:
     error: Regretinde, eventis eraro probante konsultar la fora konto
diff --git a/config/locales/it.yml b/config/locales/it.yml
index 6ab57d2fc..7e5bfd20e 100644
--- a/config/locales/it.yml
+++ b/config/locales/it.yml
@@ -30,7 +30,6 @@ it:
   applications:
     invalid_url: L'URL fornito non è valido
   auth:
-    change_password: Credenziali
     didnt_get_confirmation: Non hai ricevuto le istruzioni di conferma?
     forgot_password: Hai dimenticato la tua password?
     login: Entra
@@ -38,6 +37,7 @@ it:
     register: Iscriviti
     resend_confirmation: Invia di nuovo le istruzioni di conferma
     reset_password: Resetta la password
+    security: Credenziali
     set_new_password: Imposta una nuova password
   authorize_follow:
     error: Sfortunatamente c'è stato un errore nel consultare l'account remoto
diff --git a/config/locales/ja.yml b/config/locales/ja.yml
index 1ff508550..e44a093b5 100644
--- a/config/locales/ja.yml
+++ b/config/locales/ja.yml
@@ -359,7 +359,6 @@ ja:
     your_token: アクセストークン
   auth:
     agreement_html: 登録すると <a href="%{rules_path}">インスタンスのルール</a> と <a href="%{terms_path}">利用規約</a> に従うことに同意したことになります。
-    change_password: セキュリティ
     confirm_email: メールアドレスの確認
     delete_account: アカウントの削除
     delete_account_html: アカウントを削除したい場合、<a href="%{path}">こちら</a> から手続きが行えます。削除する前に、確認画面があります。
@@ -378,6 +377,7 @@ ja:
     register: 登録する
     resend_confirmation: 確認メールを再送する
     reset_password: パスワードを再発行
+    security: セキュリティ
     set_new_password: 新しいパスワード
   authorize_follow:
     error: 残念ながら、リモートアカウント情報の取得中にエラーが発生しました
diff --git a/config/locales/ko.yml b/config/locales/ko.yml
index 4f26d8751..8a11b096a 100644
--- a/config/locales/ko.yml
+++ b/config/locales/ko.yml
@@ -361,7 +361,6 @@ ko:
     your_token: 액세스 토큰
   auth:
     agreement_html: 이 등록으로 <a href="%{rules_path}">이용규약</a> 과 <a href="%{terms_path}">약관</a>에 동의하는 것으로 간주됩니다.
-    change_password: 보안
     confirm_email: 확인 메일 승인
     delete_account: 계정 삭제
     delete_account_html: 계정을 삭제하고 싶은 경우, <a href="%{path}">여기서</a> 삭제할 수 있습니다. 삭제 전 확인 화면이 표시됩니다.
@@ -377,6 +376,7 @@ ko:
     register: 등록하기
     resend_confirmation: 확인 메일을 다시 보내기
     reset_password: 비밀번호 재설정
+    security: 보안
     set_new_password: 새 비밀번호
   authorize_follow:
     error: 리모트 계정을 확인하는 도중 오류가 발생했습니다
diff --git a/config/locales/nl.yml b/config/locales/nl.yml
index 876b91eaf..90139ca0e 100644
--- a/config/locales/nl.yml
+++ b/config/locales/nl.yml
@@ -359,7 +359,6 @@ nl:
     your_token: Jouw toegangscode
   auth:
     agreement_html: Wanneer je op registreren klikt ga je akkoord met het opvolgen van <a href="%{rules_path}">de regels van deze server</a> en <a href="%{terms_path}">onze gebruikersvoorwaarden</a>.
-    change_password: Beveiliging
     confirm_email: E-mail bevestigen
     delete_account: Account verwijderen
     delete_account_html: Wanneer je jouw account graag wilt verwijderen, kan je dat <a href="%{path}">hier doen</a>. We vragen jou daar om een bevestiging.
@@ -378,6 +377,7 @@ nl:
     register: Registreren
     resend_confirmation: Verstuur de bevestigingsinstructies nogmaals
     reset_password: Wachtwoord opnieuw instellen
+    security: Beveiliging
     set_new_password: Nieuw wachtwoord instellen
   authorize_follow:
     error: Helaas, er is een fout opgetreden bij het opzoeken van de externe account
diff --git a/config/locales/no.yml b/config/locales/no.yml
index d198177cd..3adf71bee 100644
--- a/config/locales/no.yml
+++ b/config/locales/no.yml
@@ -353,7 +353,6 @@
     your_token: Din tilgangsnøkkel
   auth:
     agreement_html: Ved å registrere deg godtar du å følge <a href="%{rules_path}">instansens regler</a> og <a href="%{terms_path}">våre brukervilkår</a>.
-    change_password: Sikkerhet
     delete_account: Slett konto
     delete_account_html: Hvis du ønsker å slette din konto kan du <a href="%{path}">fortsette her</a>. Du vil bli spurt om bekreftelse.
     didnt_get_confirmation: Mottok du ikke instruksjoner om bekreftelse?
@@ -366,6 +365,7 @@
     register: Bli med
     resend_confirmation: Send bekreftelsesinstruksjoner på nytt
     reset_password: Nullstill passord
+    security: Sikkerhet
     set_new_password: Sett nytt passord
   authorize_follow:
     error: Uheldigvis skjedde det en feil da vi prøvde å få tak i en bruker fra en annen instans
diff --git a/config/locales/oc.yml b/config/locales/oc.yml
index 869118c08..160bbc3ed 100644
--- a/config/locales/oc.yml
+++ b/config/locales/oc.yml
@@ -353,7 +353,6 @@ oc:
     your_token: Vòstre geton d’accès
   auth:
     agreement_html: En vos marcar acceptatz <a href="%{rules_path}">las règlas de l’instància</a> e <a href="%{terms_path}">politica de confidencialitat</a>.
-    change_password: Seguretat
     delete_account: Suprimir lo compte
     delete_account_html: Se volètz suprimir vòstre compte, podètz <a href="%{path}">o far aquí</a>. Vos demandarem que confirmetz.
     didnt_get_confirmation: Avètz pas recebut las instruccions de confirmacion ?
@@ -369,6 +368,7 @@ oc:
     register: Se marcar
     resend_confirmation: Tornar mandar las instruccions de confirmacion
     reset_password: Reïnicializar lo senhal
+    security: Seguretat
     set_new_password: Picar un nòu senhal
   authorize_follow:
     error: O planhèm, i a agut una error al moment de cercar lo compte
diff --git a/config/locales/pl.yml b/config/locales/pl.yml
index 5fcc93f9d..9a0c6ae15 100644
--- a/config/locales/pl.yml
+++ b/config/locales/pl.yml
@@ -360,7 +360,6 @@ pl:
     your_token: Twój token dostępu
   auth:
     agreement_html: Rejestrując się, oświadczasz, że zapoznałeś się z <a href="%{rules_path}">informacjami o instancji</a> i <a href="%{terms_path}">zasadami korzystania z usługi</a>.
-    change_password: Bezpieczeństwo
     confirm_email: Potwierdź adres e-mail
     delete_account: Usunięcie konta
     delete_account_html: Jeżeli chcesz usunąć konto, <a href="%{path}">przejdź tutaj</a>. Otrzymasz prośbę o potwierdzenie.
@@ -379,6 +378,7 @@ pl:
     register: Rejestracja
     resend_confirmation: Ponownie prześlij instrukcje weryfikacji
     reset_password: Zresetuj hasło
+    security: Bezpieczeństwo
     set_new_password: Ustaw nowe hasło
   authorize_follow:
     error: Niestety, podczas sprawdzania zdalnego konta wystąpił błąd
diff --git a/config/locales/pt-BR.yml b/config/locales/pt-BR.yml
index f781b704f..04836c121 100644
--- a/config/locales/pt-BR.yml
+++ b/config/locales/pt-BR.yml
@@ -359,7 +359,6 @@ pt-BR:
     your_token: Seu token de acesso
   auth:
     agreement_html: Ao se cadastrar você concorda em seguir <a href="%{rules_path}">as regras da instância</a> e <a href="%{terms_path}">os nossos termos de serviço</a>.
-    change_password: Segurança
     confirm_email: Confirmar e-mail
     delete_account: Excluir conta
     delete_account_html: Se você deseja excluir a sua conta, você pode <a href="%{path}">prosseguir para cá</a>. Uma confirmação será requisitada.
@@ -377,6 +376,7 @@ pt-BR:
     register: Cadastrar-se
     resend_confirmation: Reenviar instruções de confirmação
     reset_password: Redefinir senha
+    security: Segurança
     set_new_password: Definir uma nova senha
   authorize_follow:
     error: Infelizmente, ocorreu um erro ao buscar a conta remota
diff --git a/config/locales/pt.yml b/config/locales/pt.yml
index 455f27898..5012e176f 100644
--- a/config/locales/pt.yml
+++ b/config/locales/pt.yml
@@ -353,7 +353,6 @@ pt:
     your_token: O teu token de acesso
   auth:
     agreement_html: Registando-te concordas em seguir <a href="%{rules_path}">as regras da instância</a> e <a href="%{terms_path}">os nossos termos de serviço</a>.
-    change_password: Alterar palavra-passe
     confirm_email: Confirmar e-mail
     delete_account: Eliminar conta
     delete_account_html: Se desejas eliminar a conta, podes <a href="%{path}">continua aqui</a>. Uma confirmação será pedida.
@@ -367,6 +366,7 @@ pt:
     register: Registar
     resend_confirmation: Reenviar instruções de confirmação
     reset_password: Criar nova palavra-passe
+    security: Alterar palavra-passe
     set_new_password: Editar palavra-passe
   authorize_follow:
     error: Infelizmente, ocorreu um erro ao buscar a conta remota
diff --git a/config/locales/ru.yml b/config/locales/ru.yml
index 467f24ca8..a2cb1e793 100644
--- a/config/locales/ru.yml
+++ b/config/locales/ru.yml
@@ -353,7 +353,6 @@ ru:
     your_token: Ваш токен доступа
   auth:
     agreement_html: Создавая аккаунт, вы соглашаетесь с <a href="%{rules_path}">правилами узла</a> и <a href="%{terms_path}">нашими условиями обслуживания</a>.
-    change_password: Изменить пароль
     delete_account: Удалить аккаунт
     delete_account_html: Если Вы хотите удалить свой аккаунт, вы можете <a href="%{path}">перейти сюда</a>. У Вас будет запрошено подтверждение.
     didnt_get_confirmation: Не получили инструкцию для подтверждения?
@@ -366,6 +365,7 @@ ru:
     register: Зарегистрироваться
     resend_confirmation: Повторить отправку инструкции для подтверждения
     reset_password: Сбросить пароль
+    security: Изменить пароль
     set_new_password: Задать новый пароль
   authorize_follow:
     error: К сожалению, при поиске удаленного аккаунта возникла ошибка
diff --git a/config/locales/sk.yml b/config/locales/sk.yml
index 9938c2bc4..551fab322 100644
--- a/config/locales/sk.yml
+++ b/config/locales/sk.yml
@@ -359,7 +359,6 @@ sk:
     your_token: Váš prístupový token
   auth:
     agreement_html: V rámci registrácie súhlasíte, že sa budete riadiť  <a href="%{rules_path}"> 1 pravidlami tejto instancie</a> 2 a taktiež <a href="%{terms_path}"> 3 našími servisnými podmienkami </a> 4.
-    change_password: Zabezpečenie
     confirm_email: Potvrdiť email
     delete_account: Vymazať účet
     delete_account_html: Pokiaľ si želáte vymazať svoj účet, môžete tak <a href="%{path}"> 1 urobiť tu</a> 2. Budete požiadaný/á o potvrdenie tohto kroku.
@@ -378,6 +377,7 @@ sk:
     register: Zaregistrovať sa
     resend_confirmation: Poslať potvrdzujúce pokyny znovu
     reset_password: Resetovať heslo
+    security: Zabezpečenie
     set_new_password: Nastaviť nové heslo
   authorize_follow:
     error: Naneštastie nastala chyba pri hľadaní vzdialeného účtu
diff --git a/config/locales/sr-Latn.yml b/config/locales/sr-Latn.yml
index 4eed44345..2d984049a 100644
--- a/config/locales/sr-Latn.yml
+++ b/config/locales/sr-Latn.yml
@@ -346,7 +346,6 @@ sr-Latn:
     your_token: Vaš pristupni token
   auth:
     agreement_html: Pristupanjem instanci se slažete sa <a href="%{rules_path}">pravilima instance</a> i <a href="%{terms_path}">uslovima korišćenja</a>.
-    change_password: Bezbednost
     delete_account: Obriši nalog
     delete_account_html: Ako želite da obrišete Vaš nalog, možete <a href="%{path}">nastaviti ovde</a>. Bićete upitani da potvrdite.
     didnt_get_confirmation: Niste dobili poruku sa uputstvima za potvrdu naloga?
@@ -359,6 +358,7 @@ sr-Latn:
     register: Registruj se
     resend_confirmation: Pošalji poruku sa uputstvima o potvrdi naloga ponovo
     reset_password: Resetuj lozinku
+    security: Bezbednost
     set_new_password: Postavi novu lozinku
   authorize_follow:
     error: Nažalost, desila se greška pri traženju udaljenog naloga
diff --git a/config/locales/sr.yml b/config/locales/sr.yml
index c56498765..2daf32915 100644
--- a/config/locales/sr.yml
+++ b/config/locales/sr.yml
@@ -346,7 +346,6 @@ sr:
     your_token: Ваш приступни токен
   auth:
     agreement_html: Приступањем инстанци се слажете са <a href="%{rules_path}">правилима инстанце</a> и <a href="%{terms_path}">условима коришћења</a>.
-    change_password: Безбедност
     delete_account: Обриши налог
     delete_account_html: Ако желите да обришете Ваш налог, можете <a href="%{path}">наставити овде</a>. Бићете упитани да потврдите.
     didnt_get_confirmation: Нисте добили поруку са упутствима за потврду налога?
@@ -359,6 +358,7 @@ sr:
     register: Региструј се
     resend_confirmation: Пошаљи поруку са упутствима о потврди налога поново
     reset_password: Ресетуј лозинку
+    security: Безбедност
     set_new_password: Постави нову лозинку
   authorize_follow:
     error: Нажалост, десила се грешка при тражењу удаљеног налога
diff --git a/config/locales/sv.yml b/config/locales/sv.yml
index 1e79b63e5..8d9c6d5df 100644
--- a/config/locales/sv.yml
+++ b/config/locales/sv.yml
@@ -356,7 +356,6 @@ sv:
     your_token: Din access token
   auth:
     agreement_html: Genom att registrera dig godkänner du att följa <a href="%{rules_path}">instansens regler</a> och <a href="%{terms_path}">våra användarvillkor</a>.
-    change_password: Säkerhet
     confirm_email: Bekräfta e-postadress
     delete_account: Ta bort konto
     delete_account_html: Om du vill radera ditt konto kan du <a href="%{path}">fortsätta här</a>. Du kommer att bli ombedd att bekräfta.
@@ -374,6 +373,7 @@ sv:
     register: Registrera
     resend_confirmation: Skicka instruktionerna om bekräftelse igen
     reset_password: Återställ lösenord
+    security: Säkerhet
     set_new_password: Skriv in nytt lösenord
   authorize_follow:
     error: Tyvärr inträffade ett fel när vi kontrollerade fjärrkontot
diff --git a/config/locales/th.yml b/config/locales/th.yml
index 737b3aa95..45fe1e475 100644
--- a/config/locales/th.yml
+++ b/config/locales/th.yml
@@ -157,7 +157,6 @@ th:
   applications:
     invalid_url: URL ที่ระบุไม่ถูกตั้ง
   auth:
-    change_password: Credentials
     didnt_get_confirmation: Didn't receive confirmation instructions?
     forgot_password: คุณลืมพาสเวริ์ดใช่ัม้ย?
     login: ล๊อคอิน
@@ -165,6 +164,7 @@ th:
     register: สมัคร
     resend_confirmation: ส่งขั้นตอนวิธีการยืนยันใหม่อีกครั้ง
     reset_password: เปลี่ยนรหัสผ่าน
+    security: Credentials
     set_new_password: ตั้งรหัสผ่านใหม่
   authorize_follow:
     error: Unfortunately, there was an error looking up the remote account
diff --git a/config/locales/tr.yml b/config/locales/tr.yml
index 23b4d7a24..ee0e33074 100644
--- a/config/locales/tr.yml
+++ b/config/locales/tr.yml
@@ -156,7 +156,6 @@ tr:
   applications:
     invalid_url: Verilen URL geçerli değil
   auth:
-    change_password: Kimlik bilgileri
     didnt_get_confirmation: Hesap doğrulama mailini almadınız mı?
     forgot_password: Parolanızı unuttunuz mu?
     login: Giriş yap
@@ -164,6 +163,7 @@ tr:
     register: Üye ol
     resend_confirmation: Doğrulama mailini tekrar gönder
     reset_password: Parolayı değiştir
+    security: Kimlik bilgileri
     set_new_password: Yeni parola oluştur
   authorize_follow:
     error: Uzak hesap aranırken bir hata oluştu.
diff --git a/config/locales/uk.yml b/config/locales/uk.yml
index 0ddfa9190..4c1c66b31 100644
--- a/config/locales/uk.yml
+++ b/config/locales/uk.yml
@@ -147,7 +147,6 @@ uk:
   applications:
     invalid_url: Введена URL неправильна
   auth:
-    change_password: Зміна паролю
     didnt_get_confirmation: Ви не отримали інструкції з підтвердження?
     forgot_password: Забули свій пароль?
     login: Увійти
@@ -155,6 +154,7 @@ uk:
     register: Зареєструватися
     resend_confirmation: Повторно відправити інструкції з підтвердження
     reset_password: Скинути пароль
+    security: Зміна паролю
     set_new_password: Встановити новий пароль
   authorize_follow:
     error: На жаль, при пошуку віддаленого аккаунту виникла помилка
diff --git a/config/locales/zh-CN.yml b/config/locales/zh-CN.yml
index 1bd2e5039..1254651cd 100644
--- a/config/locales/zh-CN.yml
+++ b/config/locales/zh-CN.yml
@@ -351,7 +351,6 @@ zh-CN:
     your_token: 你的访问令牌
   auth:
     agreement_html: 注册即表示你同意遵守<a href="%{rules_path}">本实例的相关规定</a>和<a href="%{terms_path}">我们的使用条款</a>。
-    change_password: 帐户安全
     delete_account: 删除帐户
     delete_account_html: 如果你想删除你的帐户，请<a href="%{path}">点击这里继续</a>。你需要确认你的操作。
     didnt_get_confirmation: 没有收到确认邮件？
@@ -364,6 +363,7 @@ zh-CN:
     register: 注册
     resend_confirmation: 重新发送确认邮件
     reset_password: 重置密码
+    security: 帐户安全
     set_new_password: 设置新密码
   authorize_follow:
     error: 对不起，寻找这个跨站用户时出错
diff --git a/config/locales/zh-HK.yml b/config/locales/zh-HK.yml
index ed73b7244..e7ab347a1 100644
--- a/config/locales/zh-HK.yml
+++ b/config/locales/zh-HK.yml
@@ -156,7 +156,6 @@ zh-HK:
   applications:
     invalid_url: 所提供的網址不正確
   auth:
-    change_password: 登入資訊
     didnt_get_confirmation: 沒有收到確認指示電郵？
     forgot_password: 忘記了密碼？
     login: 登入
@@ -164,6 +163,7 @@ zh-HK:
     register: 登記
     resend_confirmation: 重發確認指示電郵
     reset_password: 重設密碼
+    security: 登入資訊
     set_new_password: 設定新密碼
   authorize_follow:
     error: 對不起，尋找這個跨站用戶的過程發生錯誤
diff --git a/config/locales/zh-TW.yml b/config/locales/zh-TW.yml
index bd9f85840..2fec09ed8 100644
--- a/config/locales/zh-TW.yml
+++ b/config/locales/zh-TW.yml
@@ -127,7 +127,6 @@ zh-TW:
   applications:
     invalid_url: 網址不正確
   auth:
-    change_password: 登入資訊
     didnt_get_confirmation: 沒有收到驗證信？
     forgot_password: 忘記密碼？
     login: 登入
@@ -137,6 +136,7 @@ zh-TW:
     register: 註冊
     resend_confirmation: 重寄驗證信
     reset_password: 重設密碼
+    security: 登入資訊
     set_new_password: 設定新密碼
   authorize_follow:
     error: 對不起，搜尋遠端使用者出現錯誤
diff --git a/config/navigation.rb b/config/navigation.rb
index 9c7a7d2ec..2bee5a4f9 100644
--- a/config/navigation.rb
+++ b/config/navigation.rb
@@ -8,7 +8,7 @@ SimpleNavigation::Configuration.run do |navigation|
       settings.item :profile, safe_join([fa_icon('user fw'), t('settings.edit_profile')]), settings_profile_url, highlights_on: %r{/settings/profile|/settings/migration}
       settings.item :preferences, safe_join([fa_icon('sliders fw'), t('settings.preferences')]), settings_preferences_url
       settings.item :notifications, safe_join([fa_icon('bell fw'), t('settings.notifications')]), settings_notifications_url
-      settings.item :password, safe_join([fa_icon('lock fw'), t('auth.change_password')]), edit_user_registration_url, highlights_on: %r{/auth/edit|/settings/delete}
+      settings.item :password, safe_join([fa_icon('lock fw'), t('auth.security')]), edit_user_registration_url, highlights_on: %r{/auth/edit|/settings/delete}
       settings.item :two_factor_authentication, safe_join([fa_icon('mobile fw'), t('settings.two_factor_authentication')]), settings_two_factor_authentication_url, highlights_on: %r{/settings/two_factor_authentication}
       settings.item :import, safe_join([fa_icon('cloud-upload fw'), t('settings.import')]), settings_import_url
       settings.item :export, safe_join([fa_icon('cloud-download fw'), t('settings.export')]), settings_export_url
-- 
cgit 


From 8de048fcdb328167922f3056e460afc6f055cb8d Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Wed, 7 Mar 2018 08:59:27 +0100
Subject: In wide layout, columnize Mastodon features on landing page (#6674)

---
 app/javascript/styles/mastodon/about.scss | 21 ++++++++++++++-------
 app/views/about/show.html.haml            |  6 ++++--
 2 files changed, 18 insertions(+), 9 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/styles/mastodon/about.scss b/app/javascript/styles/mastodon/about.scss
index 9ce83aa9b..f29918135 100644
--- a/app/javascript/styles/mastodon/about.scss
+++ b/app/javascript/styles/mastodon/about.scss
@@ -832,8 +832,13 @@ $small-breakpoint: 960px;
   }
 
   &__features {
+    & > p {
+      padding-right: 60px;
+    }
+
     .features-list {
-      margin: 40px 0 !important;
+      margin: 40px 0;
+      margin-top: 30px;
     }
 
     &__action {
@@ -842,17 +847,11 @@ $small-breakpoint: 960px;
   }
 
   .features-list {
-    margin-top: 20px;
-
     .features-list__row {
       display: flex;
       padding: 10px 0;
       justify-content: space-between;
 
-      &:first-child {
-        padding-top: 0;
-      }
-
       .visual {
         flex: 0 0 auto;
         display: flex;
@@ -878,6 +877,14 @@ $small-breakpoint: 960px;
         }
       }
     }
+
+    @media screen and (min-width: $small-breakpoint) {
+      display: grid;
+      grid-gap: 30px;
+      grid-template-columns: 1fr 1fr;
+      grid-auto-columns: 50%;
+      grid-auto-rows: max-content;
+    }
   }
 
   .extended-description {
diff --git a/app/views/about/show.html.haml b/app/views/about/show.html.haml
index 4f3cedacd..d067d4874 100644
--- a/app/views/about/show.html.haml
+++ b/app/views/about/show.html.haml
@@ -103,8 +103,10 @@
       - if Setting.timeline_preview
         .column-4.landing-page__information
           .landing-page__features
-            %h3= t 'about.what_is_mastodon'
-            %p= t 'about.about_mastodon_html'
+            .features-list
+              %div
+                %h3= t 'about.what_is_mastodon'
+                %p= t 'about.about_mastodon_html'
 
             = render 'features'
 
-- 
cgit 


From 86a9de6753fc425b247699c7822bc8a5d49af043 Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Thu, 8 Mar 2018 04:54:26 +0100
Subject: Display AttachmentList in timelines in compact style when media
 missing (#6680)

---
 .../mastodon/components/attachment_list.js         | 18 ++++-
 app/javascript/mastodon/components/status.js       |  8 ++-
 app/javascript/styles/mastodon/components.scss     | 76 +++++++++++++---------
 3 files changed, 69 insertions(+), 33 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/mastodon/components/attachment_list.js b/app/javascript/mastodon/components/attachment_list.js
index 9f2d46ddd..d8f90b5b6 100644
--- a/app/javascript/mastodon/components/attachment_list.js
+++ b/app/javascript/mastodon/components/attachment_list.js
@@ -1,5 +1,6 @@
 import React from 'react';
 import ImmutablePropTypes from 'react-immutable-proptypes';
+import PropTypes from 'prop-types';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 
 const filename = url => url.split('/').pop().split('#')[0].split('?')[0];
@@ -8,10 +9,25 @@ export default class AttachmentList extends ImmutablePureComponent {
 
   static propTypes = {
     media: ImmutablePropTypes.list.isRequired,
+    compact: PropTypes.bool,
   };
 
   render () {
-    const { media } = this.props;
+    const { media, compact } = this.props;
+
+    if (compact) {
+      return (
+        <div className='attachment-list compact'>
+          <ul className='attachment-list__list'>
+            {media.map(attachment => (
+              <li key={attachment.get('id')}>
+                <a href={attachment.get('remote_url')} target='_blank' rel='noopener'><i className='fa fa-link' /> {filename(attachment.get('remote_url'))}</a>
+              </li>
+            ))}
+          </ul>
+        </div>
+      );
+    }
 
     return (
       <div className='attachment-list'>
diff --git a/app/javascript/mastodon/components/status.js b/app/javascript/mastodon/components/status.js
index 85baeffca..c6f11c379 100644
--- a/app/javascript/mastodon/components/status.js
+++ b/app/javascript/mastodon/components/status.js
@@ -7,6 +7,7 @@ import RelativeTimestamp from './relative_timestamp';
 import DisplayName from './display_name';
 import StatusContent from './status_content';
 import StatusActionBar from './status_action_bar';
+import AttachmentList from './attachment_list';
 import { FormattedMessage } from 'react-intl';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import { MediaGallery, Video } from '../features/ui/util/async-components';
@@ -179,7 +180,12 @@ export default class Status extends ImmutablePureComponent {
 
     if (status.get('media_attachments').size > 0 && !this.props.muted) {
       if (status.get('media_attachments').some(item => item.get('type') === 'unknown')) {
-
+        media = (
+          <AttachmentList
+            compact
+            media={status.get('media_attachments')}
+          />
+        );
       } else if (status.getIn(['media_attachments', 0, 'type']) === 'video') {
         const video = status.getIn(['media_attachments', 0]);
 
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index c8850dede..c35cc9d75 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -4222,45 +4222,59 @@ a.status-card {
   border-radius: 4px;
   margin-top: 14px;
   overflow: hidden;
-}
 
-.attachment-list__icon {
-  flex: 0 0 auto;
-  color: $ui-base-lighter-color;
-  padding: 8px 18px;
-  cursor: default;
-  border-right: 1px solid lighten($ui-base-color, 8%);
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: 26px;
+  &__icon {
+    flex: 0 0 auto;
+    color: $ui-base-lighter-color;
+    padding: 8px 18px;
+    cursor: default;
+    border-right: 1px solid lighten($ui-base-color, 8%);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    font-size: 26px;
 
-  .fa {
-    display: block;
+    .fa {
+      display: block;
+    }
   }
-}
-
-.attachment-list__list {
-  list-style: none;
-  padding: 4px 0;
-  padding-left: 8px;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
 
-  li {
-    display: block;
+  &__list {
+    list-style: none;
     padding: 4px 0;
+    padding-left: 8px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+
+    li {
+      display: block;
+      padding: 4px 0;
+    }
+
+    a {
+      text-decoration: none;
+      color: $ui-base-lighter-color;
+      font-weight: 500;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
   }
 
-  a {
-    text-decoration: none;
-    color: $ui-base-lighter-color;
-    font-weight: 500;
+  &.compact {
+    border: 0;
+    margin-top: 4px;
 
-    &:hover {
-      text-decoration: underline;
+    .attachment-list__list {
+      padding: 0;
+      display: block;
+    }
+
+    .fa {
+      color: $ui-base-lighter-color;
     }
   }
 }
-- 
cgit 


From b79ab15859e7f8383526afd147e8416d2df2f7a7 Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Thu, 8 Mar 2018 08:57:21 +0100
Subject: When enabled, always display media in gallery. Also: click to reveal
 (#6692)

Fix #6677
---
 app/javascript/mastodon/components/permalink.js    | 10 +++++--
 .../account_gallery/components/media_item.js       | 32 ++++++++++++++++++----
 app/javascript/styles/mastodon/components.scss     | 11 +++++++-
 3 files changed, 45 insertions(+), 8 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/mastodon/components/permalink.js b/app/javascript/mastodon/components/permalink.js
index d726d37a2..b369e9812 100644
--- a/app/javascript/mastodon/components/permalink.js
+++ b/app/javascript/mastodon/components/permalink.js
@@ -12,9 +12,15 @@ export default class Permalink extends React.PureComponent {
     href: PropTypes.string.isRequired,
     to: PropTypes.string.isRequired,
     children: PropTypes.node,
+    onInterceptClick: PropTypes.func,
   };
 
-  handleClick = (e) => {
+  handleClick = e => {
+    if (this.props.onInterceptClick && this.props.onInterceptClick()) {
+      e.preventDefault();
+      return;
+    }
+
     if (this.context.router && e.button === 0 && !(e.ctrlKey || e.metaKey)) {
       e.preventDefault();
       this.context.router.history.push(this.props.to);
@@ -22,7 +28,7 @@ export default class Permalink extends React.PureComponent {
   }
 
   render () {
-    const { href, children, className, ...other } = this.props;
+    const { href, children, className, onInterceptClick, ...other } = this.props;
 
     return (
       <a target='_blank' href={href} onClick={this.handleClick} {...other} className={`permalink${className ? ' ' + className : ''}`}>
diff --git a/app/javascript/mastodon/features/account_gallery/components/media_item.js b/app/javascript/mastodon/features/account_gallery/components/media_item.js
index 59c805c38..f7a802dc7 100644
--- a/app/javascript/mastodon/features/account_gallery/components/media_item.js
+++ b/app/javascript/mastodon/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 '../../../components/permalink';
+import { displaySensitiveMedia } from '../../../initial_state';
 
 export default class MediaItem extends ImmutablePureComponent {
 
@@ -9,8 +10,22 @@ export default class MediaItem extends ImmutablePureComponent {
     media: ImmutablePropTypes.map.isRequired,
   };
 
+  state = {
+    visible: !this.props.media.getIn(['status', 'sensitive']) || displaySensitiveMedia,
+  };
+
+  handleClick = () => {
+    if (!this.state.visible) {
+      this.setState({ visible: true });
+      return true;
+    }
+
+    return false;
+  }
+
   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 +33,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 = <span className='media-gallery__gifv__label'>GIF</span>;
+      label = <span className='media-gallery__gifv__label'>GIF</span>;
     }
 
-    if (!status.get('sensitive')) {
+    if (visible) {
       style.backgroundImage    = `url(${media.get('preview_url')})`;
       style.backgroundPosition = `${x}% ${y}%`;
+    } else {
+      icon = (
+        <span className='account-gallery__item__icons'>
+          <i className='fa fa-eye-slash' />
+        </span>
+      );
     }
 
     return (
       <div className='account-gallery__item'>
-        <Permalink to={`/statuses/${status.get('id')}`} href={status.get('url')} style={style}>
-          {content}
+        <Permalink to={`/statuses/${status.get('id')}`} href={status.get('url')} style={style} onInterceptClick={this.handleClick}>
+          {icon}
+          {label}
         </Permalink>
       </div>
     );
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index c35cc9d75..5c2e5713d 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -4680,7 +4680,7 @@ a.status-card {
     background-size: cover;
     background-position: center;
     position: absolute;
-    color: inherit;
+    color: $ui-primary-color;
     text-decoration: none;
     border-radius: 4px;
 
@@ -4688,6 +4688,7 @@ a.status-card {
     &:active,
     &:focus {
       outline: 0;
+      color: $ui-secondary-color;
 
       &::before {
         content: "";
@@ -4699,6 +4700,14 @@ a.status-card {
       }
     }
   }
+
+  &__icons {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    font-size: 24px;
+  }
 }
 
 .account__section-headline {
-- 
cgit 


From 5acd5315f23b4472f31c4a0bb612b7356032defc Mon Sep 17 00:00:00 2001
From: Eugen Rochko <eugen@zeonfederated.com>
Date: Thu, 8 Mar 2018 11:10:37 +0100
Subject: Improve styling of closed registrations message, rename button
 (#6695)

* Improve styling of closed registrations message, rename button

"Sign up on another server"

Fix #6683

* Adjust styling of closed registrations message
---
 app/javascript/styles/mastodon/about.scss | 22 ++++++++++++++++++++++
 app/views/about/_forms.html.haml          | 11 ++++++-----
 config/locales/en.yml                     |  1 +
 3 files changed, 29 insertions(+), 5 deletions(-)

(limited to 'app/javascript/styles')

diff --git a/app/javascript/styles/mastodon/about.scss b/app/javascript/styles/mastodon/about.scss
index f29918135..c484f074b 100644
--- a/app/javascript/styles/mastodon/about.scss
+++ b/app/javascript/styles/mastodon/about.scss
@@ -194,6 +194,28 @@ $small-breakpoint: 960px;
     }
   }
 
+  .closed-registrations-message {
+    margin-top: 20px;
+
+    &,
+    p {
+      text-align: center;
+      font-size: 12px;
+      line-height: 18px;
+      color: $ui-primary-color;
+      margin-bottom: 0;
+
+      a {
+        color: $ui-highlight-color;
+        text-decoration: underline;
+      }
+    }
+
+    p:last-child {
+      margin-bottom: 0;
+    }
+  }
+
   em {
     display: inline;
     margin: 0;
diff --git a/app/views/about/_forms.html.haml b/app/views/about/_forms.html.haml
index 9916b6bf4..81f7173f7 100644
--- a/app/views/about/_forms.html.haml
+++ b/app/views/about/_forms.html.haml
@@ -1,12 +1,13 @@
 - if @instance_presenter.open_registrations
   = render 'registration'
 - else
-  - if @instance_presenter.closed_registrations_message.blank?
-    %p= t('about.closed_registrations')
-  - else
-    = @instance_presenter.closed_registrations_message.html_safe
+  = link_to t('auth.register_elsewhere'), 'https://joinmastodon.org', class: 'button button-primary'
 
-  = link_to t('auth.register'), 'https://joinmastodon.org', class: 'button button-primary'
+  .closed-registrations-message
+    - if @instance_presenter.closed_registrations_message.blank?
+      %p= t('about.closed_registrations')
+    - else
+      = @instance_presenter.closed_registrations_message.html_safe
 
 .separator-or
   %span= t('auth.or')
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 176135657..2dd09626d 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -376,6 +376,7 @@ en:
       cas: CAS
       saml: SAML
     register: Sign up
+    register_elsewhere: Sign up on another server
     resend_confirmation: Resend confirmation instructions
     reset_password: Reset password
     security: Security
-- 
cgit