[UI] Message Box icons don't have hover effect.

[apurv-1]

Description:

If the user hovers over icons like Emoji picker or microphone or '+' icon, the cursor changes to pointer but the icon color remains the same.

Steps to reproduce:

1. Open any room, and Try hovering over any of the mentioned icons.

Expected behavior:

We can add a hover effect for changing the colour of the icon.

Actual behavior:

Only cursor changes to pointer.

Server Setup Information:

• Version of Rocket.Chat Server: 3.13.0-develop
• Operating System: linux
• Deployment Method:
• Number of Running Instances:
• DB Replicaset Oplog:
• NodeJS Version: 12.18.4 - x64
• MongoDB Version: 4.2.8

Client Setup Information

• Desktop App or Browser Version: Chrome 88.0
• Operating System: Windows 10

Additional context

bandicam.2021-03-11.03-39-32-418.mp4

[maansiii]

Use Font Awesome and add this to your html element.

[maansiii]

<i class="fas fa-plus"></i>

[apurv-1]

@maansiii You can check the PR I've mentioned in this issue.
And if you think you have a better solution. Please go ahead and open a new PR for this. 😃

[Vishv07]

@apurv-1 can I work upon this?

[apurv-1]

I've already opened a PR and mentioned it, But if you have a better solution please go ahead! @Vishv07 .