Configure Interview Styling Extensions for Oracle Intelligent Advisor

You can style Oracle Intelligent Advisor (OIA) (formerly Oracle Policy Automation) interviews to unify the appearance with your corporate look and feel.

You can configure the following CSS class selectors in the design.css file. All of these class selectors have the prefix “scs-opainterview-”.

Each class defines all styling for the specified component. The class has full control, and the existing OIA style won't be used.

Selector	Applies to	Description
interview	interview	The interview region comprises the entire interview content, including the header, footer and navigation area.
interviewContent	interview content	The interview content region includes the screen title and controls but excludes the header, footer and navigation area.
screenTitleBlock	screen title block	The screen title block composes the region that includes the screen title as well as any other widgets that are contained in that row, such as the screen drop-down list and/or next and back buttons.
screenTitle	screen title	The screen title region is just the region containing the screen title.
nextButton	next button	The next button.
backButton	back button	The back button.
restartButton	restart button	The restart button.
exitButton	exit button	The exit button.
header	header	The header region.
footer	footer	The footer region.
question	question text	Styling for question text.
control	container for controls	Styling for the element that contains controls.
label	label control	Styling for label controls.
controlError	all controls	Styling for error text container.
controlErrorText	all controls	Styling for error text span.
textInput	single line text box, password and masked	Styling for text input controls.
textAreaInput	multi-line text box	Styling for multiline text input controls.
calendarInput	calendar	Styling for calendar input controls. Supports an iconColor field that allows the color of the calendar icon to be changed, and  a keepIcon field that indicates whether the calendar icon should be displayed.
dropDownInput	drop-down list	Styling for drop-down list input controls.
filterDropDownInput	filtered drop-down list	Styling for filtered drop-down list input controls. Supports an iconColor field that allows the color of the drop-down arrow to be changed.
listInput	fixed list	Styling for fixed list input controls.
radioInput	radio buttons	Styling for radio button input controls. They can be styled with borderColor and fillColor options. The iconType property can change the type of icon used. Currently 'tick' and 'fill' are the only supported alternate options.
checkboxInput	checkbox	Styling for checkbox input controls. They can be styled with borderColor and fillColor options. The iconType property can change the type of icon used. Currently 'square' and 'fill' are the only supported alternate options.
autoCompleteInput	custom search	Styling for the autocomplete field when a customSearch extension is used.
captchaInput	CAPTCHA input field	Styling for the input field that the user is entering the CAPTCHA into.
signatureInput	signature control	Styling for signature controls. Supports an additional inkColorfield that allows changing the pen ink for the signature.
explanationHeader	explanation control	Styling for the top level expandable header for explanation controls.
explanationText	explanation control	Styling for the expanded explanation control text.
signatureClearButton	signature control	Styling for the clear button on a signature control.
uploadAddButton	upload control	Styling for the add button on the upload control.
entityRemoveButton	entity collect control	The entity collect control.

Examples with Style Extensions Defined in design.css

.scs-opainterview-interviewContent {
   background-color: beige;
}
.scs-opainterview-screenTitleBlock {
   background-color: bisque;
}
.scs-opainterview-screenTitle {
    font-style: italic;
    font-size: 20px;
}
.scs-opainterview-nextButton {
    color: darkgreen;
}
.scs-opainterview-backButton {
    color: crimson;
}
.scs-opainterview-question {
    color: green;
}
.scs-opainterview-control {
    background-color: cornflowerblue;
}
.scs-opainterview-label {
    color:aqua;
}
.scs-opainterview-textInput {
    color: red;
    cursor:crosshair;
}
.scs-opainterview-radioInput {
    background-color: pink;
}
.scs-opainterview-checkboxInput {
    cursor: pointer;
}