Skin form - Included Styles tab

You are here: Reference > Rule types > Skins > Skin form - CSS tab

Skin form - Included Styles tab
About New Component Styles Mixins Base settings Included Styles Inheritance History

Use this tab to add additional style sheets to the skin. You can also enable and disable automatic generation of the workform CSS on this tab.

Legacy support

Select the Add legacy CSS for applications built prior to Pega 7 check box to include support for legacy components and environments. Legacy support supports Internet Explorer 9, quirks mode, and old controls such as tabs or accordions. Enabling this option also reduces the size of the CSS files sent to the browser.

When creating a new application, this check box should not be selected. Disabling legacy is recommended when building new applications and if you are not using some old controls.

When upgrading a skin from Pega 7.1.7 to Pega 7.1.8, the check box is selected by default and should be left selected.

Additional Style Sheets

As a best practice, avoid adding custom style sheets to your skin. If you are currently using a custom style sheet:

for custom or non auto-generated controls, you can add these styles to the skin rule as custom styles. See Skin rule — Custom.
to create additional styles for layouts and controls, such as grids, tabs, buttons, and links, you can create new style formats in the skin rule.

If you choose to add a custom style sheet to the skin:

Click Add style sheet and type the file name. Click the magnifying glass to create a new file.
Click Save. Note the caution regarding maintainability.

The order in which you enter style sheets is significant; the bottom style sheet is applied last. Select the number beside the file name and drag and drop to re-order additional sheet sheets.

To delete a style sheet from a skin, select the style sheet that you want to delete and click the delete icon.

Advanced

You can enable and disable automatic generation of the workform CSS.

Note: You cannot create a non-auto-generated skin. Update non-auto-generated skins to auto-generated skins.

Work

Displays the name of the css/workform that defines styles for the user forms defined though harness rules and section rules.

If you upgraded an existing skin, the css/workform is automatically generated. To disable automatic generation, click the Disable Generation link.

If you want to apply a different skin to a harness within your application, enable automatic CSS file generation and paste the css/workform file name in the Style field on the Scripts and Styles tab of the Harness rule.

As a best practice, apply styles through the skin instead. Using the skin ensures that the styles apply uniformly to all work item harnesses throughout your application. You can add styles to the skin, which auto-generates the CSS, and makes it easier to maintain and upgrade.

About Skin rules

Open topic with navigation