Style Input Variants

Business Background

Style the input variants using Titan Web.

Titan Solution

• The Input Variant option is available for project styling.
• The Input Variant option allows you to change the element’s look and inherit styles from elements except for their size. You can use the primary properties to change the element color and the size to adjust the width and height.

How to Video

Video Coming Soon!

How to Guide

1. Select the Project drop-down list.
2. Select the Style option and select the Configure sub-option. The Customize Styles screen opens.

3. Expand the Simple Elements option. A drop-down list opens.
4. Select the Input Variant option to expand it.
5. Use these controls to customize the styles for the input variants.
   • Input Variant
     • Text Field Variant
     • Size Variant
   • Primary
   • Size

6. Open the Text Field Variant drop-down list and choose the following style options:
   • Click the Standard option for a basic or common look of elements.
   • Click the Filled option for a color-filled look of elements.
   • Click the Outline option for an object’s shape in a sketch or diagram look of elements.
   • Click the Fixed option for the securely in-position look of elements.
   • Click the Classic option for a classic quality look of elements.

7. Use the Size Variant drop-down list to adjust the height of the element.

8. Click the Primary option to change the color of the element.

9. Use the Size option to adjust the element’s width or height.
10. Click the Advanced option to adjust the following:
    • Click the Auto-resize height checkbox to remove unnecessary spacing between the element’s height when working with multiple elements. You can use this option to auto-fit your content.
    • Click the Auto-resize width checkbox to remove unnecessary spacing on the width of the element; for instance, when you drag the Title element to the canvas, there is an extra space after the text. You can use this option to auto-fit your content.
    • You can manually adjust the minimum and maximum height and width sizes.