The section identifies areas of the Aurora Framework that can be customised and rebranded. It comprises annotated screenshots of the Aurora screens and tables that describe what the indicated content is and where the file or style is located. If the CSS column is ticked, this indicates that the rendition of the object is controlled by an entry in branding.css, which has been compressed and is part of the string found in the CSS file theme.css located at ..ctx/aurora/theme.css (where ctx is the context of the deployed Aurora web-application).

The branding.css file is not directly accessible, consequently it is recommended that a new CSS file is created and then imported into the proiv.css file, located at ctx/proiv/proiv.css.

For example, create a new CSS file called custom.css in the folder ctx/proiv. Open ctx/proiv/proiv.css and add the following line to the bottom:

@import “custom.css"

When there are conflicting styles in multiple CSS files, priority is given to the CSS file that was loaded last. Therefore, if you want to change the appearance of Aurora in any way, you can provide an alternative style attribute in your own CSS file.

The following example changes the background image used by the header:

The branding.css contains the following:

.aurora #header {

    background-image: url( extraimages/header_row_bg.gif );

    background-repeat: repeat-x;

    font-family: "Verdana", sans-serif;

    font-size: smaller;

    vertical-align: middle;

}

Your custom.css would contain the following:

.aurora #header{

    background-image: url( images/custom_header_row_bg.gif );

Comment on this topic

Topic ID: 810084