This message was deleted.

With the usage of the components, sky is pretty much the limit as to how your app's layout should be presented the your visitors. This might be a great starting point to look at: https://github.com/livekit/components-js/tree/main/examples/nextjs

thanks for the response i tried to force custom styles using css but the issue is that all classnames are pretty much identical i thought there was a way to handle that maybe with a hook that comes out of the box or something but i guess that's not the case.

Just my 2 cents, but maybe have a look at this repo on how they style everything: https://github.com/livekit/components-js/tree/main/packages/styles

alright will be checking it out, thanks a lot for ur time.

You are welcome 🙂

there is also a set of css vars that you can override to effectively theme the components. We’ll need better docs for that, but the styles package Pat linked to defines those variables as well. To your point about all CSS classes being identical, can you elaborate on that?

hello yes sure, whenever a user enters the room all the cameras section have the same classname when inspecting therefore i can't seperate them , i may be wrong tho because this is the second day of me using it.

how would you want to separate them? by Track.Source or by participant id ? Can you share a bit more about what you’re trying to achieve?