How to increase the size of VIP icon beside caller field

[VIKAS MISHRA]

As per the below screenshot if any user is VIP then one icon would be auto appear beside the caller field, but its currently not visible properly so want to increase its size, is it possible if yes then how.

function onChange(control, oldValue, newValue, isLoading) {
	var callerLabel = $('label.incident.caller_id');
	var callerField = $('sys_display.incident.caller_id');
	if (!callerLabel || !callerField)
		return;
	
	if (!newValue) {
		callerLabel.setStyle({backgroundImage: ""});
		callerField.setStyle({color: ""});
		return;
	}
	g_form.getReference('caller_id', vipCallerCallback);
}

function vipCallerCallback(caller) {
	var callerLabel = $('label.incident.caller_id').down('label');
	var callerField = $('sys_display.incident.caller_id');
	if (!callerLabel || !callerField)
		return;
	
	//check for VIP status
	if (caller.vip == 'true') {
		var bgPosition = "95% 55%";
		if (document.documentElement.getAttribute('data-doctype') == 'true')
			bgPosition = "5% 45%";
			
		callerLabel.setStyle({backgroundImage: "url(images/icons/vip.gif)", backgroundRepeat: "no-repeat", backgroundPosition: bgPosition, paddingLeft: '30px' });
		callerField.setStyle({color: "red"});
	} else {
		callerLabel.setStyle({backgroundImage: ""});
		callerField.setStyle({color: ""});
	}
}

Above is the script which is being used to create that icon.

[VIKAS MISHRA]

This code of change does not work instaed of making the icon size big it changes the  caller field position 

[Samaksh Wani]

@VIKAS MISHRA 

callerLabel.setStyle({backgroundImage: "url(images/icons/vip.gif)", backgroundRepeat: "no-repeat", backgroundPosition: bgPosition, paddingLeft: '30px', background-size: "20px 20px" });

Use this Script :-

Plz Mark my Solution as Accept and Give me thumbs up, if you find it Helpful.

Regards,

Samaksh

[Samaksh Wani]

Hello @VIKAS MISHRA 

Hello @VIKAS MISHRA 

callerLabel.setStyle({backgroundImage: "url(images/icons/vip.gif)", backgroundRepeat: "no-repeat", backgroundPosition: bgPosition, paddingLeft: '30px', height:"10px", width:"10px" });

Use this line of code, thats it.

Plz Mark my Solution as Accept and Give me thumbs up, if you find it Helpful.

Regards,

Samaksh

[Arun_S1]

@VIKAS MISHRA Navigate to the client script "Highlight VIP Caller"  in the script replace the below line in the line number 27. Marked in blue is the newly added content.

callerLabel.setStyle({backgroundImage: "url(images/icons/vip.gif)", backgroundRepeat: "no-repeat", backgroundPosition: bgPosition,backgroundSize: 'contain', paddingLeft: '30px' });

Please mark the appropriate response as correct answer and helpful.

Thanks!!

[VIKAS MISHRA]

Thanks Arun, it actually now increased the size of icone, but its to big , so can you please tell me how can i change its size in the script, means where is its pixel seeting in the script so that i can add the pixels as per my convenient