Main Page in HTML5 Skins

This section contains the Main Page style for Side Navigation, Top Navigation, and Tripane skins.

For Side and Top Navigation skins, you can control the padding and maximum width for the page.

For Tripane skins, you can control the font and background color for the page.

How to Specify Style Settings for the Main Page in HTML5

  1. Open an HTML5 Side Navigation, Top Navigation, orTripane skin.
  2. Select the Styles tab.
  3. (Optional) If you are using responsive output, make sure you select the appropriate medium—Web, Tablet, or Mobile—in the local toolbar before making changes to styles. For more information about these mediums and responsive output, see Responsive Skins.
  4. On the left side of the editor, expand the Global style group, and select Main Page.

  5. Expand any of the nodes and complete the necessary fields.

    Background (Tripane Skins Only)

    You can change any of the following to affect the background:

    • Gradient This lets you change the background color using a progression effect. Select the beginning gradient color in the first field, and then select a second gradient color in the second field. You can use any of the following to enter or select a color.

      Option

      Description

      You can type a hexadecimal number (e.g., #000000) directly in this field. Alternatively, you can click the down arrow and choose a color or make the background transparent.

      This opens the Color Picker dialog, which lets you choose a color in many ways. Note that you can select a CSS variable. See Color Picker Dialog.

      Adds a bar above the cursor. As you move the cursor over any area of your screen, the color changes in the bar to reflect the color that is directly behind the tip of the cursor. When you click, that color is loaded into the Color Picker dialog.
    • Color This lets you select a single color.
    • Image This lets you select an image for the background. Click and use the dialog to select an image file.
    • Repeat Use this field to tell Flare whether the image should repeat or not.

    Note The Image field has the highest precedence, which means that if you enter settings in all of the Background fields, the image will win. Gradient has the next highest precedence. If you want to use the Color field, you need to make sure the Gradient fields are set to transparent and that there is no image selected.

    Font (Tripane Skins Only)

    You can change any of the following to affect the font:

    • Family You can select or type a specific font family (e.g., Arial, Tahoma, Verdana).
    • Size You can change the font size. In the first field type a number or use the arrows. Then click in the second field and select the unit of measurement (e.g., pixels, points).
    • Weight You can click in this field and make the font normal or bold.
    • Style You can click in this field and make the font normal or italic.

    Padding (Side and Top Navigation Skins Only)

    You can change the padding for any of the sides on the element (Left, Right, Top, Bottom). In the first field type a number or use the arrows. Then click in the second field and select the unit of measurement (e.g., pixels, points, centimeters).

    Size (Side and Top Navigation Skins Only)

    You can change the maximum width of the element. In the first field type a number or use the arrows. Then click in the second field and select the unit of measurement (e.g., pixels, points, centimeters). See Units of Measurement.

  6. Click Save the active file. to save your work.