fix editing color messagebox

client/routes/router.js

@@ -85,9 +85,6 @@ FlowRouter.route('/account/:group?', {
 		}
 		params.group = _.capitalize(params.group, true);
 		BlazeLayout.render('main', { center: `account${ params.group }` });
-		if (params.group === 'Profile') {
-			$('.main-content').removeClass('rc-old');
-		}
 	},
 	triggersExit: [function() {
 		$('.main-content').addClass('rc-old');

packages/rocketchat-theme/client/imports/general/forms.css

@@ -226,6 +226,7 @@
 		border-color: #e1e5e8;
 		padding: 0.75rem 0;
 		align-items: flex-end;
+		transition: background-color 0.3s;
 
 		&.editing {
 			background-color: #fff5df;
@@ -237,7 +238,7 @@
 		max-height: 155px;
 		resize: none;
 		border: 0;
-    padding: 0px;
+		padding: 0;
 		background-color: transparent;
 		font-size: var(--input-font-size);
 

packages/rocketchat-ui/client/lib/chatMessages.js

@@ -132,8 +132,11 @@ this.ChatMessages = class ChatMessages {
 		this.editing.element = element;
 		this.editing.index = index;
 		this.editing.id = message._id;
-		element.classList.add('editing');
+		// TODO: stop set two elements
+		this.input.parentElement.classList.add('editing');
 		this.input.classList.add('editing');
+
+		element.classList.add('editing');
 		this.$input.closest('.message-form').addClass('editing');
 
 		if (message.attachments && message.attachments[0].description) {
@@ -152,9 +155,11 @@ this.ChatMessages = class ChatMessages {
 	clearEditing() {
 		if (this.editing.element) {
 			this.recordInputAsDraft();
+			// TODO: stop set two elements
+			this.input.classList.remove('editing');
+			this.input.parentElement.classList.remove('editing');
 
 			this.editing.element.classList.remove('editing');
-			this.input.classList.remove('editing');
 			this.$input.closest('.message-form').removeClass('editing');
 			delete this.editing.id;
 			delete this.editing.element;