From 8f18c8f9ad169edc24474a950e959f8d68973166 Mon Sep 17 00:00:00 2001
From: Anthony Bellew <anthonyreflected@gmail.com>
Date: Thu, 26 Jan 2017 03:02:42 -0700
Subject: [PATCH] Added inline spoiler button styles
---
.../components/components/status_content.jsx | 12 +++++++++++-
1 file changed, 11 insertions(+), 1 deletion(-)
diff --git a/app/assets/javascripts/components/components/status_content.jsx b/app/assets/javascripts/components/components/status_content.jsx
index 476d4520d..397374a75 100644
--- a/app/assets/javascripts/components/components/status_content.jsx
+++ b/app/assets/javascripts/components/components/status_content.jsx
@@ -86,6 +86,15 @@ const StatusContent = React.createClass({
const content = { __html: emojify(status.get('content')) };
const spoilerContent = { __html: emojify(status.get('spoiler_text', '')) };
+ const spoilerStyle = {
+ backgroundColor: '#fff',
+ borderRadius: '0 4px',
+ color: '#363c4b',
+ fontWeight: '500',
+ fontSize: '12px',
+ textTransform: 'uppercase'
+ };
+
if (status.get('spoiler_text').length > 0) {
const toggleText = hidden ? <FormattedMessage id='status.show_more' defaultMessage='Show more' /> : <FormattedMessage id='status.show_less' defaultMessage='Show less' />;
@@ -93,7 +102,8 @@ const StatusContent = React.createClass({
return (
<div className='status__content' style={{ cursor: 'pointer' }} onMouseDown={this.handleMouseDown} onMouseUp={this.handleMouseUp}>
<p style={{ marginBottom: hidden ? '0px' : '' }} >
- <span dangerouslySetInnerHTML={spoilerContent} /> <a onClick={this.handleSpoilerClick}>[{toggleText}]</a>
+ <span dangerouslySetInnerHTML={spoilerContent} />
+ <a style={spoilerStyle} onClick={this.handleSpoilerClick}>[{toggleText}]</a>
</p>
<div style={{ display: hidden ? 'none' : 'block' }} dangerouslySetInnerHTML={content} />