aboutsummaryrefslogtreecommitdiff
path: root/scripts/theme-studio/browser-gates.js
diff options
context:
space:
mode:
authorCraig Jennings <c@cjennings.net>2026-06-16 06:11:15 -0500
committerCraig Jennings <c@cjennings.net>2026-06-16 06:11:15 -0500
commit9e99749de911ffc5b375bc79ee664d498e4d76d6 (patch)
treef76652c5d684536598f8d510baf52f304c70d818 /scripts/theme-studio/browser-gates.js
parentcf882dfe168463471598d01205256131bc4e7f1b (diff)
downloaddotemacs-9e99749de911ffc5b375bc79ee664d498e4d76d6.tar.gz
dotemacs-9e99749de911ffc5b375bc79ee664d498e4d76d6.zip
feat(theme-studio): move the contrast verdict into a hover
The contrast column showed "5.4 PASS". The number's color already encodes the tier (green AAA, grey AA, red fail), so the PASS/FAIL word was redundant. I dropped it and put the WCAG meaning in the cell's hover via a pure contrastTitle helper. crHtml now renders just the colored number. verdictFor stays for the covered-overlay worst-case readout, which is unchanged.
Diffstat (limited to 'scripts/theme-studio/browser-gates.js')
-rw-r--r--scripts/theme-studio/browser-gates.js11
1 files changed, 11 insertions, 0 deletions
diff --git a/scripts/theme-studio/browser-gates.js b/scripts/theme-studio/browser-gates.js
index d0986b56b..7c8b05d3f 100644
--- a/scripts/theme-studio/browser-gates.js
+++ b/scripts/theme-studio/browser-gates.js
@@ -719,6 +719,17 @@ if(location.hash==='#ndtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){
PKGMAP[app][face]=seedFace(row[2]||{});buildPkgTable();
document.title='NDTEST '+(ok?'PASS':'FAIL');
const d=document.createElement('div');d.id='ndtest';d.textContent='NDTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);}
+// Contrast-cell gate (open with #crtest): the per-face contrast column shows a
+// bare colored number (no PASS/FAIL word); the WCAG verdict lives in the hover.
+if(location.hash==='#crtest'){let ok=true;const notes=[];const A=(c,n)=>{if(!c){ok=false;notes.push(n);}};
+ const app=curApp(),face=APPS[app].faces[0][0];buildPkgTable();
+ const cell=document.querySelector('#pkgbody tr[data-face="'+face+'"]').cells[5];
+ const span=cell&&cell.querySelector('span');
+ A(span&&/^\d+\.\d$/.test(span.textContent.trim()),'contrast cell is a bare number: '+(span&&span.textContent));
+ A(span&&!/PASS|FAIL/.test(span.textContent),'no PASS/FAIL word in the contrast cell');
+ A(span&&span.title&&/(passes|fails) WCAG/i.test(span.title),'contrast cell carries a WCAG hover: '+(span&&span.title));
+ document.title='CRTEST '+(ok?'PASS':'FAIL');
+ const d=document.createElement('div');d.id='crtest';d.textContent='CRTEST '+(ok?'PASS':'FAIL')+(notes.length?' fails='+notes.join(','):'');document.body.appendChild(d);}
// Box-cluster gate (open with #boxtest): the box control is a 2x2 cluster of
// four radio buttons (none / line / pressed / raised); the color swatch shows
// only while a box style is active.