Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Starting with Profound UI Version 6, Fix Pack 0.2, Visual Designer offers a CSS Selector Dialog for the 'css class' property that will allow you to browse through various CSS classes that are available to use for widgets. This dialog gives you the ability to: view the rules that a specific CSS class contains, view the class in the CSS file where it is located by opening the file in the Visual Designer, search for specific classes and/or CSS rules and see a preview of the CSS class on your widget before selecting it. 

...

Searching for CSS Classes and Rules

The CSS Selector Dialog gives you provides multiple options to help you find the CSS style that you're wanting to use for your widget. By default, the search functionality allows you to search for a particular CSS class name that you're wanting to preview or apply to your widget. For example, if you wanted to search for the 'office-copy-grid' CSS class, you would simply type this into the search textbox and the dialog will show a list you every CSS class that includes this text:

...

When you have this option checked, the dialog will show you a list of classes that either have this text in the class name or classes that are currently using this rule (in this example, the classes either use the 'clear' rule or have 'clear' somewhere in the class name). 

The dialog also offers a way to sort the CSS class in ascending or descending order. This is done by simply pressing the 'Sort' button located on the dialog:

 

By default, the CSS class list will be sorted in ascending order. However, you can change the sort order at any time by pressing the button highlighted above.