Modifying the Report Studio Style Sheets

The two predefined Report Studio styles are CRN (the current default) and windows. The windows folder contains styles that apply uniquely to Report Studio.

The customizable Report Studio style sheets are located in the directory c8_location/webcontent/skins/style/pat, or c8_location/webcontent/skins/style/hal, where style represents a specific style directory . The style sheets in c8_location/webcontent/skins/windows/pat and c8_location/webcontent/skins/windows/hal must not be changed. Component-specific graphics are located in the images subdirectories of these directories.

The Report Studio style sheets are as follows.

Contents	File
Defines the default interface style for Report Studio, including a section that globally sets the font	style/pat/skin.css
Defines the default interface styles for menus and toolbars	style/hal/hal_style_skin.css
Defines a style that applies the user’s chosen Microsoft Windows display settings to the Report Studio interface	windows/pat/skin.css

Example - Change the Fonts Used in Report Studio

Suppose you want to change the default font used in the HTML interface to one that properly renders special Asian characters. Open the style/pat/skin.css file in a text editor and comment out the section that shows Tahoma as the first item in the font-family list. Select or create an entry that better meets your Unicode requirements.

@charset "UTF-8"; 
DIV.clsToolbar, 
... 
DIV.clsTabPanels 
{ 
	font-family:Tahoma, Arial, 'MS UI Gothic',
Gulim, SimSun, PMingLiU, Raghu8, 
'Arial Unicode MS', 'Andale WT', sans-serif; 
	font-size: 8pt; 
}

Example - Change the Colors Used in Report Studio Menus

Suppose you want to change the colors used in the Report Studio menus. Open c8_location/webcontent/skins/style/hal/hal_style.css style sheet in a text editor and change the code shown in bold font to your preferred colors.

DIV.clsMenubar,
DIV.clsToolbar
{
	background-color: black; 
	border-top: solid white 1px; 
	border-bottom: solid #999999 1px; 
	color: white; 
}
TD.clsMenubarItem, 
TD.clsToolbarButton 
{
	background-color: white; 
	color: black; 
}
TD.clsMenubarItem, 
TD.clsToolbarButton 
{
	background-color: white; 
	color: black; 
}

Example - Change the Report Studio Graphics

Suppose you want to remove or replace some of the graphics used in Report Studio. When replacing images, we recommend that you retain the same directory structure and file name.

The following table shows which files supply the currently used images. They are located in the c8_location/webcontent/skins/style/branding directory.

Contents	File
The splash screen image specifically used for Report Studio, which appears in a frame, with a progress bar below it	branding/rs_splash.gif
The Welcome page banner image specifically used for Report Studio	branding/rs_welcome.gif
The About box graphic	branding/about.gif
The banner image	branding/banner_cogsquare.gif
The animated progress image	branding/progress.gif