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 CSS class in the profoundui.css (It loads any css class that that loaded in the page, including custom) file 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.
...
In this example, we've added a 'grid' widget to the screen from the Blueprint widget set. If we wanted to see what this grid would look like using the Office Copy widget set CSS classes, we can simply click on the grid widget and open up the CSS Selector Dialog to choose our desired class:(Maybe make this into a gif instead?)
You can see here that after we choose the 'office-copy-grid' CSS class, the grid now shows in the Office Copy style. The top of the dialog window will specify which CSS class you've chosen to preview and the section at the bottom of the dialog will show you the rules that belong to this particular class. This section also tells you that these rules are located in the profoundui.css file.
If you click on the file path here (maybe show an image of the mouse over the link), the :
The Visual Designer will bring up a copy of the profoundui.css (any css file) file CSS file and highlight the CSS class name in the file for you:
...
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). (Add sorting)
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.