Add help info

static/koboldai.css

@@ -1547,3 +1547,25 @@ h2 .material-icons-outlined {
 .flyout_menu_contents {
   scrollbar-width: thin;
 }
+
+.section_header, .help_text {
+	-webkit-touch-callout: none;
+	-webkit-user-select: none;
+	-khtml-user-select: none;
+	-moz-user-select: none;
+	-ms-user-select: none;
+	user-select: none;
+}
+
+.section_header {
+	margin-left: 2px;
+	margin-bottom: 4px;
+}
+
+.help_text {
+	margin-left: 6px;
+	margin-bottom: 0.7em;
+	opacity: 0.7;
+	font-size: 0.9em;
+	display: block;
+}

templates/settings flyout.html

@@ -98,6 +98,7 @@
 			<div onclick="toggle_setting_category(this);">
 				<h4 style="width:var(--flyout_menu_width);"><span class="material-icons-outlined cursor">expand_more</span> Sampling</h4>
 			</div>
+			<span class="help_text">Change how the AI decides what to say.</span>
 			<div class="setting_tile_area">
 				<div class="setting_container_single">
 					<!---Top Row---->
@@ -134,6 +135,7 @@
 			<div onclick="toggle_setting_category(this);">
 				<h4 style="width:var(--flyout_menu_width);"><span class="material-icons-outlined cursor">expand_more</span> Repetition</h4>
 			</div>
+			<span class="help_text">Change how the AI combats repetition.</span>
 			<div class="setting_tile_area">
 				{% with sub_path='Repetition' %}
 					{% include 'settings item.html' %}
@@ -175,6 +177,7 @@
 		<div onclick="toggle_setting_category(this);">
 			<h4 style="width:var(--flyout_menu_width);"><span class="material-icons-outlined cursor">expand_more</span> Biasing</h4>
 		</div>
+		<span class="help_text">Influence the likelyhood for the AI to output certain phrases.</span>
 		<div id="biasing">
 			<div class="bias_header">
 				<div class="bias_header_phrase">Phrase</div>

templates/story flyout.html

@@ -29,12 +29,20 @@
 <div class="flyout_menu_contents">
 	<div id="story_menu_memory" class="story_category_area">
 		<div id="Memory">
-			Memory:<br/>
+			<h4 class="section_header">Memory</h4>
+			<span class="help_text">
+				Important information the AI should always keep in mind.
+			</span>
 			<textarea rows=20 id="memory" class="var_sync_story_memory var_sync_alt_story_memory_length fullwidth" onchange='sync_to_server(this);' autocomplete="off"></textarea>
 		</div>
 	</div>
 	<div id="story_menu_author" class="story_category_area hidden">
 		<div id="author_notes">
+			<h4 class="section_header">Author's Note</h4>
+			<span class="help_text">
+				Heavily influences the direction and style of the AI's writing.
+			</span>
+
 			Template:<br/>
 			<input autocomplete="off" type=text class="var_sync_story_authornotetemplate fullwidth" onchange='sync_to_server(this);'><br/>
 			Author's Notes:<br/>
@@ -51,11 +59,19 @@
 	</div>
 	<div id="story_menu_notes" class="story_category_area hidden">
 		<div id="Notes">
-			Notes (ignored by AI):<br/>
+			<h4 class="section_header">Notes</h4>
+			<span class="help_text">
+				Notes about the story. These notes are not read by the AI!
+			</span>
 			<textarea autocomplete="off" rows=20 class="var_sync_story_notes fullwidth" onchange='sync_to_server(this);'></textarea>
 		</div>
 	</div>
 	<div id="story_menu_wi" class="story_category_area hidden">
+		<h4 class="section_header">World Info</h4>
+		<span class="help_text">
+			Stores long-term information that is recalled by the AI when certain words are used.
+			<span class="helpicon material-icons-outlined" title="Use this instead of Memory for information on things like characters, objects, events, places, and anything else with detail.">help_icon</span>
+		</span>
 		<div class="setting_tile_area">
 		{% with menu='World Info' %}
 			{% with sub_path='' %}