@tommy
I have found this particular post you have explain to the same problem what I have.
Unfortunately, it is not working for me.
I have created <div id="zmmtg-root"/> inside the render() of my component class. But still I do see that there is a div tag being appended at the index.html of my react app.
Then I added the given css into my styles.css file which I kept all my css stylings.
But it did not resolve the overflow: hidden; issue. Also my entire css styles are being messed up. And I’m seeing my entire page black. (only the MeetingComponent view)
@tommy Now my problem is, ZoomMtg break my css. It simply override all my <h>, <p> <font> etc. It is not practical for me to include !important to all my own custom css stylesheets. If I do so, in return it will break zoom web view components. Also I am using external react components which have their css styles as well(e.g: DropDown component). I’m in a SPA application created using create-react-app. Please provide me a viable solution.
Watching this thread because I’m also looking for a solution to this.
Also developing a SPA and also getting my CSS broken by the web SDK
OP if you have figured this out please kindly let me know
This is currently how the Web SDK works. You can try adjusting the Web SDK CSS or host the Web SDK on a sub domain / path seperate from your app so it does not break your styling.
We are working on a more customizable Web SDK in the future.
Hi, Does the WebSDK creates inline styles with JS?
I’m also encounter this issue when the meeting breaks my styles. I Tried overloading some classes but it’s a lot. could be just a css that the Zoom SDK uses not all bootstrap styles?
How can find the css style of the zoom sdk, I cannot find the style zmmtg-root with in the local version of sample app? I tried add a new css style to overload the previous style, but it fails when the meeting starts(it turns back to full-screen)
I wanted to try a proof of concept with Customizable Zoom SDK, but it seems that “getting started” chapter forwards always to a form where information should be entered which is. anyway associated with my account, and from there I am always taken to apply for a demo or buy.
Under developer account there is nothing to find related to customizable SDK.
This doesn´t work because there is no package in npm with this name.
npm install @zoomus/instantsdk --save
Is there any working instructions to try the new SDK?
Thank you for reaching out to the Zoom Developer Forum. Please submit a new forum topic and fill out the post template so that we have enough information to assist.