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!