Hi Team.
May be my “search” was bad but I didn’t find anything on how to use “beautification” for Web reports.
We really like using Web reports for it’s flexibility and build in data extraction for reporting… But natural look of it is… quite “outdated” and we want to bring a little color and design into our web reports.
Can someone share some tutorials and simple examples on how to make web reports a little “brighter”?
Best regards,
Anton.
I’m not sure if Webreport’s default reports can have some formatting updated, but custom reporting can. I use the style code below for practically all of my custom reports. I discovered it 100 years ago 
& continue to edit reports as needed.
You simply need to paste it on top of your custom report code to obtain the style. You can test it and adjust it accordingly.
<style>
a { text-decoration: none; }
a:link { color: #200772; font-weight: normal; text-decoration: none; }
a:hover { color: #FF8000; font-weight: normal; text-decoration: none; }
table { margin: 0; border-collapse: collapse; color: #0d0c0c; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; }
th { font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; color: #f7f9fa; font-weight: normal; background-color: #040e7d; border: 1px solid #cccccc; margin: 0; padding: 4px 10px 4px 5px; text-align: left; }
td { color: #0d0c0c; font: 8pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; border-bottom: 1px solid #cccccc; margin: 0; /* padding: 6px 20px 1px 0; */ padding: 8px 20px 5px 5px; }
td.userinput { color: #0d0c0c; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; font-weight: bold; border-bottom: 0px; margin: 0; padding: 6px 20px 1px 0; }
td.errormsg { color: red; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; font-weight: bold; border-bottom: 0px; margin: 0; padding: 6px 20px 1px 0; }
td.msg { color: #747170; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; font-weight: bold; border-bottom: 0px; margin: 0; padding: 6px 20px 1px 0; }
/*#t01*/ tr:nth-child(even) {background-color: #eee;}
/*#t01*/ tr:nth-child(odd) {background-color: #fff;}
</style>
Result will be something like below:
A representative of the HCL side showed me a custom report with outstanding formatting when I attended the HCL BigFix meeting the previous year. I was grateful for that and inquired about the code. I was told to put that in your post-call feedback and they would share it, but I didn’t receive it. The HCL guys have much better, more glossy, and generally eye-catching designs than this.
