diff --git a/app/soapbox/features/compose/containers/markdown_button_container.js b/app/soapbox/features/compose/containers/markdown_button_container.js
new file mode 100644
index 000000000..0b4a642ca
--- /dev/null
+++ b/app/soapbox/features/compose/containers/markdown_button_container.js
@@ -0,0 +1,26 @@
+import { connect } from 'react-redux';
+import TextIconButton from '../components/text_icon_button';
+import { changeComposeContentType } from '../../../actions/compose';
+import { injectIntl, defineMessages } from 'react-intl';
+
+const messages = defineMessages({
+ marked: { id: 'compose_form.markdown.marked', defaultMessage: 'Post markdown enabled' },
+ unmarked: { id: 'compose_form.markdown.unmarked', defaultMessage: 'Post markdown disabled' },
+});
+
+const mapStateToProps = (state, { intl }) => ({
+ label: 'MD',
+ title: intl.formatMessage(state.getIn(['compose', 'content_type']) === 'text/markdown' ? messages.marked : messages.unmarked),
+ active: state.getIn(['compose', 'content_type']) === 'text/markdown',
+ ariaControls: 'markdown-input',
+});
+
+const mapDispatchToProps = dispatch => ({
+
+ onClick() {
+ dispatch(changeComposeContentType(this.active ? 'text/plain' : 'text/markdown'));
+ },
+
+});
+
+export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(TextIconButton));
diff --git a/app/soapbox/features/compose/containers/sensitive_button_container.js b/app/soapbox/features/compose/containers/sensitive_button_container.js
index dc98de561..3497c0009 100644
--- a/app/soapbox/features/compose/containers/sensitive_button_container.js
+++ b/app/soapbox/features/compose/containers/sensitive_button_container.js
@@ -12,6 +12,7 @@ const messages = defineMessages({
const mapStateToProps = state => ({
active: state.getIn(['compose', 'sensitive']),
+ disabled: state.getIn(['compose', 'spoiler']),
});
const mapDispatchToProps = dispatch => ({
@@ -26,12 +27,13 @@ class SensitiveButton extends React.PureComponent {
static propTypes = {
active: PropTypes.bool,
+ disabled: PropTypes.bool,
onClick: PropTypes.func.isRequired,
intl: PropTypes.object.isRequired,
};
render() {
- const { active, onClick, intl } = this.props;
+ const { active, disabled, onClick, intl } = this.props;
return (
@@ -41,6 +43,7 @@ class SensitiveButton extends React.PureComponent {
type='checkbox'
checked={active}
onChange={onClick}
+ disabled={disabled}
/>
diff --git a/app/soapbox/reducers/__tests__/alerts-test.js b/app/soapbox/reducers/__tests__/alerts-test.js
index f5af4a50f..ab935b45c 100644
--- a/app/soapbox/reducers/__tests__/alerts-test.js
+++ b/app/soapbox/reducers/__tests__/alerts-test.js
@@ -50,18 +50,18 @@ describe('alerts reducer', () => {
// });
it('should handle ALERT_CLEAR', () => {
- const state = ImmutableList([
- {
- key: 0,
- message: 'message_1',
- title: 'title_1',
- },
- {
- key: 1,
- message: 'message_2',
- title: 'title_2',
- },
- ]);
+ const state = ImmutableList([
+ {
+ key: 0,
+ message: 'message_1',
+ title: 'title_1',
+ },
+ {
+ key: 1,
+ message: 'message_2',
+ title: 'title_2',
+ },
+ ]);
const action = {
type: actions.ALERT_CLEAR,
};
diff --git a/app/soapbox/reducers/__tests__/compose-test.js b/app/soapbox/reducers/__tests__/compose-test.js
index c3ebe7ded..230036fe8 100644
--- a/app/soapbox/reducers/__tests__/compose-test.js
+++ b/app/soapbox/reducers/__tests__/compose-test.js
@@ -32,6 +32,7 @@ describe('compose reducer', () => {
default_sensitive: false,
idempotencyKey: null,
tagHistory: [],
+ content_type: 'text/markdown',
});
});
@@ -168,8 +169,18 @@ describe('compose reducer', () => {
});
});
+ it('should handle COMPOSE_SENSITIVITY_CHANGE on Mark Sensitive click, don\'t toggle if spoiler active', () => {
+ const state = ImmutableMap({ spoiler: true, sensitive: true, idempotencyKey: null });
+ const action = {
+ type: actions.COMPOSE_SENSITIVITY_CHANGE,
+ };
+ expect(reducer(state, action).toJS()).toMatchObject({
+ sensitive: true,
+ });
+ });
+
it('should handle COMPOSE_SENSITIVITY_CHANGE on Mark Sensitive click, toggle if spoiler inactive', () => {
- const state = ImmutableMap({ sensitive: true });
+ const state = ImmutableMap({ spoiler: false, sensitive: true });
const action = {
type: actions.COMPOSE_SENSITIVITY_CHANGE,
};
@@ -777,4 +788,11 @@ describe('compose reducer', () => {
// });
// });
+ it('sets the post content-type', () => {
+ const action = {
+ type: actions.COMPOSE_TYPE_CHANGE,
+ value: 'text/plain',
+ };
+ expect(reducer(undefined, action).toJS()).toMatchObject({ content_type: 'text/plain' });
+ });
});
diff --git a/app/soapbox/reducers/__tests__/notifications-test.js b/app/soapbox/reducers/__tests__/notifications-test.js
index 3831067ba..ef6d99d88 100644
--- a/app/soapbox/reducers/__tests__/notifications-test.js
+++ b/app/soapbox/reducers/__tests__/notifications-test.js
@@ -206,16 +206,16 @@ describe('notifications reducer', () => {
};
expect(reducer(state, action)).toEqual(ImmutableMap({
items: ImmutableList([
- ImmutableMap({
- id: '10743',
- type: 'favourite',
- account: '9v5c6xSEgAi3Zu1Lv6',
- created_at: '2020-06-10T02:51:05.000Z',
- status: '9vvNxoo5EFbbnfdXQu',
- emoji: undefined,
- is_seen: true,
- }),
- ]),
+ ImmutableMap({
+ id: '10743',
+ type: 'favourite',
+ account: '9v5c6xSEgAi3Zu1Lv6',
+ created_at: '2020-06-10T02:51:05.000Z',
+ status: '9vvNxoo5EFbbnfdXQu',
+ emoji: undefined,
+ is_seen: true,
+ }),
+ ]),
top: false,
unread: 2,
}));
diff --git a/app/soapbox/reducers/compose.js b/app/soapbox/reducers/compose.js
index 3af8e1468..28074b347 100644
--- a/app/soapbox/reducers/compose.js
+++ b/app/soapbox/reducers/compose.js
@@ -21,6 +21,7 @@ import {
COMPOSE_TAG_HISTORY_UPDATE,
COMPOSE_SENSITIVITY_CHANGE,
COMPOSE_SPOILERNESS_CHANGE,
+ COMPOSE_TYPE_CHANGE,
COMPOSE_SPOILER_TEXT_CHANGE,
COMPOSE_VISIBILITY_CHANGE,
COMPOSE_COMPOSING_CHANGE,
@@ -50,6 +51,7 @@ const initialState = ImmutableMap({
sensitive: false,
spoiler: false,
spoiler_text: '',
+ content_type: 'text/markdown',
privacy: null,
text: '',
focusDate: null,
@@ -94,6 +96,7 @@ function clearAll(state) {
map.set('text', '');
map.set('spoiler', false);
map.set('spoiler_text', '');
+ map.set('content_type', 'text/markdown');
map.set('is_submitting', false);
map.set('is_changing_upload', false);
map.set('in_reply_to', null);
@@ -114,7 +117,7 @@ function appendMedia(state, media) {
map.set('resetFileKey', Math.floor((Math.random() * 0x10000)));
map.set('idempotencyKey', uuid());
- if (prevSize === 0 && state.get('default_sensitive')) {
+ if (prevSize === 0 && (state.get('default_sensitive') || state.get('spoiler'))) {
map.set('sensitive', true);
}
});
@@ -211,7 +214,15 @@ export default function compose(state = initialState, action) {
.set('is_composing', false);
case COMPOSE_SENSITIVITY_CHANGE:
return state.withMutations(map => {
- map.set('sensitive', !state.get('sensitive'));
+ if (!state.get('spoiler')) {
+ map.set('sensitive', !state.get('sensitive'));
+ }
+
+ map.set('idempotencyKey', uuid());
+ });
+ case COMPOSE_TYPE_CHANGE:
+ return state.withMutations(map => {
+ map.set('content_type', action.value);
map.set('idempotencyKey', uuid());
});
case COMPOSE_SPOILERNESS_CHANGE:
@@ -219,6 +230,10 @@ export default function compose(state = initialState, action) {
map.set('spoiler_text', '');
map.set('spoiler', !state.get('spoiler'));
map.set('idempotencyKey', uuid());
+
+ if (!state.get('sensitive') && state.get('media_attachments').size >= 1) {
+ map.set('sensitive', true);
+ }
});
case COMPOSE_SPOILER_TEXT_CHANGE:
return state
@@ -242,6 +257,7 @@ export default function compose(state = initialState, action) {
map.set('focusDate', new Date());
map.set('caretPosition', null);
map.set('idempotencyKey', uuid());
+ map.set('content_type', 'text/markdown');
if (action.status.get('spoiler_text', '').length > 0) {
map.set('spoiler', true);
@@ -325,6 +341,7 @@ export default function compose(state = initialState, action) {
map.set('focusDate', new Date());
map.set('caretPosition', null);
map.set('idempotencyKey', uuid());
+ map.set('content_type', 'text/markdown');
if (action.status.get('spoiler_text').length > 0) {
map.set('spoiler', true);
diff --git a/app/styles/components/audio-player.scss b/app/styles/components/audio-player.scss
index 551e19bc9..7073f141a 100644
--- a/app/styles/components/audio-player.scss
+++ b/app/styles/components/audio-player.scss
@@ -173,11 +173,11 @@
white-space: nowrap;
overlow: hidden;
text-overflow: ellipsis;
- background: hsl( var(--brand-color_h), var(--brand-color_s), 20% );
+ background: hsl(var(--brand-color_h), var(--brand-color_s), 20%);
padding: 5px;
&__label {
- color: white;
+ color: #ffffff;
}
button {
diff --git a/app/styles/components/columns.scss b/app/styles/components/columns.scss
index c005a6e60..7e6bafdc0 100644
--- a/app/styles/components/columns.scss
+++ b/app/styles/components/columns.scss
@@ -260,7 +260,7 @@
position: absolute;
right: 0;
top: -49px;
-
+
@media screen and (max-width: $nav-breakpoint-2) {
top: -35px;
font-size: 14px;
diff --git a/app/styles/components/status.scss b/app/styles/components/status.scss
index 0d349764b..7137874de 100644
--- a/app/styles/components/status.scss
+++ b/app/styles/components/status.scss
@@ -1,3 +1,38 @@
+.status__content {
+ p,
+ li {
+ strong {
+ font-weight: bold;
+ }
+ }
+
+ p,
+ li {
+ em {
+ font-style: italic;
+ }
+ }
+
+ ul,
+ ol,
+ blockquote {
+ margin-bottom: 20px;
+ margin-left: 15px;
+ }
+
+ ul {
+ list-style: disc inside none;
+ }
+
+ ol {
+ list-style: decimal inside none;
+ }
+
+ blockquote p {
+ font-style: italic;
+ }
+}
+
.status__content--with-action {
cursor: pointer;
}