I am developing an Angular page in which a slider allows you to adjust the brightness of the page. By gleaning different techniques, I was able to obtain an interesting first result, however certain areas (interspace between divs for example) seem out of reach and remain white whatever the brightness value chosen by the slider.
Is this due to the architecture of Angular (single-page), if so or not : how can i reach and adjust those areas brightness ?
I tried to apply brightness value on body tag, like this :
this.renderer.setStyle(
bodyRef.nativeElement,
"filter",
'brightness(${brightnessValue})'
);
thinking it might wrap all elements but there are still white/empty areas
And by applying style child by child, i get the same result :
const elements = bodyRef.nativeElement.children;
for (let i = 0; i < elements.length; i++) {
console.log("element modifié:" + elements[i]);
this.renderer.setStyle(
elements[i],
"filter",
'brightness(${brightnessValue})'
);
}