Fix: no friend requests & Finish: README.md (#3)

Fix: no friend requests & Finish:  README.md

Author: Matheus Ishiyama

README.md

@@ -1 +1,35 @@
-# chat-app-frontend
+# Chat app (frontend)
+
+![JavaScript](https://img.shields.io/badge/-JavaScript-F7DF1E?style=flat-square&logo=javascript&logoColor=black)
+![Nextjs](https://img.shields.io/badge/-Nextjs-000000?style=flat-square&logo=next.js&logoColor=white)
+![React](https://img.shields.io/badge/-React-1572B6?style=flat-square&logo=react&logoColor=white)
+![HTML5](https://img.shields.io/badge/-HTML5-E34F26?style=flat-square&logo=html5&logoColor=white)
+![CSS3](https://img.shields.io/badge/-CSS3-1572B6?style=flat-square&logo=css3)
+
+This a real time chat with socket.
+
+**Screens**
+
+I create this wireframes in `Figma`, you can see file [here](./assets/chat-app.fig).
+
+![Wireframes](./assets/chat-app-screens.png)
+
+## How it works?
+
+First you need to create and confirm email.
+![Register](./assets/chat-app-register.gif)
+
+After you register and confirm, you can login with `username` and `password`
+![Login](./assets/chat-app-login.gif)
+
+You can send friend request to your friend, just need his `username`.
+![Friends](./assets/chat-app-friends.gif)
+
+And chat xD
+![Messages](./assets/chat-app-messages.gif)
+
+---
+
+If you wanna see backend click [here](https://github.com/MatheusIshiyama/chat-app-backend).
+
+**Developed by Matheus Ishiyama**

assets/chat-app-friends.gif

@@ -230,6 +230,20 @@
     align-items: center;
 }
 
+.body .friends .friendsCards .friendCard {
+    margin: 5px 25px 20px 25px;
+    width: 540px;
+    padding: 10px 20px;
+    border-radius: 10px;
+    background: white;
+    font-size: 1em;
+    font-family: "Poppins";
+    color: #183657;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+}
+
 .body .friends .friendsCards .requestCard p {
     color: #007cff;
     font-size: 1em;