I improved the script php_manual_prefs.js provided with the extended chm-version to better hilight user comments and code samples as I found those in the original version too dull (gray). Note that this all cannot be done using stylesheets only as the code samples in the chm-docs do not have any distinct classes etc and can only be parsed with a script. What I added to the original script follows. The timeouts are used because the page is not loaded right at once so we have to wait for complete loading. The colors (aColorMap) can be customized. This also improves navigation links positioning in short pages, so instead of directly following contents they are now bottom-aligned. This fix needs some extra styles so they follow the code, along with some general styles.
setTimeout("AddStyles(); window.focus();", 50);
//-----------
var D, TimerId, oNav, oPage;
function AddStyles(){
D=document; ChangeExamples(); ChangeNotes();
}
function ChangeExamples(){
var aDivs, DivNo, oDiv, aSpans, SpanNo, oSpan, aColorMap, Color, aCodes;
aColorMap=[];
aColorMap['#007700']='yellow';
aColorMap['#0000bb']='white';
aColorMap['#dd0000']='yellow';
aColorMap['#ff8000']='Aqua';
//aColorMap['']='';
//Scan examples
aDivs=D.getElementsByTagName('DIV');
for(DivNo=0; DivNo<aDivs.length; DivNo++){
oDiv=aDivs[DivNo];
if (oDiv.className!='examplecode') continue;
//Change colors
oDiv.style.backgroundColor='black';
oDiv.style.backgroundImage='none';
//oDiv.style.color='white';
aSpans=oDiv.getElementsByTagName('SPAN');
for(SpanNo=0; SpanNo<aSpans.length; SpanNo++){
oSpan=aSpans[SpanNo];
Color=oSpan.style.color;
oSpan.style.color=aColorMap[Color];
if (Color=='#dd0000') oSpan.style.backgroundColor='DarkRed';
oSpan.style.fontFamily='Lucida Console';
}
aCodes=oDiv.getElementsByTagName('CODE');
for(SpanNo=0; SpanNo<aCodes.length; SpanNo++){
oSpan=aCodes[SpanNo];
oSpan.style.color='yellow';
oSpan.style.fontFamily='Lucida Console';
}
}
}
function ChangeNotes(){
var oNotes, oDiv, aDivs, DivNo, oP, aPs;
oNotes=D.getElementById('pageNotes');
if (!oNotes){
setTimeout('ChangeNotes();', 100); return;
}
aDivs=oNotes.getElementsByTagName('DIV');
for(DivNo=0; DivNo<aDivs.length; DivNo++){
oDiv=aDivs[DivNo];
aPs=oDiv.getElementsByTagName('P');
oP=aPs[0];
oP.style.backgroundColor='DarkGreen';
oP.style.color='yellow';
oP.style.marginBottom='0px';
oP=aPs[1];
oP.style.backgroundColor='LightYellow';
oP.firstChild.style.fontFamily='Lucida Console';
//oP.firstChild.style.fontSize='12px';
oP.style.border='1px solid DarkGreen';
oP.style.borderTopWidth='0px';
}
//return;
oNav=D.getElementById('pageNav');
oPage=D.getElementById('pageContent');
AlignNav(); window.onresize=AlignNav;
}
function AlignNav(){
var Pos, NavBottom, Diff;
Pos=AbsPos(oNav);
NavBottom=Pos[1]+oNav.offsetHeight;
Diff=oPage.offsetHeight-NavBottom;
if (Diff!=0) oNav.style.top=(Diff+oNav.style.posTop)+'px';
}
function AbsPos(O, Parent){
var X=0, Y=0, Next;
Next=O; if (Parent==null) Parent=D;
while (Next!=null && Next!==Parent){
Y+=Next.offsetTop; X+=Next.offsetLeft; Next=Next.offsetParent;
}
return [X, Y];
}
//----------
This is to be added in style.css:
Body{
font-family: Verdana;
font-size: 80%;
height: 100%;
}
P{
text-align:justify;
}
#pageContent{
height: 100%;
}
#pageNav {
position:relative;
}
.literal{
background-color: LightCyan;
}
TR.question TD{
background:LightYellow;
}
TR.answer TD{
background:#F0FFF0;
}