sc_change_css("nome_atributo", "valor", "nome_campo")

Esta macro permite manipular propriedades CSS dos campos e linhas da consulta.

Desta forma é possível alterar o visual da aplicação dinamicamente e com muito mais opções de alteração.

Lista de Parâmetros

parâmetros valores dos parâmetros Descrição

nome_atributo

Este parâmetro recebe o nome do atributo css que será alterado, que deve ser informado utilizando aspas duplas, aspas simples.

Neste parâmetro é possível utilizar o atributo sc_badge que aplica um css pre-defindo ao texto.

Exemplo com atributo color
sc_change_css('color', '#dcfce7');

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

Este parâmetro é obrigatório e define o atributo CSS que será alterado.
valor

Este parâmetro define o valor do atributo informado no parâmetro anterior e deve ser informado utilizando aspas duplas ou aspas simples.

Ao utilizar o atributo sc_badge no paramentro o valor do atributo deve ser umas das cores listadas abaixo:
blue, brown, cyan, gray, green, orange, pink, purple, red, yellow e string vazia

Caso nenhum valor seja informando, passando a string vazia, o badge será removido do campo.

Exemplo definido a cor do atributo color
sc_change_css('color', '#dcfce7');

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

Parâmetro obrigatório que define o valor do atributo informando anteriormente.

 
nome_campo

O nome do botão deve ser informado utilizando aspas duplas, aspas simples ou variáveis.

Exemplo
Neste exemplo estamos definindo a mudança na cor da fonte do campo fld_status

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

Atributo Opcional.

Define o campo onde o CSS será aplicado, caso nenhum valor seja informado a alteração será realizada em todos os campos da linha.

Para utilização do atributo sc_badge é obrigatório informarmos o nome do campo, caso contrário o css não será aplicado a nenhum campo.

Confira abaixo a lista de cores aceita ao utilizar sc_badge no nome do atributo.

  • blue
  • brow
  • cyan
  • gray
  • green
  • orange
  • pink
  • purple
  • red
  • yellow

 

 

Exemplos

Exemplo de alteração da cor da fonte e utilização do atributo sc_badge

switch({taskstatus}) {
	case 'COMPLETED':
		sc_change_css('sc_badge', 'green', 'taskstatus');
		break;
		
	case 'IN-PROGRESS':
		sc_change_css('sc_badge', 'blue', 'taskstatus');
		break;
		
	case 'NOT-STARTED':
		sc_change_css('sc_badge', 'red', 'taskstatus');
		break;
}

Exemplo de utilização da macro com 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;
}