DOCS: Add new snapshots (#44)

README.md

@@ -1,74 +1,85 @@
 # IndoGitHubers
 
-![IndoGitHubers_latest](https://github.com/depapp/IndoGitHubers/assets/6134774/7b49fda3-5015-409c-ac2d-d883b1f2a36e)
+[![E2E](https://github.com/depapp/IndoGitHubers/actions/workflows/e2e.yml/badge.svg)](https://github.com/depapp/IndoGitHubers/actions/workflows/e2e.yml)
+
+Live: [www.indogithubers.com](https://www.indogithubers.com/)
+
+| Desktop | Mobile |
+| ------- | ------ |
+| ![IndoGitHubers_latest](./screenshots/desktop.png) | ![IndoGitHubers_latest](./screenshots/mobile.png) |
+
+## 📋 Description
 
-## :clipboard: description
 IndoGitHubers is an application that displays the GitHub rank of users in Indonesia. It provides detailed information about each user, including their number of followers and contributions.
 The IndoGitHubers app fetches data from the GitHub API and displays it in a user-friendly format. The app allows users to sort the list of users by different criteria and search for specific users.
 
+## 💡 Features
 
-## :bulb: feature
 - **Badge**: You can embed your GitHub rank. [more details](https://github.com/depapp/IndoGitHubers/blob/main/BADGE_USAGE.md)
 - **GitHub Rank**: The app displays the GitHub rank of users in Indonesia. This includes their number of followers and contributions.
 - **Sorting**: Users can sort the list of users by different criteria, such as the number of followers or contributions.
 - **Search**: Users can search for specific users using the search bar.
 
+## 🖼️ Showcases
 
-## :framed_picture: showcase
 Check out the GitHub users who are standing out with the [IndoGitHubers-badge](https://github.com/depapp/IndoGitHubers/blob/main/BADGE_USAGE.md) on their public profiles:
-<details>
 
-<summary>click me!</summary>
+<details>
+<summary>Click to expand!</summary>
 
 * [depapp](https://github.com/depapp)
-
 * [sendomoka](https://github.com/sendomoka)
-
 * [taradevio](https://github.com/taradevio)
-
 * [chandrabezzo](https://github.com/chandrabezzo)
-
 * [crosbydoo](https://github.com/crosbydoo)
-
 * [yaffalhakim1](https://github.com/yaffalhakim1)
-
 * [syofyanzuhad](https://github.com/syofyanzuhad)
-
 * [AsadSaleh](https://github.com/AsadSaleh)
 
 </details>
 
 
-## :computer: how to setup
-To install the IndoGitHubers app, you can either clone the repository and run it locally, or you can visit the live version of the app hosted on Vercel at https://indogithubers.vercel.app/.
+## 🧑‍💻 How to setup
+
+To install the IndoGitHubers app, you can either clone the repository and run it locally, or you can visit the live version of the app hosted on Vercel at [www.indogithubers.com](https://www.indogithubers.com/).
 
 If you choose to run it locally, follow these steps:
+
 - Clone the repository
-```
+
+```bash
 git clone https://github.com/depapp/indogithubers.git
 ```
+
 - Navigate to the project directory
-```
+
+```bash
 cd indogithubers
 ```
+
 - Install the dependencies
-```
+
+```bash
 pnpm install
 ```
+
 - Run the app
-```
+
+```bash
 pnpm run dev
 ```
 
-## :muscle: support me
-<a href="https://www.nihbuatjajan.com/depapp" target="_blank"><img src="https://d4xyvrfd64gfm.cloudfront.net/buttons/default-cta.png" alt="Nih buat jajan" style="height: 51px !important;" ></a>
+## 💪 Support me
+
+<a href="https://www.nihbuatjajan.com/depapp" target="_blank"><img src="https://d4xyvrfd64gfm.cloudfront.net/buttons/default-cta.png" alt="Nih buat jajan" height="30px"></a>
+
+<a href="https://saweria.co/depapp" target="_blank"><img src="https://github-production-user-asset-6210df.s3.amazonaws.com/6134774/278801090-c4efd5c9-c0a7-43dc-9ea1-c21bc1a55203.png" width="70px" height="70px"></a>
 
-<a href="https://saweria.co/depapp" target="_blank"><img src="https://github-production-user-asset-6210df.s3.amazonaws.com/6134774/278801090-c4efd5c9-c0a7-43dc-9ea1-c21bc1a55203.png" width="20%" height="20%"></a>
+<a href="https://www.paypal.me/depapp" target="_blank"><img src="https://www.paypalobjects.com/digitalassets/c/website/marketing/apac/C2/logos-buttons/optimize/44_Yellow_PayPal_Pill_Button.png" height="35px"></a>
 
-<a href="https://www.paypal.me/depapp" target="_blank"><img src="https://www.paypalobjects.com/digitalassets/c/website/marketing/apac/C2/logos-buttons/optimize/44_Yellow_PayPal_Pill_Button.png"></a>
 
+## 👥 Contributors
 
-## :busts_in_silhouette: contributors
 If you'd like to contribute to the IndoGitHubers app, you can fork the repository, make your changes, and submit a pull request. Please make sure to follow the existing code style and add tests for any new functionality.
 
 <a href="https://github.com/depapp/IndoGitHubers/graphs/contributors"><img src="https://contrib.rocks/image?repo=depapp/IndoGitHubers" alt="All the amazing contributors of IndoGitHubers"></a>