|
This macro allows you to manipulate the CSS properties of fields and rows in the grid application.
This way, you can change the appearance of the application dynamically and with many more customization options.
Parameter List
| parameters |
parameter values |
Description |
|
attribute_name
|
The button name must be informed using double quotes, single quotes or variables.
In this parameter is possible to use sc_badge that apply a predefined css in the text.
Example
In this example we are using the color attribute
sc_change_css('color', '#dcfce7');
|
Required Attribute.
Defines the CSS attribute that will be changed.
|
value |
The button name must be informed using double quotes, single quotes or variables.
When is used sc_badge at this parameter the attribute value should be one of the colors above:
blue, brown, cyan, gray, green, orange, pink, purple, red, yellow and empty string
If the attribute value be empty string, the badge wll be removed
Example
In this parameter we define the value for the CSS attribute it should receive, in the example we are defining the color: #dcfce7
sc_change_css('color', '#dcfce7');
|
Required Attribute.
Defines the value that the informed attribute will receive
|
field_name |
The button name must be informed using double quotes, single quotes or variables.
Example
In this example we are defining the change in the font color of the field fld_status
sc_change_css('color', '#dcfce7', 'status');
Example with sc_badge
sc_change_css('sc_badge', 'green', 'field_name');
|
Optional Attribute.
Defines the field where the CSS will be applied, if no value is entered, the change will be made in all fields of the line.
To use sc_badge is necessary to inform the field name, in other hand it will not apply css to any field.
|
Check the list of accepted colors when using sc_badge in the attribute name below.
- blue
- brow
- cyan
- gray
- green
- orange
- pink
- purple
- red
- yellow
Example
Example of changing the font color and using the attribute sc_badge
switch({taskstatus}) {
case 'COMPLETED':
sc_change_css('color', '#dcfce7', 'taskstatus');
sc_change_css('sc_badge', 'green', 'taskstatus');
break;
case 'IN-PROGRESS':
sc_change_css('color', '#1e40af', 'taskstatus');
sc_change_css('sc_badge', 'blue', 'taskstatus');
break;
case 'NOT-STARTED':
sc_change_css('color', '#991b1b', 'taskstatus');
sc_change_css('sc_badge', 'red', 'taskstatus');
break;
}
Example of the macro with css attribute:
switch({taskstatus}) {
case 'COMPLETED':
sc_change_css('color', '#166534', 'taskstatus');
sc_change_css('background-color', '#dcfce7', 'taskstatus');
sc_change_css('padding-right', '0.6em', 'taskstatus');
sc_change_css('padding-left', '0.6em', 'taskstatus');
sc_change_css('border-radius', '14px', 'taskstatus');
sc_change_css('font-weight', 'bold', 'taskstatus');
sc_change_css('width', 'fit-content', 'taskstatus');
sc_change_css('display', 'block', 'taskstatus');
sc_change_css('padding-top', '0.2em', 'taskstatus');
sc_change_css('padding-bottom', '0.2em', 'taskstatus');
sc_change_css('font-size', '60%', 'taskstatus');
sc_change_css('margin', '10%', 'taskstatus');
break;
case 'IN-PROGRESS':
sc_change_css('color', '#1e40af', 'taskstatus');
sc_change_css('background-color', '#dbeafe', 'taskstatus');
sc_change_css('padding-right', '0.6em', 'taskstatus');
sc_change_css('padding-left', '0.6em', 'taskstatus');
sc_change_css('border-radius', '14px', 'taskstatus');
sc_change_css('font-weight', 'bold', 'taskstatus');
sc_change_css('width', 'fit-content', 'taskstatus');
sc_change_css('display', 'block', 'taskstatus');
sc_change_css('padding-top', '0.2em', 'taskstatus');
sc_change_css('padding-bottom', '0.2em', 'taskstatus');
sc_change_css('font-size', '60%', 'taskstatus');
sc_change_css('margin', '10%', 'taskstatus');
break;
case 'NOT-STARTED':
sc_change_css('color', '#991b1b', 'taskstatus');
sc_change_css('background-color', '#fee2e2', 'taskstatus');
sc_change_css('padding-right', '0.6em', 'taskstatus');
sc_change_css('padding-left', '0.6em', 'taskstatus');
sc_change_css('border-radius', '14px', 'taskstatus');
sc_change_css('font-weight', 'bold', 'taskstatus');
sc_change_css('width', 'fit-content', 'taskstatus');
sc_change_css('display', 'block', 'taskstatus');
sc_change_css('padding-top', '0.2em', 'taskstatus');
sc_change_css('padding-bottom', '0.2em', 'taskstatus');
sc_change_css('font-size', '60%', 'taskstatus');
sc_change_css('margin', '10%', 'taskstatus');
break;
}
|