Added some styling

Signed-off-by: Šimon Brandner <simon.bra.ag@gmail.com>

res/css/views/rooms/_MessageComposer.scss

@@ -247,8 +247,30 @@ limitations under the License.
     mask-image: url('$(res)/img/element-icons/room/composer/sticker.svg');
 }
 
-.mx_MessageComposer_sendMessage::before {
+.mx_MessageComposer_sendMessage {
-    mask-image: url('$(res)/img/element-icons/send-message.svg');
+    cursor: pointer;
+    position: relative;
+    margin-right: 6px;
+    width: 32px;
+    height: 32px;
+    border-radius: 100%;
+    background-color: $button-bg-color;
+
+    &:before {
+        position: absolute;
+        height: 16px;
+        width: 16px;
+        top: 8px;
+        left: 9px;
+
+        mask-image: url('$(res)/img/element-icons/send-message.svg');
+        mask-repeat: no-repeat;
+        mask-size: contain;
+        mask-position: center;
+
+        background-color: $button-fg-color;
+        content: '';
+    }
 }
 
 .mx_MessageComposer_formatting {

src/components/views/rooms/MessageComposer.js

@@ -53,7 +53,7 @@ ComposerAvatar.propTypes = {
 function SendButton(props) {
     return (
         <AccessibleTooltipButton
-            className="mx_MessageComposer_button mx_MessageComposer_sendMessage"
+            className="mx_MessageComposer_sendMessage"
             onClick={props.onClick}
             title={_t('Send message')}
         />