Configuring skin base settings manually
Use custom skin settings to quickly define the general appearance of your application, including font formats, backgrounds, and padding. You can configure settings that are entirely custom, or if your skin uses inheritance, import some settings from the parent, but override others.
For example, a banking application that is designed specifically for senior citizens can use larger default fonts, but the same overall styling as the regular application
- In the navigation pane of Dev Studio, click Records.
- Expand the User Interface category, and then click Skin.
- Open the skin that you want to edit.
- If your skin uses inheritance, in the Base settings tab, clear the Inherit from parent checkbox.
- Define the custom formatting for UI components:
- In the Typeface setting section, define the font that the application uses for UI elements whose styling is not defined in the skin.
- In the Base heading tag styles section, define the styling for headings in the application by clicking the Heading arrow and selecting a mixin.
- In the Background section, define the appearance of the background in the application by selecting a mixin or by specifying the formatting manually.
- In the Layout section, define padding for the application.
- Optional: To add CSS-based formatting to UI components, perform the following
actions:
- In the Typeface setting or Background sections, expand the Additional styles node.
- Click Add additional styles, and then define the CSS attribute and value pair that you want to use to format the component.
- Click Save.
Previous topic Creating skins Next topic Optimizing skins