From bbe00079cc948fd7f9e96be15688e23feb8367c1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= <danxuliu@gmail.com>
Date: Thu, 23 Nov 2017 14:34:09 +0100
Subject: [PATCH 1/2] Fix input field not disabled while a comment is being
 sent
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Since the change of the text area to a content editable div the input
field was no longer disabled while a new comment was being sent. It was
caused by still trying to disable the div using the "disabled" property,
which works only on real input fields; when using a content editable div
the way to disable it is by setting "contenteditable" to "false".

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 apps/comments/js/commentstabview.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/apps/comments/js/commentstabview.js b/apps/comments/js/commentstabview.js
index 7398a709421d5..0f5465600d1a2 100644
--- a/apps/comments/js/commentstabview.js
+++ b/apps/comments/js/commentstabview.js
@@ -320,7 +320,7 @@
 				this.$container.append($comment);
 			}
 			this._postRenderItem($comment);
-			$('#commentsTabView').find('.newCommentForm div.message').text('').prop('disabled', false);
+			$('#commentsTabView').find('.newCommentForm div.message').text('').prop('contenteditable', true);
 
 			// we need to update the model, because it consists of client data
 			// only, but the server might add meta data, e.g. about mentions
@@ -620,7 +620,7 @@
 				return;
 			}
 
-			$commentField.prop('disabled', true);
+			$commentField.prop('contenteditable', false);
 			$submit.addClass('hidden');
 			$loading.removeClass('hidden');
 
@@ -673,7 +673,7 @@
 		_onSubmitError: function($form, commentId) {
 			$form.find('.submit').removeClass('hidden');
 			$form.find('.submitLoading').addClass('hidden');
-			$form.find('.message').prop('disabled', false);
+			$form.find('.message').prop('contenteditable', true);
 
 			if(!_.isUndefined(commentId)) {
 				OC.Notification.show(t('comments', 'Error occurred while updating comment with id {id}', {id: commentId}), {type: 'error'});

From b248c53c6a8a2d420256921ca4889fc553ce8fee Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Daniel=20Calvi=C3=B1o=20S=C3=A1nchez?= <danxuliu@gmail.com>
Date: Thu, 23 Nov 2017 16:37:43 +0100
Subject: [PATCH 2/2] Make "contenteditable=false" divs look like disabled
 input fields
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Daniel Calviño Sánchez <danxuliu@gmail.com>
---
 core/css/inputs.scss | 29 +++++++++++++++++++++++++++--
 1 file changed, 27 insertions(+), 2 deletions(-)

diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index 20e8cbf08e0d2..00e0e47f9a871 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -13,7 +13,7 @@
  */
 
  /* Specifically override browser styles */
-input, textarea, select, button, div[contenteditable=true] {
+input, textarea, select, button, div[contenteditable=true], div[contenteditable=false] {
 	font-family: 'Open Sans', Frutiger, Calibri, 'Myriad Pro', Myriad, sans-serif;
 }
 .select2-container-multi .select2-choices .select2-search-field input, .select2-search input, .ui-widget {
@@ -25,7 +25,8 @@ select,
 button,
 input,
 textarea,
-div[contenteditable=true] {
+div[contenteditable=true],
+div[contenteditable=false] {
 	width: 130px;
 	min-height: 32px;
 	box-sizing: border-box;
@@ -88,6 +89,23 @@ div[contenteditable=true],
 	}
 }
 
+div[contenteditable=false] {
+	margin: 3px 3px 3px 0;
+	padding: 7px 6px;
+	font-size: 13px;
+	background-color: $color-main-background;
+	color: nc-lighten($color-main-text, 33%);
+	border: 1px solid nc-darken($color-main-background, 14%);
+	outline: none;
+	border-radius: $border-radius;
+	cursor: text;
+
+	background-color: nc-darken($color-main-background, 8%);
+	color: rgba($color-main-text, 0.4);
+	cursor: default;
+	opacity: 0.5;
+}
+
 /* Specific override */
 input {
 	&:not([type='radio']):not([type='checkbox']):not([type='range']):not([type='submit']):not([type='button']):not([type='reset']):not([type='color']):not([type='file']):not([type='image']) {
@@ -171,6 +189,13 @@ textarea, div[contenteditable=true] {
 	}
 }
 
+div[contenteditable=false] {
+	color: nc-lighten($color-main-text, 33%);
+	cursor: text;
+	font-family: inherit;
+	height: auto;
+}
+
 /* Override the ugly select arrow */
 select {
 	-webkit-appearance: none;