You can customize stylesheet elements to change the look and feel of the Player search frame and TOC. Locate the CSS Element you want to change in the skin.css file and change it to the desired value. For example, if you want to change the background color of the search area, find the .tocSearchColor element in the skin.css file and change the color value. The skin.css file is located in the root directory of the Player publishing project document located in the System/Publishing/Styles/<category>/Player folder of the Library.
- A: Element is .tocSearch. Defines the font type, size and color for the text within the search bar. Default values are Arial font-family, Helvetica, sans-serif, font size 12 pixels and color #000000.
- A1: Element is .tocSearchColor. Changes the background color in the search area. Default value is background color #CDE2FD.
- B: Element is .tocSelectionText. Defines the font type, size and color for the “Applicable” and “My Roles” link text. Default values are Arial font-family, Helvetica, sans-serif, font size 12 pixels and color #000000.
- C: Element is .tocFrameText. Defines font type, size and color of the “Results for” and “View Outline” link text. Also defines the search results text that displays below “Results for” when the search is initiated. Default values are Arial font family, Helvetica, sans-serif, font size 12 pixels and color #000000.
- C1: Element is .tocFrameText. Defines the color of the Outline background. Default value is background color #CDE2FD.
- D: Element is .treeControlNode. Defines font type, size, and color of text within the Outline. Also changes the background color of the Outline text. Default values for the text are Arial font family, Helvetica, sans-serif, font size 10 pixels and color #000000. Default value for the background color is #FFFFFF.
Element is .thover. Changes the color of the text while hovering. Also changes the background color of the text while hovering. Default value for the text color is #00CCFF. Default value for the background color is #FFFFFF.
- D1: Element is .tselected. Changes the background color of the text when selected in the Outline. Default value for the color is #FFFFFF.
- D2: Element is .tselected. Changes the font color of the text when selected in the Outline. Default value for the color is #003366.
You can also customize the icons used for the outline tree display. The graphics for these icons are stored in the treecontrol.png file in the \img folder in the Player publishing style or the published Player package. Open the file and replace the desired graphics with graphics of equal size (16x16 pixels). It is important not to change the size of the treecontrol.png itself (387x18).