|
Rules Inspector — Working with the Style Discovery toolThe Style Discovery toolbar appears whenever the Styles option is checked and a report display or user form is visible. Select 
> Rules Inspector > Styles again to disable the Style Discovery toolbar.
As a best practice, build your application skin (using the Skin rule form) before you develop harness, section, or flow action. Then update your preferences to reference that skin rule in the Skins field of the Run Process In group of your General preferences. See Designer Studio — Setting your preferences.
Using these facilities, you can determine which styles are in force for each element on a form; experiment with temporary modifications to the styles; apply additional CSS files, and save (on your workstation) the temporary experimental changes you like, for later use in updating CSS rules.
This is an advanced debugging and analysis tool. Familiarity with CSS, HTML, and cascading styles is required. You can make only minor, local changes with this tool
No rules are permanently altered as you use this feature. When you disable the Style Discovery tool, your temporary changes are lost. Before disabling the tool, click 
to remember your changes, so you can later update a style sheet text file rule to reflect the style changes that you want to keep.
Do not update any CSS text file rules created or maintained by the Skin rule form, as any such changes will likely prevent later use of the Skin rule form on these rules. Instead, create a separate CSS as a text file rule and reference it on the Scripts and Styles tab of each harness to be affected.
Icon |
Purpose |
|
Select and slowly drag the grab area to move the Style Inspector toolbar to another location within the portal. Drop the toolbar in a location away from the user form elements of interest. |
|
SmartInfo (no icon) |
Place and hold the mouse pointer over any element of the form to see a pop-up SmartInfo window identifying the HTML tag and all CSS properties of that tag, including a style name (if any) and CSS properties. To temporarily override a CSS property setting, type a new value in the Value column and click Apply. This feature allows you to experiment with changes; you are not altering any rules. For example, you can change the color attribute value from #0c3879 to #0000FF (blue). To see the enclosing tag and its styles, click the Up icon ( If the selected element does not directly have a style, your change is applied only to the single selected element, as a <SPAN STYLE= ..."> element. If the selected element has a style, your change temporarily supplements the current (permanent) style definition.
|
Style Explorer
|
Click to open a pop-up window that starts the Style Explorer. The window lists all style sheets currently in force for your session, in cascading order; the last CSS to be applied appears at the bottom of the list. In some cases, multiple individual CSS files may be bundled into one longer file, to reduce network traffic between the PRPC server and your browser. Click Unbundle if to see the CSS files listed individually. You can temporarily supplement the current CSS files that apply to the current user form by selecting a Text File rule (from those with a File Type of CSS) and clicking the Add button. The added CSS appears at the bottom of the list and is applied last. Click the Include checkboxes to alter which styles are in force. (If the CSS files are bundled, all styles in the bundle are applied.) Click Change to refresh the user form or report display with the updated style sheets. |
|
pop-up toggle
|
Click to disable SmartInfo display of CSS styles and properties. Click again to enable the display. |
|
Search tool
|
Click to open a pop-up window that support searching for styles using text matching. You can search through the selectors (style "names") or through the style definitions. Enter a text string in the Search Styles input box; then check the By Selector box or the By Definition box (or both). Click Search. For example, if a CSS text file rule contains the following definition: .yui_button { display:inline-block ... } then this style is found if you search for By Selector values containing "utton", and is also found if you search for By Definition values containing "inline-block". Search examines all styles in (unbundled) CSS files listed by the Style Explorer. Each search hit is presented as a link. Click a link to open the corresponding style definition. You can edit the style definition directly; such changes are only temporary. |
|
|
Click to list the styles that you have temporarily altered or redefine with this tool. If you have altered a style more than once, it appears multiple times in the list, with the latest change appearing last. To remember these changes, click the |
). To return to a previously displayed enclosed tag after using the Up icon, click the Down icon (
)
Because the net effect of styles are cascaded from multiple style definitions, clearing or changing a CSS property value may in some cases have no visible effect, as a higher-level CSS definition defines the same appearance.
|
About Field Value rules |
