contenteditable divs should look like textareas

Signed-off-by: Arthur Schiwon <blizzz@arthur-schiwon.de>

3 files changed, 11 insertions, 9 deletions

diff --git a/core/css/guest.css b/core/css/guest.css
index dacf79b37bc..0c52d792f79 100644
--- a/core/css/guest.css
+++ b/core/css/guest.css
@@ -152,7 +152,7 @@ form #datadirField legend {
 							 applied to the button instead. */
 }
 
-input, textarea, select, button {
+input, textarea, select, button, div[contenteditable=true] {
 	font-family: 'Open Sans', Frutiger, Calibri, 'Myriad Pro', Myriad, sans-serif;
 }
 input {
@@ -662,16 +662,16 @@ p.info {
 	margin: -9px 0 0 -9px;
 }
 /* Css replaced elements don't have ::after nor ::before */
-img.icon-loading, object.icon-loading, video.icon-loading, button.icon-loading, textarea.icon-loading, input.icon-loading, select.icon-loading {
+img.icon-loading, object.icon-loading, video.icon-loading, button.icon-loading, textarea.icon-loading, input.icon-loading, select.icon-loading, div[contenteditable=true].icon-loading {
 	background-image: url('../img/loading.gif');
 }
-img.icon-loading-dark, object.icon-loading-dark, video.icon-loading-dark, button.icon-loading-dark, textarea.icon-loading-dark, input.icon-loading-dark, select.icon-loading-dark {
+img.icon-loading-dark, object.icon-loading-dark, video.icon-loading-dark, button.icon-loading-dark, textarea.icon-loading-dark, input.icon-loading-dark, select.icon-loading-dark, div[contenteditable=true].icon-loading-dark {
 	background-image: url('../img/loading-dark.gif');
 }
-img.icon-loading-small, object.icon-loading-small, video.icon-loading-small, button.icon-loading-small, textarea.icon-loading-small, input.icon-loading-small, select.icon-loading-small {
+img.icon-loading-small, object.icon-loading-small, video.icon-loading-small, button.icon-loading-small, textarea.icon-loading-small, input.icon-loading-small, select.icon-loading-small, div[contenteditable=true].icon-loading-small {
 	background-image: url('../img/loading-small.gif');
 }
-img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading-small-dark, button.icon-loading-small-dark, textarea.icon-loading-small-dark, input.icon-loading-small-dark, select.icon-loading-small-dark {
+img.icon-loading-small-dark, object.icon-loading-small-dark, video.icon-loading-small-dark, button.icon-loading-small-dark, textarea.icon-loading-small-dark, input.icon-loading-small-dark, select.icon-loading-small-dark, div[contenteditable=true].icon-loading-small-dark {
 	background-image: url('../img/loading-small-dark.gif');
 }
 @-webkit-keyframes rotate {
diff --git a/core/css/icons.scss b/core/css/icons.scss
index 6d855381fae..a4b209455fc 100644
--- a/core/css/icons.scss
+++ b/core/css/icons.scss
@@ -61,7 +61,7 @@
 }
 
 /* Css replaced elements don't have ::after nor ::before */
-img, object, video, button, textarea, input, select {
+img, object, video, button, textarea, input, select, div[contenteditable=true] {
 	.icon-loading {
 		background-image: url('../img/loading.gif');
 	}
diff --git a/core/css/inputs.scss b/core/css/inputs.scss
index eb7d20cf8af..5143ec518ed 100644
--- a/core/css/inputs.scss
+++ b/core/css/inputs.scss
@@ -13,7 +13,7 @@
  */
 
  /* Specifically override browser styles */
-input, textarea, select, button {
+input, textarea, select, button, div[contenteditable=true] {
 	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 {
@@ -24,7 +24,8 @@ input, textarea, select, button {
 select,
 button,
 input,
-textarea {
+textarea,
+div[contenteditable=true] {
 	width: 130px;
 	min-height: 32px;
 	box-sizing: border-box;
@@ -35,6 +36,7 @@ select,
 button, .button,
 input:not([type='range']),
 textarea,
+div[contenteditable=true],
 .pager li a {
 	margin: 3px 3px 3px 0;
 	padding: 7px 6px;
@@ -154,7 +156,7 @@ button, .button {
 	}
 }
 
-textarea {
+textarea, div[contenteditable=true] {
 	color: nc-lighten($color-main-text, 33%);
 	cursor: text;
 	font-family: inherit;