CSS Properties
- Chris Welford
- Anthony George
- Pawel Furmanowski
This page provides details of the properties for setting custom CSS, which is part of screen design.
Overview
This tab is not available from the repository. It opens from:
Use this tab to set custom CSS for components on a screen.
Property Pane Toolbar
For information about the toolbar options, see the Common Properties page, Toolbars and Controls section.
Properties Tab
Parent Details
If this item is within or belongs to another, its parent name is shown here. See the Parent Details section on the Common Properties page for more details.
Field | Description |
---|---|
CSS Tag | The the CSS property. |
Value | Enter the value for the property; see https://www.w3schools.com/cssref/. If the value is an expression, you can use the internal variable _current to refer to all the data in the current row of a grid. |
Expression | Tick to indicate the value is an expression. |
State | Choose one of:
|
Order | The order in which the style element will be applied. |
N-th Child | Optionally, enter a number to indicate the recurrence of this CSS formatting. For example to use this CSS for:
|
N-th Child Offset | Optionally, specify where you want the formatting to start after the first child. For example, to apply the formatting to the second item, instead of the first, enter 2. |
Audit Tab
Audit Summary
See the Common Properties page, Audit Summary section.
Using N-th Child and N-th Child Offset
Use N-th Child and N-th Child Offset to specify different formatting for children. The two fields together work as an ax + b
expression, where:
a
is the N-th Childx
is the current N-th Childb
is the N-th Child Offset
For example, to apply the CSS formatting:
- to the 5th child only, leave the N-th Child empty and set the N-th Child Offset to 5.
- alternate children, starting with the second, (2, 4, 6...) set the N-th Child to 2 and the N-th Child Offset to 2.
- not format the first 10 items, but then format every 3rd child (i.e. 11,14,17...), set the N-th Child to 3 and the N-th Child Offset to 11.
Learn More
For links to all pages in this topic, see Designing Screens.
Terminology changes in progress
As part of the redesign of PhixFlow, we are changing the following terms:
dashboard → screen
stream → table
stream attributes → attributes
stream item → record
stream set → recordset
stream view → view
stream item action → record-action
stream action → table-action
driver class → database driver