From e5cd6d0cda77f6a6b71580ba86c11c04124acdbd Mon Sep 17 00:00:00 2001
From: Emma Winston <emma.winston@gmail.com>
Date: Thu, 12 Sep 2019 18:16:59 +0100
Subject: [PATCH] Corrects syntax for spoiler tags to valid HTML (fixes #10)

---
 app/javascript/mastodon/components/status_content.js |  2 +-
 app/javascript/styles/mastodon/components.scss       | 11 +++++++++++
 2 files changed, 12 insertions(+), 1 deletion(-)

diff --git a/app/javascript/mastodon/components/status_content.js b/app/javascript/mastodon/components/status_content.js
index 3ac03b728..ec517508d 100644
--- a/app/javascript/mastodon/components/status_content.js
+++ b/app/javascript/mastodon/components/status_content.js
@@ -223,7 +223,7 @@ export default class StatusContent extends React.PureComponent {
           <p style={{ marginBottom: hidden && status.get('mentions').isEmpty() ? '0px' : null }}>
             <span dangerouslySetInnerHTML={spoilerContent} lang={status.get('language')} />
             {' '}
-            {status.get('activity_pub_type') === 'Article' ? '' : <div><button tabIndex='0' className={`status__content__spoiler-link ${hidden ? 'status__content__spoiler-link--show-more' : 'status__content__spoiler-link--show-less'}`} onClick={this.handleSpoilerClick}>{toggleText}</button></div>}
+            {status.get('activity_pub_type') === 'Article' ? '' : <span class="show_more_button"><button tabIndex='0' className={`status__content__spoiler-link ${hidden ? 'status__content__spoiler-link--show-more' : 'status__content__spoiler-link--show-less'}`} onClick={this.handleSpoilerClick}>{toggleText}</button></span>}
           </p>
 
           {mentionsPlaceholder}
diff --git a/app/javascript/styles/mastodon/components.scss b/app/javascript/styles/mastodon/components.scss
index 8926a2bf8..7aaa52d95 100644
--- a/app/javascript/styles/mastodon/components.scss
+++ b/app/javascript/styles/mastodon/components.scss
@@ -6027,3 +6027,14 @@ noscript {
     padding: 0.35rem;
   }
 }
+
+div.status__content,
+div.status__content--with-action,
+div.status__content--with-spoiler {
+  p {
+    span.show_more_button {
+      display: block;
+      margin: 0.25rem 0 0 0;
+    }
+  }
+}