Merge pull request #154 from LightSaveUs/UI2

Themes Update

static/koboldai.js

@@ -4445,4 +4445,4 @@ document.addEventListener("keydown", function(event) {
 			event.preventDefault();
 			break;
 }
-});
+});

themes/Darkness.css

@@ -1,7 +1,7 @@
 /*
 	Name: Darkness
 	Author: LightSaveUs
-	Version: 0.3.1
+	Version: 0.3.2
 	Description: A theme inspired by the AI Dungeon interface.
 */
 
@@ -217,20 +217,35 @@
 
 .btn-success {
 	color: #e0e0e0 !important;
-    background-color: #148883 !important;
     border-color: #148883 !important;
+    background-color: #148883 !important;
 }
 
 .toggle-off.btn {
 	color: #e0e0e0 !important;
-    background-color: #242424 !important;
 	border-color: #242424 !important;
+    background-color: #242424 !important;
 }
 
 .advanced_theme:hover {
 	filter: brightness(100%) !important;
 }
 
+/* Context Menu */
+
+#context-menu {
+	border-color: #333333 !important;
+	background-color: #1c1c1c !important;
+}
+
+#context-menu > hr {
+	border-color: #333333 !important;
+}
+
+.context-menu-item:hover {
+	background-color:#333333 !important;
+}
+
 /* Context Viewer */
 
 #context-viewer-header {
@@ -241,6 +256,12 @@
 	background-color: #242424 !important;
 }
 
+/* Finder */
+
+.result-highlight {
+    background-color: #148883 !important;
+}
+
 /* Icons */
 
 .collapsable_header .material-icons-outlined {
@@ -266,9 +287,9 @@ a {
 }
 
 .form-control {
+	border: none;
     color: #555 !important;
     background-color: #424243 !important;
-	border: none;
 }
 
 /* Lines */
@@ -319,14 +340,14 @@ a {
 
 .popup_load_cancel_button:hover {
 	color: #e0e0e0 !important;
-    background-color: #424243 !important;
 	border-color: #e0e0e0 !important;
+    background-color: #424243 !important;
 }
 
 #error_message.popup .btn-primary {
-    background-color: #424243 !important;
     color: #e0e0e0 !important;
     border-color: #e0e0e0 !important;
+    background-color: #424243 !important;
 }
 
 
@@ -343,8 +364,8 @@ a {
 }
 
 .tabrow span.selected {
-    background: #1c1c1c !important;
     color: #e0e0e0 !important;
+    background: #1c1c1c !important;
 }
 
 /* Text */
@@ -356,7 +377,7 @@ a {
 /* World Info */
 
 .world_info_text {
-	border-color: #242424 !important;
 	margin: 0 0px 0px !important;
+	border-color: #242424 !important;
 	background-color: #3b3b3b !important;
 }

themes/Monochrome.css

@@ -1,7 +1,7 @@
 /*
 	Name: Monochrome
 	Author: LightSaveUs
-	Version: 0.6
+	Version: 0.6.1
 	Description: A theme inspired by the NovelAI interface.
 */
 
@@ -220,8 +220,8 @@
 
 .btn-success {
 	color: #131c22 !important;
-    background-color: #cfd7a2 !important;
     border-color: #cfd7a2 !important;
+    background-color: #cfd7a2 !important;
 }
 
 .toggle-off.btn {
@@ -242,6 +242,21 @@
 	filter: brightness(120%) !important;
 }
 
+/* Context Menu */
+
+#context-menu {
+	border-color: #334552 !important;
+	background-color: #18222a !important;
+}
+
+#context-menu > hr {
+	border-color: #334552 !important;
+}
+
+.context-menu-item:hover {
+	background-color:#334552 !important;
+}
+
 /* Context Viewer */
 
 #context-viewer-header {
@@ -252,6 +267,12 @@
 	background-color: #273141 !important;
 }
 
+/* Finder */
+
+.result-highlight {
+    background-color: #9ba950 !important;
+}
+
 /* Icons */
 
 .material-icons-outlined:hover {
@@ -278,8 +299,8 @@ a {
 }
 
 .form-control {
-    background-color: #25323d !important;
 	border: none;
+    background-color: #25323d !important;
 }
 
 /* Lines */
@@ -326,10 +347,10 @@ a {
 }
 
 .popup_load_cancel_button:hover {
-	filter: brightness(120%) !important;
 	color: #e0e0e0 !important;
     background-color: #30435b !important;
 	border-color: #ffffff00 !important;
+	filter: brightness(120%) !important;
 }
 
 /* Tabs */

themes/Nostalgia.css

@@ -1,7 +1,7 @@
 /*
 	Name: Nostalgia
 	Author: LightSaveUs
-	Version: 0.2.1
+	Version: 0.2.2
 	Description: A theme inspired by the previous KoboldAI interface.
 */
 
@@ -222,10 +222,19 @@
 	filter: brightness(80%);
 }
 
-/* Flyout */
+/* Context Menu */
 
-.rightSideMenu {
+#context-menu {
-	background-color: #212122 !important;
+	border-color: #12324f !important;
+	background-color: #294f71 !important;
+}
+
+#context-menu > hr {
+	border-color: #12324f !important;
+}
+
+.context-menu-item:hover {
+	background-color:#12324f !important;
 }
 
 /* Context Viewer */
@@ -238,6 +247,18 @@
 	background-color: #404040 !important;
 }
 
+/* Finder */
+
+.result-highlight {
+    background-color: #3bf723f0 !important;
+}
+
+/* Flyout */
+
+.rightSideMenu {
+	background-color: #212122 !important;
+}
+
 /* Icons */
 
 .collapsable_header .material-icons-outlined {
@@ -295,16 +316,16 @@ a {
 }
 
 .popup_load_cancel_button:hover {
-	color: #ffffff !important;
-    background-color: #337ab7 !important;
-	border-color: #ffffff !important;
 	filter: brightness(80%);
+	color: #ffffff !important;
+	border-color: #ffffff !important;
+    background-color: #337ab7 !important;
 }
 
 #error_message.popup .btn-primary {
-    background-color: #337ab7 !important;
     color: #ffffff !important;
     border-color: #ffffff !important;
+    background-color: #337ab7 !important;
 }
 
 /* Tabs */
@@ -342,21 +363,21 @@ a {
 
 div#settings_footer.settings_footer {
 	color: #ffffff !important;
-	background-color: #294f71 !important;
 	border-color: #12324f !important;
+	background-color: #294f71 !important;
 }
 
 /* World Info */
 
 .world_info_tag_area {
+	border-color: #999999!important;
     filter: brightness(100%) !important;
 	background-color: #404040 !important;
-	border-color: #999999!important;
 }
 
 .world_info_text {
+	margin: 0 0px 0px !important;
+    border-color: #999999!important;
 	filter: brightness(100%) !important;
 	background-color: #404040 !important;
-    border-color: #999999!important;
-	margin: 0 0px 0px !important;
 }

themes/Unicorn.css

@@ -1,7 +1,7 @@
 /*
 	Name: Unicorn
 	Author: LightSaveUs
-	Version: 0.3.2
+	Version: 0.3.3
 	Description: A theme inspired by the DreamilyAI interface.
 */
 
@@ -246,6 +246,23 @@
 	filter: brightness(100%) !important;
 }
 
+/* Context Menu */
+
+#context-menu {
+	color: #222224;
+	border-color: #c9c9c9 !important;
+	background-color: #e8e8e8 !important;
+}
+
+#context-menu > hr {
+	border-color: #c9c9c9 !important;
+}
+
+.context-menu-item:hover {
+	color: #222224;
+	background-color:#c9c9c9 !important;
+}
+
 /* Context Viewer */
 
 #context-viewer-header {
@@ -256,6 +273,20 @@
 	background-color: #e8e8e8 !important;
 }
 
+/* Finder */
+
+#finder {
+	color: #222224!important;
+}
+
+.result-highlight {
+    background-color: #e26771 !important;
+}
+
+.finder-wi-block {
+	color: #222224;
+}
+
 /* Icons */
 
 span.material-icons-outlined.cursor.search_icon {
@@ -267,8 +298,8 @@ span.material-icons-outlined.cursor.search_icon {
 }
 
 .pinned .menu_pin, .pinned .story_menu_pin {
-    filter: brightness(100%) !important;
     color: #464646 !important;
+    filter: brightness(100%) !important;
 }
 
 .material-icons-outlined:hover {
@@ -282,9 +313,9 @@ a {
 }
 
 .form-control {
+	border: none;
 	transform: translateX(6px)!important;
     background-color: #e2e2e2 !important;
-	border: none;
 }
 
 /* Lines */
@@ -333,8 +364,8 @@ select#wpp_format_0.settings_select {
 
 .popup_load_cancel_button:hover {
 	color: #e26771 !important;
-    background-color: #e9cece !important;
 	border-color: #e26771 !important;
+    background-color: #e9cece !important;
 }
 
 /* Tabs */
@@ -350,8 +381,8 @@ select#wpp_format_0.settings_select {
 }
 
 .tabrow span.selected {
+     color: #f2f1f1 !important;
     background: #e26771 !important;
-    color: #f2f1f1 !important;
 }
 
 /* Text */
@@ -376,8 +407,8 @@ select#wpp_format_0.settings_select {
 
 .world_info_text {
 	color: #222224 !important;
+	margin: 0 0px 0px !important;
+    border-color: #acacac !important;
 	filter: brightness(100%) !important;
 	background-color: #eeeeee !important;
-    border-color: #acacac !important;
-	margin: 0 0px 0px !important;
 }