sc_change_css("atributo", "valor", "nombre_campo")

Esta macro permite manipular las propiedades CSS de los campos y filas de la consulta

De esta forma puedes cambiar el aspecto de la aplicación de forma dinámica y con muchas más opciones de modificación

 

Lista de parámetros

parámetros valores paramétricos Descripción
nombre_del_atributo

Este parámetro recibe el nombre del atributo css a modificar, que debe introducirse entre comillas dobles, comillas simples.

En este parámetro se puede utilizar el atributo sc_badge que aplica un css predefinido al texto.

Ejemplo con atributo color

sc_change_css('color', '#dcfce7');

Ejemplo com sc_badge

sc_change_css('sc_badge', '#dcfce7', 'field_name');

Este parámetro es obligatorio

y establece el atributo CSS que se modificará.
valor

Este parámetro define el valor del atributo introducido en el parámetro anterior y debe introducirse entre comillas dobles o simples.

Cuando se utiliza el atributo sc_badge en paramentro el valor del atributo debe ser uno de los colores listados a continuación:

azul, marrón, cian, gris, verde, naranja, rosa, morado, rojo, amarillo y cadena vacía

Si no se introduce ningún valor, pasando la cadena vacía, la insignia se eliminará del campo.

Ejemplo de configuración del color del atributo color

sc_change_css('color', '#dcfce7');

Ejemplo con sc_badge

sc_change_css('sc_badge', 'green', 'field_name');

Parámetro obligatorio que define el valor del atributo indicado anteriormente.
nombre_del_campo

El nombre del botón debe informarse mediante comillas dobles, comillas simples o variables.

Ejemplo

En este ejemplo estamos definiendo el cambio de color de fuente del campo fld_status

sc_change_css('color', '#dcfce7', 'fld_status');

Atributo opcional.

Define el campo donde se aplicará el CSS, si no se informa ningún valor el cambio se realizará en todos los campos de la línea.

Para utilizar el atributo sc_badge es obligatorio informar del nombre del campo, de lo contrario el css no se aplicará a ningún campo.

Ejemplo

Ejemplo de cambio del color de la fuente y utilización del 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;
}

Ejemplo de utilización de la macro con atributos css

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;
}