ChatApp CSS Illustration (Vanilla CSS)

fala lucas, tudo bom?

Cara fiquei pensando aqui e talvez poderiamos resolver o problema com o pseudo elemento no body, usando um overflow-hidden para esconder o corpo da imagem a partir do momento que ela ultrapasse o tamanho do body! seria interessante testar, claro que usariamos um position: relative; no body, e nos pseudos elementos absolute!

espero ter contribuido para uma possivel solução!... 👍

Hey Lucas, is the arrow in the text area a button or it's just an SVG? I made mine a button. And also I'll appreciate if you can check my solution too and give a review, I'll appreciate it.

Man, the background feels so alive, & the way the elements are loaded on the screen. This was really impressive in my opinion. hope you don't mind me digging through the code.

I'm curious what the '@media (prefers-reduced-motion:reduce)' does. I've seen this in a couple of places but I'm not really sure what it does. Thanks for any explanation from anyone.

I know this might be a rookie question, is the minified CSS file supposed to improve the loading speed of the site? How would I minify my own files?

All in all, this is a really beautiful site.

Actually, the 2 background objects don't fit well for large screens. In your CSS positioning, instead of using a fixed distance, I propose you to fix the distances according to percentages so as to make it a relatively absolute position according to big PC screens

@correlucas when seen on a phone the phone itself seems a little bit distorted e.g the speaker is left aligned the messages overflow I think for that you needed to define a fixed width for such elements so that it should be more ... Anyway I saw the improvements ... Passed from superb to exceptional

One of the best ones i've seen, well done!

Looking awesome!