FIX: Adjusted the composer preview to avoid odd scroll issue

This commit is contained in:
Kris 2017-12-06 11:28:12 -05:00
parent 7c3a087ef5
commit f559275b14
4 changed files with 19 additions and 18 deletions

View File

@ -75,7 +75,7 @@ export default Ember.Component.extend({
_composerEditorInit() { _composerEditorInit() {
const topicId = this.get('topic.id'); const topicId = this.get('topic.id');
const $input = this.$('.d-editor-input'); const $input = this.$('.d-editor-input');
const $preview = this.$('.d-editor-preview'); const $preview = this.$('.d-editor-preview-wrapper');
$input.autocomplete({ $input.autocomplete({
template: findRawTemplate('user-selector-autocomplete'), template: findRawTemplate('user-selector-autocomplete'),
@ -180,7 +180,7 @@ export default Ember.Component.extend({
}, },
_teardownInputPreviewSync() { _teardownInputPreviewSync() {
[this.$('.d-editor-input'), this.$('.d-editor-preview')].forEach($element => { [this.$('.d-editor-input'), this.$('.d-editor-preview-wrapper')].forEach($element => {
$element.off("mouseenter touchstart"); $element.off("mouseenter touchstart");
$element.off("scroll"); $element.off("scroll");
}); });

View File

@ -64,7 +64,6 @@
margin-left: 1%; margin-left: 1%;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
background: $secondary;
} }
.d-editor-button-bar { .d-editor-button-bar {
@ -101,11 +100,15 @@
display: inline-block; display: inline-block;
} }
.d-editor-preview-wrapper {
overflow: auto;
cursor: default;
}
.d-editor-input, .d-editor-input,
.d-editor-preview { .d-editor-preview {
box-sizing: border-box; box-sizing: border-box;
flex: 1 1 100%; flex: 1 1 100%;
height: 100%;
width: 100%; width: 100%;
margin: 0; margin: 0;
min-height: auto; min-height: auto;
@ -119,22 +122,21 @@
} }
} }
.d-editor-plugin {
display: flex;
overflow: auto;
}
.d-editor-input { .d-editor-input {
border: 0; border: 0;
padding: 10px; padding: 10px;
height: 100%;
overflow-x: hidden; overflow-x: hidden;
resize: none; resize: none;
} }
.d-editor-preview { .d-editor-preview {
height: auto;
}
.d-editor-plugin {
display: flex;
overflow: auto; overflow: auto;
cursor: default;
padding: 0 10px;
} }
.composing-whisper .d-editor-preview { .composing-whisper .d-editor-preview {

View File

@ -17,21 +17,19 @@
} }
.edit-title { .edit-title {
.d-editor-preview { .d-editor-preview-wrapper {
margin-top: -43px; margin-top: -43px;
} }
&:not(.private-message) { &:not(.private-message) {
.d-editor-preview { .d-editor-preview-wrapper {
@media screen and (max-width: 955px) { @media screen and (max-width: 955px) {
margin-top: -79px; margin-top: -79px;
} }
} }
} }
.with-tags { .with-tags {
.d-editor-preview { .d-editor-preview-wrapper {
margin-top: -79px; margin-top: -79px;
@media screen and (max-width: 900px) { @media screen and (max-width: 900px) {
margin-top: -116px; margin-top: -116px;

View File

@ -89,9 +89,10 @@
background-color: $secondary; background-color: $secondary;
max-width: 100%; max-width: 100%;
margin: 0; margin: 0;
padding: 10px;
overflow: auto;
.d-editor-preview { .d-editor-preview {
margin-bottom: 40px; margin-bottom: 40px;
overflow: auto;
} }
} }
.btn.hide-preview { .btn.hide-preview {