diff --git a/default/settings.json b/default/settings.json
index c351ab04e..ce8c07738 100644
--- a/default/settings.json
+++ b/default/settings.json
@@ -113,6 +113,7 @@
"shadow_width": 2,
"main_text_color": "rgba(220, 220, 210, 1)",
"italics_text_color": "rgba(145, 145, 145, 1)",
+ "underline_text_color": "rgba(188, 231, 207, 1)",
"quote_text_color": "rgba(225, 138, 36, 1)",
"blur_tint_color": "rgba(23, 23, 23, 1)",
"user_mes_blur_tint_color": "rgba(0, 0, 0, 0.9)",
diff --git a/public/index.html b/public/index.html
index 74862b5b3..cf55313c9 100644
--- a/public/index.html
+++ b/public/index.html
@@ -3277,6 +3277,10 @@
Italics Text
+
+
+ Underlined Text
+
Quote Text
diff --git a/public/script.js b/public/script.js
index c4b2435bb..7820a86a0 100644
--- a/public/script.js
+++ b/public/script.js
@@ -689,6 +689,7 @@ function reloadMarkdownProcessor(render_formulas = false) {
literalMidWordUnderscores: true,
parseImgDimensions: true,
tables: true,
+ underline: true,
});
}
diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js
index 771640e00..cb7d52255 100644
--- a/public/scripts/power-user.js
+++ b/public/scripts/power-user.js
@@ -138,6 +138,7 @@ let power_user = {
main_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeBodyColor').trim()}`,
italics_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeEmColor').trim()}`,
+ underline_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeUnderlineColor').trim()}`,
quote_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeQuoteColor').trim()}`,
blur_tint_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeBlurTintColor').trim()}`,
chat_tint_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeChatTintColor').trim()}`,
@@ -255,6 +256,7 @@ const storage_keys = {
main_text_color: 'TavernAI_main_text_color',
italics_text_color: 'TavernAI_italics_text_color',
+ underline_text_color: 'TavernAI_underline_text_color',
quote_text_color: 'TavernAI_quote_text_color',
blur_tint_color: 'TavernAI_blur_tint_color',
chat_tint_color: 'TavernAI_chat_tint_color',
@@ -1039,6 +1041,9 @@ async function applyThemeColor(type) {
if (type === 'italics') {
document.documentElement.style.setProperty('--SmartThemeEmColor', power_user.italics_text_color);
}
+ if (type === 'underline') {
+ document.documentElement.style.setProperty('--SmartThemeUnderlineColor', power_user.underline_text_color);
+ }
if (type === 'quote') {
document.documentElement.style.setProperty('--SmartThemeQuoteColor', power_user.quote_text_color);
}
@@ -1131,6 +1136,7 @@ async function applyTheme(name) {
const themeProperties = [
{ key: 'main_text_color', selector: '#main-text-color-picker', type: 'main' },
{ key: 'italics_text_color', selector: '#italics-color-picker', type: 'italics' },
+ { key: 'underline_text_color', selector: '#underline-color-picker', type: 'underline' },
{ key: 'quote_text_color', selector: '#quote-color-picker', type: 'quote' },
{ key: 'blur_tint_color', selector: '#blur-tint-color-picker', type: 'blurTint' },
{ key: 'chat_tint_color', selector: '#chat-tint-color-picker', type: 'chatTint' },
@@ -1540,6 +1546,7 @@ function loadPowerUserSettings(settings, data) {
$('#main-text-color-picker').attr('color', power_user.main_text_color);
$('#italics-color-picker').attr('color', power_user.italics_text_color);
+ $('#underline-color-picker').attr('color', power_user.underline_text_color);
$('#quote-color-picker').attr('color', power_user.quote_text_color);
$('#blur-tint-color-picker').attr('color', power_user.blur_tint_color);
$('#chat-tint-color-picker').attr('color', power_user.chat_tint_color);
@@ -2048,6 +2055,7 @@ async function saveTheme(name = undefined) {
blur_strength: power_user.blur_strength,
main_text_color: power_user.main_text_color,
italics_text_color: power_user.italics_text_color,
+ underline_text_color: power_user.underline_text_color,
quote_text_color: power_user.quote_text_color,
blur_tint_color: power_user.blur_tint_color,
chat_tint_color: power_user.chat_tint_color,
@@ -2894,6 +2902,12 @@ $(document).ready(() => {
saveSettingsDebounced();
});
+ $('#underline-color-picker').on('change', (evt) => {
+ power_user.underline_text_color = evt.detail.rgba;
+ applyThemeColor('underline');
+ saveSettingsDebounced();
+ });
+
$('#quote-color-picker').on('change', (evt) => {
power_user.quote_text_color = evt.detail.rgba;
applyThemeColor('quote');
diff --git a/public/style.css b/public/style.css
index 35f4c2f96..21b929831 100644
--- a/public/style.css
+++ b/public/style.css
@@ -50,6 +50,7 @@
/*Default Theme, will be changed by ToolCool Color Picker*/
--SmartThemeBodyColor: rgb(220, 220, 210);
--SmartThemeEmColor: rgb(145, 145, 145);
+ --SmartThemeUnderlineColor: rgb(188, 231, 207);
--SmartThemeQuoteColor: rgb(225, 138, 36);
/* --SmartThemeFastUIBGColor: rgba(0, 0, 0, 0.9); */
--SmartThemeBlurTintColor: rgba(23, 23, 23, 1);
@@ -274,6 +275,11 @@ table.responsiveTable {
color: var(--SmartThemeEmColor);
}
+.mes_text u
+{
+ color: var(--SmartThemeUnderlineColor);
+}
+
.mes_text q {
color: var(--SmartThemeQuoteColor);
}