Do wywiadów OIA (Oracle Intelligent Advisor, dawniej Oracle Policy Automation) można — w celu ujednolicenia ich wyglądu — stosować stylistykę.
W pliku design.css można skonfigurować przedstawione poniżej selektory klas CSS. Wszystkie te selektory klas mają prefiks scs-opainterview-.
Każda klasa definiuje stylistykę określonego składnika. Klasa sprawuje pełną kontrolę — istniejący styl OIA nie będzie używany.
| Selektor | Do czego jest stosowany | Opis |
|---|---|---|
| interview | interview | Obszar wywiadu obejmuje całą zawartość wywiadu, w tym nagłówek, stopkę i obszar nawigacyjny. |
| interviewContent | treść wywiadu | Obszar "treść wywiadu" obejmuje tytuł ekranu oraz formanty, bez nagłówka, stopki i obszaru nawigacyjnego. |
| screenTitleBlock | blok tytułu ekranu | Blok tytułu ekranu tworzy obszar zawierający tytuł ekranu oraz inne widżety zawarte w tym rzędzie, takie jak lista rozwijana i/lub przyciski "Dalej" i "Wstecz". |
| screenTitle | tytuł ekranu | Obszar tytułu ekranu jest, jak wskazuje nazwa, obszarem zawierającym tytuł ekranu. |
| nextButton | przycisk "Dalej" | Przycisk "Dalej". |
| backButton | Przycisk "Wstecz" | Przycisk "Wstecz". |
| restartButton | Przycisk "Uruchom ponownie" | Przycisk "Uruchom ponownie". |
| exitButton | przycisk "Zakończ" | Przycisk "Zakończ". |
| header | header | Obszar nagłówka. |
| footer | footer | Obszar stopki. |
| question | tekst pytania | Stylistyka tekstu pytania. |
| control | kontener dla formantów | Stylistyka elementu zawierającego formanty. |
| label | formant "etykieta" | Stylistyka formantów "etykieta". |
| controlError | wszystkie formanty | Stylistyka kontenera tekstu błędu. |
| controlErrorText | wszystkie formanty | Stylistyka tekstu błędu. |
| textInput | pole tekstowe jednowierszowe, hasło i maskowane | Stylistyka formantów "tekst wejściowy". |
| textAreaInput | pole tekstowe wielowierszowe | Stylistyka formantów "tekst wejściowy wielowierszowy". |
| calendarInput | calendar | Stylistyka formantów "dane wejściowe z kalendarza". Obsługuje pole iconColor umożliwiające zmianę koloru ikony kalendarza oraz pole keepIcon sygnalizujące, czy ikona kalendarza ma być wyświetlana. |
| dropDownInput | lista rozwijana | Stylistyka formantów "lista rozwijana". |
| filterDropDownInput | filtrowana lista rozwijana | Stylistyka formantów "filtrowana lista rozwijana". Obsługuje pole iconColor umożliwiające zmianę strzałki rozwijającej. |
| listInput | lista stała | Stylistyka formantów "lista stała". |
| radioInput | przyciski radiowe | Stylistyka formantów "przyciski radiowe". Można je stylizować za pomocą opcji borderColor i fillColor. Właściwość iconType pozwala zmienić typ używanej ikony. Obecnie są obsługiwane jedynie opcje tick (zaznaczenie) i fill (wypełnienie). |
| checkboxInput | pole wyboru | Stylistyka formantów "pole wyboru". Można je stylizować za pomocą opcji borderColor i fillColor. Właściwość iconType pozwala zmienić typ używanej ikony. Obecnie są obsługiwane jedynie opcje square (kwadrat) i fill (wypełnienie). |
| autoCompleteInput | wyszukiwanie niestandardowe | Stylizacja pola autocomplete, gdy jest używane rozszerzenie customSearch. |
| captchaInput | pole wejściowe CAPTCHA | Stylizacja pola wejściowego, w którym użytkownik wprowadza informacje CAPTCHA. |
| signatureInput | formant "podpis" | Stylistyka formantów "podpis". Obsługuje dodatkowe pole inkColor umożliwiające zmianę koloru podpisu. |
| explanationHeader | formant "objaśnienie" | Stylistyka rozwijalnego nagłówka najwyższego poziomu dla formantów "objaśnienie" |
| explanationText | formant "objaśnienie" | Stylistyka tekstu rozwiniętego formantu "objaśnienie". |
| signatureClearButton | formant "podpis" | Stylistyka przycisku czyszczenia w formancie "podpis". |
| uploadAddButton | formant "wyślij" | Stylistyka przycisku dodawania w formancie "wyślij". |
| entityRemoveButton | formant "usuń encję" | Formant "usuń encję". |
Przykłady z rozszerzeniami stylów zdefiniowanymi w pliku 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;
}