mySupport Themes
Overview
Describes the settings for the currently used iSupport Social Client themes.
Creating a Theme
Themes for the iSupport Social Client (in v11) are created using jQuery UI ThemeRoller. To create a theme, follow these steps:
- In the iSupport Rep Desktop, go to Configuration > Social Client > Social Client Themes
- Click the Open in ThemeRoller link for one of the existing themes.
- Use ThemeRoller to modify the styles.
- Click the Download Theme link.
- In the Build Your Download screen, ensure that all of the components on the left are selected.
- In the Theme section on the right, ensure that the CSS Scope field (under Advanced Theme Settings) is blank.
- In the Version section on the right, ensure that version 1.7.3 is not selected (minimum supported version is 1.8.16).
- Click the Download button to download the theme from ThemeRoller as a zip file.
- Return to the iSupport Rep Desktop and click Create to start a new theme.
- Provide a name for the new theme.
- Upload the zip file from step 5 and click Save.
Themes
IWU Default Theme
Settings for the IWU default theme.
| iSupport Theme Settings | Value |
|---|---|
| Logo | IWU Logo White |
| Is Default | Yes |
| News Feed Item Header Text | #000000 |
| News Feed Links and Work Item Field Labels | #aaaaaa |
| ThemeRoller zip file | jquery-ui-1.8.19.IWU-Default.zip |
| ThemeRoller Settings | Value |
|---|---|
| Font Settings: Family | Helvetica, Tahoma, Arial, sans-serif |
| Font Settings: Weight | bold |
| Font Settings: Size | 12px |
| Corner Radius: Corners | 4px |
| Header/Toolbar: Background color & texture | #b50938, highlight soft, 25% |
| Header/Toolbar: Border | #61051e |
| Header/Toolbar: Text | #ffffff |
| Header/Toolbar: Icon | #ffffff |
| Content: Background color & texture | #ffffff, flat, 50% |
| Content: Border | #cccccc |
| Content: Text | #000000 |
| Content: Icon | #000000 |
| Clickable: default state: Background color & texture | #b50938, flat, 50% |
| Clickable: default state: Border | #61051e |
| Clickable: default state: Text | #ffffff |
| Clickable: default state: Icon | #ffffff |
| Clickable: hover state: Background color & texture | #ffffff, flat, 50% |
| Clickable: hover state: Border | #cccccc |
| Clickable: hover state: Text | #b50938 |
| Clickable: hover state: Icon | #b50938 |
| Clickable: active state: Background color & texture | #ffffff, flat, 50% |
| Clickable: active state: Border | #cccccc |
| Clickable: active state: Text | #b50938 |
| Clickable: active state: Icon | #b50938 |
| Highlight: Background color & texture | #ffdd00, highlight soft, 75% |
| Highlight: Border | #d6ba00 |
| Highlight: Text | #1c1cd |
| Highlight: Icon | #b50938 |
| Error: Background color & texture | #ffffff, flat, 50% |
| Error: Border | #cccccc |
| Error: Text | #b50938 |
| Error: Icon | #b50938 |
| Modal Screen for Overlays: Background color & texture | #626466, flat, 0% |
| Modal Screen for Overlays: Overlay Opacity | 30% |
| Drop Shadows: Background color & texture | #626466, flat, 50% |
| Drop Shadows: Shadow Opacity | 10% |
| Drop Shadows: Shadow Thickness | 8px |
| Drop Shadows: Top Offset | -8px |
| Drop Shadows: Left Offset | -8px |
| Drop Shadows: Corners | 8px |
IWU Dark Theme
Same as IWU Default but using the darker shade of red (#980826) used on the indwes.edu page.
| iSupport Theme Settings | Value |
|---|---|
| Logo | IWU Logo White |
| Is Default | No |
| News Feed Item Header Text | #000000 |
| News Feed Links and Work Item Field Labels | #aaaaaa |
| ThemeRoller zip file | jquery-ui-1.8.23.IWU-Dark.zip |
| ThemeRoller Settings | Value |
|---|---|
| Font Settings: Family | Helvetica, Tahoma, Arial, sans-serif |
| Font Settings: Weight | bold |
| Font Settings: Size | 12px |
| Corner Radius: Corners | 4px |
| Header/Toolbar: Background color & texture | #980826, highlight soft, 25% |
| Header/Toolbar: Border | #3a030e |
| Header/Toolbar: Text | #ffffff |
| Header/Toolbar: Icon | #ffffff |
| Content: Background color & texture | #ffffff, flat, 50% |
| Content: Border | #cccccc |
| Content: Text | #000000 |
| Content: Icon | #000000 |
| Clickable: default state: Background color & texture | #980826, flat, 50% |
| Clickable: default state: Border | #3a030e |
| Clickable: default state: Text | #ffffff |
| Clickable: default state: Icon | #ffffff |
| Clickable: hover state: Background color & texture | #ffffff, flat, 50% |
| Clickable: hover state: Border | #cccccc |
| Clickable: hover state: Text | #980826 |
| Clickable: hover state: Icon | #980826 |
| Clickable: active state: Background color & texture | #ffffff, flat, 50% |
| Clickable: active state: Border | #cccccc |
| Clickable: active state: Text | #980826 |
| Clickable: active state: Icon | #980826 |
| Highlight: Background color & texture | #ffdd00, highlight soft, 75% |
| Highlight: Border | #d6ba00 |
| Highlight: Text | #1c1cd |
| Highlight: Icon | #980826 |
| Error: Background color & texture | #ffffff, flat, 50% |
| Error: Border | #cccccc |
| Error: Text | #980826 |
| Error: Icon | #980826 |
| Modal Screen for Overlays: Background color & texture | #626466, flat, 0% |
| Modal Screen for Overlays: Overlay Opacity | 30% |
| Drop Shadows: Background color & texture | #626466, flat, 50% |
| Drop Shadows: Shadow Opacity | 10% |
| Drop Shadows: Shadow Thickness | 8px |
| Drop Shadows: Top Offset | -8px |
| Drop Shadows: Left Offset | -8px |
| Drop Shadows: Corners | 8px |