Merge branch 'glitch' into production

3 files changed, 12 insertions, 1 deletions

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 026136b2c..d60e06715 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
@@ -94,6 +94,12 @@ export default class MediaItem extends ImmutablePureComponent {
 
     if (attachment.get('type') === 'unknown') {
       // Skip
+    } else if (attachment.get('type') === 'audio') {
+      thumbnail = (
+        <span className='account-gallery__item__icons'>
+          <i className='fa fa-music' />
+        </span>
+      );
     } else if (attachment.get('type') === 'image') {
       const focusX = attachment.getIn(['meta', 'focus', 'x']) || 0;
       const focusY = attachment.getIn(['meta', 'focus', 'y']) || 0;
diff --git a/app/javascript/flavours/glitch/features/account_gallery/index.js b/app/javascript/flavours/glitch/features/account_gallery/index.js
index 3e4421306..66b938bea 100644
--- a/app/javascript/flavours/glitch/features/account_gallery/index.js
+++ b/app/javascript/flavours/glitch/features/account_gallery/index.js
@@ -111,7 +111,7 @@ export default class AccountGallery extends ImmutablePureComponent {
   }
 
   handleOpenMedia = attachment => {
-    if (attachment.get('type') === 'video') {
+    if (['video', 'audio'].includes(attachment.get('type'))) {
       this.props.dispatch(openModal('VIDEO', { media: attachment, status: attachment.get('status') }));
     } else {
       const media = attachment.getIn(['status', 'media_attachments']);
diff --git a/app/javascript/flavours/glitch/styles/components/status.scss b/app/javascript/flavours/glitch/styles/components/status.scss
index d0183c2de..40db7b3cb 100644
--- a/app/javascript/flavours/glitch/styles/components/status.scss
+++ b/app/javascript/flavours/glitch/styles/components/status.scss
@@ -81,6 +81,11 @@
       text-align: sub;
     }
 
+    sup {
+      font-size: smaller;
+      vertical-align: super;
+    }
+
     ul, ol {
       margin-left: 1em;