Hey. I have been trying to implement Sendbird chat functionality in our React application. Most of the things works nicely but I have got stuck in one issue. I am trying to use my own
MessageInputBox component instead of the default one. It works okay.
The issue is that in the DOM, the parent
div of the
MessageInputBox component has a class
sendbird-converstation__footer which has some padding
css applied. I don’t want that padding to be there. And I want to add some
background-color to that parent div. Is there a way I can override this internal css?
I am attaching an image below for reference.
As you can see in the image, my custom
MessageInputBox currently is just a plain div
<div>This will be the custom input box in some time</div>
And it’s parent is the Sendbird internal div with the class
sendbird-conversation__footer with the unwanted padding applied. I want to override it someway.
I hope i was able to explain it well. Please let me know if it’s possible. Thanks!