From 1569aa768c3ad001b72d663ca564d8e4d628f1a4 Mon Sep 17 00:00:00 2001
From: Suraj Shetty <surajshetty3416@gmail.com>
Date: Thu, 27 Jan 2022 15:12:04 +0530
Subject: [PATCH 1/2] fix: Code block style

---
 frappe/public/scss/common/css_variables.scss |  4 ++++
 frappe/public/scss/common/quill.scss         | 12 ++++++++++++
 2 files changed, 16 insertions(+)

diff --git a/frappe/public/scss/common/css_variables.scss b/frappe/public/scss/common/css_variables.scss
index 5cc030516f..f4794362d3 100644
--- a/frappe/public/scss/common/css_variables.scss
+++ b/frappe/public/scss/common/css_variables.scss
@@ -231,6 +231,10 @@
 
 	--highlight-shadow: 1px 1px 10px var(--blue-50), 0px 0px 4px var(--blue-600);
 
+	// code block
+	--code-block-bg: var(--gray-900);
+	--code-block-text: var(--gray-400);
+
 	// Border Sizes
 	--border-radius-sm: 4px;
 	--border-radius: 6px;
diff --git a/frappe/public/scss/common/quill.scss b/frappe/public/scss/common/quill.scss
index a243acba5f..69bb62ef24 100644
--- a/frappe/public/scss/common/quill.scss
+++ b/frappe/public/scss/common/quill.scss
@@ -85,10 +85,22 @@
 	margin-bottom: 8px;
 }
 
+.ql-code-block-container {
+	background-color: var(--code-block-bg);
+	color: var(--code-block-text);
+	padding: var(--padding-xs) var(--padding-sm) !important;
+	margin-bottom: var(--margin-xs) !important;
+	margin-top: var(--margin-xs)!important;
+	border-radius: var(--border-radius-sm);
+}
+
 .ql-bubble .ql-editor {
 	min-height: 100px;
 	max-height: 300px;
 	border-radius: var(--border-radius-sm);
+	.ql-code-block-container {
+		@extend .ql-code-block-container;
+	}
 }
 
 .ql-mention-list-container {

From 0b2015f49890857ba9c17c85a3c28af10715053d Mon Sep 17 00:00:00 2001
From: Suraj Shetty <surajshetty3416@gmail.com>
Date: Thu, 27 Jan 2022 15:17:38 +0530
Subject: [PATCH 2/2] fix: Make text-editor resizable

---
 frappe/public/scss/common/quill.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frappe/public/scss/common/quill.scss b/frappe/public/scss/common/quill.scss
index 69bb62ef24..3d5ce61c15 100644
--- a/frappe/public/scss/common/quill.scss
+++ b/frappe/public/scss/common/quill.scss
@@ -42,6 +42,7 @@
 		height: 300px;
 		border-bottom-left-radius: var(--border-radius);
 		border-bottom-right-radius: var(--border-radius);
+		resize: vertical;
 	}
 	.ql-stroke {
 		stroke: var(--icon-stroke);