Cascade Style Sheets (CSS) can be uploaded to Pearson Connexus to overwrite existing app styles. Pearson Connexus loads default styles first, followed by each file in order. Pearson Connexus supports an overridable CSS class listed for the Header Background:
| Name | Class Selector | Styles | Description |
|---|---|---|---|
| Header Background | .app-theme .app-ct .buzz-main-header .buzz-main-header |
background | Change the background color of the toolbar and sign-in bar. This will overwrite any default theme or theme color selected by the user. Default value is the dark theme color.
|
| Tabs Background | .app-theme .app-ct .app-top-tabs .mat-tab-header | background | Change the background color of the entire top header for the login page and after login. This will overwrite any default theme or theme color selected by the user.
|
Header and Tab Background override example
.app-theme .buzz-main-header, .buzz-main-header {
background: #e9f9d8 !important;
}
.app-theme .app-ct .app-top-tabs .mat-tab-header {
background: #e9f9d8 !important;
}Upload your CSS file and configure Pearson Connexus settings
To configure your custom CSS in your domain:
-
Upload your CSS file to Resources:
- Name your file style.css
- Using the drop down menu under Folder, select through the following to upload the file to Resources > public > shadow > app > buzz
- Open the vertical menu in the toolbar of Domain Details.
- Select Domain Settings.
- Open the Text editor from the toolbar.
- Add the following code to Application Settings to point to your CSS file:
<style>
<file-list>
<file path="style.css" order="1" />
</file-list>
</style>- Select Save.
Notes
- Domain configuration is inherited by all subdomains unless explicitly overwritten by a subdomain.
- Please consider visibility and accessibility when changing any colors or styles. Darker colors are preferred as most icons in the system are lighter shades.