From 6aae1f497f680355b0e51242c4195cf75803056d Mon Sep 17 00:00:00 2001
From: EllangoK <karun.ellango7@gmail.com>
Date: Mon, 1 May 2023 13:16:19 -0400
Subject: [PATCH 1/2] style context menu fix graphdialog background, and
 palette template

---
 web/extensions/core/colorPalette.js | 17 +++++++++++++++
 web/style.css                       | 34 ++++++++++++++++++++++++-----
 2 files changed, 45 insertions(+), 6 deletions(-)

diff --git a/web/extensions/core/colorPalette.js b/web/extensions/core/colorPalette.js
index 41541a8d..2f2238a2 100644
--- a/web/extensions/core/colorPalette.js
+++ b/web/extensions/core/colorPalette.js
@@ -232,10 +232,27 @@ app.registerExtension({
 				"name": "My Color Palette",
 				"colors": {
 					"node_slot": {
+					},
+					"litegraph_base": {
+					},
+					"comfy_base": {
 					}
 				}
 			};
 
+			// Copy over missing keys from default color palette
+			const defaultColorPalette = colorPalettes[defaultColorPaletteId];
+			for (const key in defaultColorPalette.colors.litegraph_base) {
+				if (!colorPalette.colors.litegraph_base[key]) {
+					colorPalette.colors.litegraph_base[key] = "";
+				}
+			}
+			for (const key in defaultColorPalette.colors.comfy_base) {
+				if (!colorPalette.colors.comfy_base[key]) {
+					colorPalette.colors.comfy_base[key] = "";
+				}
+			}
+
 			return completeColorPalette(colorPalette);
 		};
 
diff --git a/web/style.css b/web/style.css
index eced33d2..6ef3a4c2 100644
--- a/web/style.css
+++ b/web/style.css
@@ -257,8 +257,11 @@ button.comfy-queue-btn {
 	}
 }
 
+/* Input popup */
+
 .graphdialog {
 	min-height: 1em;
+	background-color: var(--comfy-menu-bg);
 }
 
 .graphdialog .name {
@@ -282,18 +285,37 @@ button.comfy-queue-btn {
 	border-radius: 12px 0 0 12px;
 }
 
+/* Context menu */
+
 .litegraph .litemenu-entry.has_submenu {
 	position: relative;
 	padding-right: 20px;
- }
+}
 
- .litemenu-entry.has_submenu::after {
+.litemenu-entry.has_submenu::after {
 	content: ">";
 	position: absolute;
 	top: 0;
 	right: 2px;
- }
- 
- .litecontextmenu {
+}
+
+.litecontextmenu {
 	z-index: 9999 !important;
-}
\ No newline at end of file
+}
+
+.litegraph.litecontextmenu {
+	background-color: var(--comfy-menu-bg) !important;
+	filter: brightness(95%);
+	color: var(--input-text) !important;
+}
+
+.litegraph.litecontextmenu .litemenu-entry:hover:not(.disabled):not(.separator) {
+	background-color: var(--comfy-menu-bg) !important;
+	filter: brightness(155%);
+	color: var(--input-text) !important;
+}
+
+.litegraph.litecontextmenu .litemenu-entry.submenu {
+	background-color: var(--comfy-menu-bg) !important;
+	color: var(--input-text) !important;
+}

From 81bee39ca0540aa7bbab275bb6bb9f156e72addd Mon Sep 17 00:00:00 2001
From: EllangoK <karun.ellango7@gmail.com>
Date: Mon, 1 May 2023 15:57:10 -0400
Subject: [PATCH 2/2] style everything styles searchbox, should be actually
 everything

---
 web/style.css | 43 ++++++++++++++++++++++++++++++++++++-------
 1 file changed, 36 insertions(+), 7 deletions(-)

diff --git a/web/style.css b/web/style.css
index 6ef3a4c2..df220cc0 100644
--- a/web/style.css
+++ b/web/style.css
@@ -299,23 +299,52 @@ button.comfy-queue-btn {
 	right: 2px;
 }
 
-.litecontextmenu {
+.litegraph.litecontextmenu,
+.litegraph.litecontextmenu.dark {
 	z-index: 9999 !important;
-}
-
-.litegraph.litecontextmenu {
 	background-color: var(--comfy-menu-bg) !important;
 	filter: brightness(95%);
-	color: var(--input-text) !important;
 }
 
 .litegraph.litecontextmenu .litemenu-entry:hover:not(.disabled):not(.separator) {
 	background-color: var(--comfy-menu-bg) !important;
 	filter: brightness(155%);
+	color: var(--input-text);
+}
+
+.litegraph.litecontextmenu .litemenu-entry.submenu,
+.litegraph.litecontextmenu.dark .litemenu-entry.submenu {
+	background-color: var(--comfy-menu-bg) !important;
+	color: var(--input-text);
+}
+
+.litegraph.litecontextmenu input {
+	background-color: var(--comfy-input-bg) !important;
 	color: var(--input-text) !important;
 }
 
-.litegraph.litecontextmenu .litemenu-entry.submenu {
+/* Search box */
+
+.litegraph.litesearchbox {
+	z-index: 9999 !important;
 	background-color: var(--comfy-menu-bg) !important;
-	color: var(--input-text) !important;
+	overflow: hidden;
+}
+
+.litegraph.litesearchbox input,
+.litegraph.litesearchbox select {
+	background-color: var(--comfy-input-bg) !important;
+	color: var(--input-text);
+}
+
+.litegraph.lite-search-item {
+	color: var(--input-text);
+	background-color: var(--comfy-input-bg);
+	filter: brightness(80%);
+	padding-left: 0.2em;
+}
+
+.litegraph.lite-search-item.generic_type {
+	color: var(--input-text);
+	filter: brightness(50%);
 }