Reagieren Sie auf die Chat-Seite mit der linken Leiste, dem Umschalter und der Bot-Komponente ⇐ CSS

[Guest]

Ich versuche, eine Chat-Seite mit React zu erstellen.
Die Benutzeroberfläche ist Chatgpt ziemlich ähnlich. Es gibt eine linke Leiste, einen Umschaltknopf, der die linke Leiste und die Chat-Komponente öffnet und schließt.
Der Umschalter ist vertikal in der Mitte ausgerichtet. Und es sollte in der Mitte ausgerichtet sein, obwohl die Chat-Komponente bei neuen Chats erhöht werden kann.
Kann jemand helfen?
Ich verwende derzeit so etwas wie:

Code: Select all

{/* Sidebar */}





{/* Pusher */}

Im Moment ist das Symbol nicht richtig ausgerichtet. Es befindet sich oben auf der Seite.
Ich kann versuchen, das Raster zu verwenden, um das Symbol und den Chat als zwei Rasterspalten anzuzeigen, aber dann ist das Symbol scrollbar und nicht vertikal ausgerichtet.