Skip to content

Customise fonts chat output through css

Vahid Hedayati edited this page Nov 6, 2015 · 2 revisions

Add the following to your local application's main.css file.

Remember these will work for customer live chat and are also included in the main plugin, so if you are using the provided feature such as clicking on wsChat controller and joining chat this way. Then you will be hitting the CSS defined in the chat you may be able to override it by using !important so i.e.

#msgBroadcast {
	background: #780000 !important;
	color: #FFF;
	width:100%;
}
```


```

#liveInitialisation {
	background: #780000;
	color: #FFF;
	width:100%;
}
#msgBroadcast {
	background: #000000;
	color: #FFF;
	width:100%;
}
#msgReceived {
	background: #FF0000;
	color: #FFF;
	width:100%;
}
#msgSent {
	background: #0000FF;
	color: #000;
	width:100%;
}
.msgPersonSent {
	background: #000;
	color: #fff;
}
.msgPersonReceived {
	background: #2a12a1;
	color: #FFF;
}
.msgSentContent {
	background: #DADADA;
	color: #000;
}
.msgPersonReceived {
	background: #2a12a1;
	color: #FFF;
}
.msgReceivedContent {
	background: #00aaaa;
	color: #000;
}
.roomPerson {
	background: #aaa000;
	color: #000;
}
.roomMessage {
	background: #00fFFF;
	color: #000;
}

```
Clone this wiki locally