diff --git a/public/index.html b/public/index.html index 5e6ae3abd..998100c74 100644 --- a/public/index.html +++ b/public/index.html @@ -1225,6 +1225,10 @@
Italics Text +
+
+ + Quote Text
@@ -1911,4 +1915,4 @@
- \ No newline at end of file + diff --git a/public/script.js b/public/script.js index 13da25c7e..6db420317 100644 --- a/public/script.js +++ b/public/script.js @@ -884,7 +884,14 @@ function messageFormating(mes, ch_name, isSystem, forceAvatar) { mes = mes.replace(/{{(\*?.+?\*?)}}/g, ""); - mes = mes.replace(/\n/g, "
"); + mes = mes.replace(/(]*>[\s\S]*?<\/code>)|\"(.+?)\"/g, function(match, code, quote) { + if (code) { + return code; + } else { + return "" + quote + ""; + } + }); + mes = mes.replace(/\n/g, "
"); mes = mes.trim(); mes = mes.replace(/[\s\S]*?<\/code>/g, function (match) { diff --git a/public/scripts/power-user.js b/public/scripts/power-user.js index afd7d8c64..909464b2a 100644 --- a/public/scripts/power-user.js +++ b/public/scripts/power-user.js @@ -68,6 +68,7 @@ let power_user = { main_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeBodyColor').trim()}`, italics_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeEmColor').trim()}`, + quote_text_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeQuoteColor').trim()}`, fastui_bg_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeFastUIBGColor').trim()}`, blur_tint_color: `${getComputedStyle(document.documentElement).getPropertyValue('--SmartThemeBlurTintColor').trim()}`, @@ -87,6 +88,7 @@ const storage_keys = { main_text_color: "TavernAI_main_text_color", italics_text_color: "TavernAI_italics_text_color", + quote_text_color: "TavernAI_quote_text_color", fastui_bg_color: "TavernAI_fastui_bg_color", blur_tint_color: "TavernAI_blur_tint_color", blur_strength: "TavernAI_blur_strength", @@ -166,6 +168,9 @@ async function applyThemeColor(type) { if (type === 'italics') { document.documentElement.style.setProperty('--SmartThemeEmColor', power_user.italics_text_color); } + if (type === 'quote') { + document.documentElement.style.setProperty('--SmartThemeQuoteColor', power_user.quote_text_color); + } if (type === 'fastUIBG') { document.documentElement.style.setProperty('--SmartThemeFastUIBGColor', power_user.fastui_bg_color); } @@ -198,6 +203,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: 'quote_text_color', selector: '#quote-color-picker', type: 'quote' }, { key: 'fastui_bg_color', selector: '#fastui-bg-color-picker', type: 'fastUIBG' }, { key: 'blur_tint_color', selector: '#blur-tint-color-picker', type: 'blurTint' }, { @@ -284,6 +290,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); + $("#quote-color-picker").attr('color', power_user.quote_text_color); $("#fastui-bg-color-picker").attr('color', power_user.fastui_bg_color); $("#blur-tint-color-picker").attr('color', power_user.blur_tint_color); @@ -471,6 +478,12 @@ $(document).ready(() => { applyThemeColor('italics'); saveSettingsDebounced(); }); + + $("#quote-color-picker").on('change', (evt) => { + power_user.quote_text_color = evt.detail.rgba; + applyThemeColor('quote'); + saveSettingsDebounced(); + }); $("#fastui-bg-color-picker").on('change', (evt) => { power_user.fastui_bg_color = evt.detail.rgba; @@ -503,6 +516,7 @@ $(document).ready(() => { blur_strength: power_user.blur_strength, main_text_color: power_user.main_text_color, italics_text_color: power_user.italics_text_color, + quote_text_color: power_user.quote_text_color, fastui_bg_color: power_user.fastui_bg_color, blur_tint_color: power_user.blur_tint_color, }; diff --git a/public/style.css b/public/style.css index 4e81d540f..4d3fc0657 100644 --- a/public/style.css +++ b/public/style.css @@ -39,6 +39,7 @@ /*Default Theme, will be changed by ToolCool Color Picker*/ --SmartThemeBodyColor: rgb(220, 220, 210); --SmartThemeEmColor: rgb(175, 175, 175); + --SmartThemeQuoteColor: rgb(175, 175, 175); --SmartThemeFastUIBGColor: rgba(0, 0, 0, 0.9); --SmartThemeBlurTintColor: rgba(0, 0, 0, 0.5); --SmartThemeBlurStrength: calc(var(--blurStrength) * 1px); @@ -136,6 +137,12 @@ body { font-weight: 500; } +.mes_text q, +.mes_text blockquote { + color: var(--SmartThemeQuoteColor); + font-weight: 500; +} + .mes_text strong, .mes_text h2, .mes_text h1 { diff --git a/themes/Aqua Blue.json b/themes/Aqua Blue.json new file mode 100644 index 000000000..1cd4f5880 --- /dev/null +++ b/themes/Aqua Blue.json @@ -0,0 +1,8 @@ +{ + "name": "Aqua Blue", + "blur_strength": 2, + "main_text_color": "rgba(160, 190, 190, 1)", + "italics_text_color": "rgba(170, 200, 200, 1)", + "fastui_bg_color": "rgba(7, 54, 66, 0.9)", + "blur_tint_color": "rgba(0, 43, 54, 0.8)" +} \ No newline at end of file diff --git a/themes/Default (Dark).json b/themes/Default (Dark).json new file mode 100644 index 000000000..1997cd35e --- /dev/null +++ b/themes/Default (Dark).json @@ -0,0 +1,8 @@ +{ + "name": "Default (Dark)", + "blur_strength": 10, + "main_text_color": "rgb(220, 220, 210)", + "italics_text_color": "rgb(175, 175, 175)", + "fastui_bg_color": "rgba(0, 0, 0, 0.9)", + "blur_tint_color": "rgba(0, 0, 0, 0.5)" +} \ No newline at end of file diff --git a/themes/Megumin Red.json b/themes/Megumin Red.json new file mode 100644 index 000000000..c403a950b --- /dev/null +++ b/themes/Megumin Red.json @@ -0,0 +1,8 @@ +{ + "name": "Megumin Red", + "blur_strength": 10, + "main_text_color": "rgba(230, 230, 230, 1)", + "italics_text_color": "rgba(200, 200, 200, 1)", + "fastui_bg_color": "rgba(70, 5, 5, 0.9)", + "blur_tint_color": "rgba(50, 10, 10, 0.75)" +} \ No newline at end of file