Attempting to make elements theme aware

This commit is contained in:
tyler
2026-05-19 02:23:26 -04:00
parent ff3b75d129
commit f66264b92a
+12 -1
View File
@@ -907,8 +907,19 @@ FRONTEND_JS_TEMPLATE = r"""
aiContainer.id = 'ai-answers'; aiContainer.id = 'ai-answers';
const rootStyle = getComputedStyle(document.documentElement); const rootStyle = getComputedStyle(document.documentElement);
const getVar = (v, fb) => rootStyle.getPropertyValue(v).trim() || fb; const getVar = (v, fb) => rootStyle.getPropertyValue(v).trim() || fb;
const bg = getVar('--color-answer-background', '');
const answerFont = getVar('--color-answer-font', '');
// Detect light mode by checking if answer font is dark
const isLight = answerFont && (answerFont.includes('0,0,0') ||
answerFont.includes('#000') || answerFont.includes('#333') ||
answerFont.includes('#444') || answerFont.includes('rgb(0') ||
answerFont.includes('rgb(3') || answerFont.includes('rgb(4') ||
answerFont.includes('rgb(5') || answerFont.includes('rgb(6'));
const containerBg = isLight
? 'rgba(0,0,0,0.06)'
: (bg || 'var(--color-answer-background, #313338)');
aiContainer.style.cssText = [ aiContainer.style.cssText = [
`background: ${getVar('--color-answer-background', 'var(--color-answer-background, #313338)')}`, `background: ${containerBg}`,
'padding: 1rem', 'padding: 1rem',
'margin: 0 0 1rem 0', 'margin: 0 0 1rem 0',
`color: ${getVar('--color-answer-font', 'var(--color-answer-font, #fff)')}`, `color: ${getVar('--color-answer-font', 'var(--color-answer-font, #fff)')}`,