[Docs] Update README: Improve description, layout & formatting

README.md

@@ -1,37 +1,73 @@
+> [!TIP]
+> 🎉 I'm excited to announce that WGDashboard is officially listed on DigitalOcean's Marketplace! For more information, please visit [Host WGDashboard & WireGuard with DigitalOcean](https://donaldzou.dev/WGDashboard-Documentation/host-wgdashboard-wireguard-with-digitalocean.html) for more information!
+
 > [!NOTE]
 > **Help Wanted 🎉**: Localizing WGDashboard to other languages! If you're willing to help, please visit https://github.com/donaldzou/WGDashboard/issues/397. Many thanks!
+
 <hr>
 
 <p align="center">
-  <img alt="WGDashboard" src="./src/static/app/public/img/logo.png" width="128">
+  <img alt="WGDashboard" src="./src/static/app/public/img/logo.png" width="128"/>
+</p>
+
+<h1 align="center">
+  WGDashboard
+</h1>
+
+<p align="center">
+  <img src="https://forthebadge.com/images/badges/made-with-python.svg"/>
+  <img src="https://forthebadge.com/images/badges/made-with-javascript.svg"/>
+  <img src="https://forthebadge.com/images/badges/license-mit.svg"/>
 </p>
-<h1 align="center">WGDashboard</h1>
+
 <p align="center">
-    <img src="https://forthebadge.com/images/badges/made-with-python.svg">
-    <img src="https://forthebadge.com/images/badges/made-with-javascript.svg">
-    <img src="https://forthebadge.com/images/badges/license-mit.svg">
+  <img src="https://forthebadge.com/images/badges/built-with-love.svg"/>
 </p>
+
 <p align="center">
-    <img src="https://forthebadge.com/images/badges/built-with-love.svg">
+  <a href="https://github.com/donaldzou/wireguard-dashboard/releases/latest">
+    <img src="https://img.shields.io/github/v/release/donaldzou/wireguard-dashboard"/>
+  </a>
+  <a href="https://wakatime.com/badge/github/donaldzou/WGDashboard">
+    <img src="https://wakatime.com/badge/github/donaldzou/WGDashboard.svg" alt="wakatime"/>
+  </a>
+  <a href="https://hits.seeyoufarm.com">
+    <img src="https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fdonaldzou%2FWGDashboard&count_bg=%2379C83D&title_bg=%23555555&icon=github.svg&icon_color=%23E7E7E7&title=Visitor&edge_flat=false"/>
+  </a>
+  <img src="https://img.shields.io/docker/pulls/donaldzou/wgdashboard?logo=docker&label=Docker%20Image%20Pulls&labelColor=ffffff"/>
 </p>
+
 <p align="center">
-  <a href="https://github.com/donaldzou/wireguard-dashboard/releases/latest"><img src="https://img.shields.io/github/v/release/donaldzou/wireguard-dashboard"></a>
-  <a href="https://wakatime.com/badge/github/donaldzou/WGDashboard"><img src="https://wakatime.com/badge/github/donaldzou/WGDashboard.svg" alt="wakatime"></a>
-  <a href="https://hits.seeyoufarm.com"><img src="https://hits.seeyoufarm.com/api/count/incr/badge.svg?url=https%3A%2F%2Fgithub.com%2Fdonaldzou%2FWGDashboard&count_bg=%2379C83D&title_bg=%23555555&icon=github.svg&icon_color=%23E7E7E7&title=Visitor&edge_flat=false"/></a>
+  Monitoring WireGuard is not convenient, in most case, you'll need to login to your server and type <code>wg show</code>. That's why this project is being created, to view and manage all WireGuard configurations in a easy way.
 </p>
-<p align="center">Monitoring WireGuard is not convenient, in most case, you'll need to login to your server and type <code>wg show</code>. That's why this project is being created, to view and manage all WireGuard configurations in a easy way.</p>
-<p align="center">With all these awesome features, while keeping it <b>easy to install and use</b></p>
 
-<p align="center"><b><i>This project is not affiliate to the official WireGuard Project</i></b></p>
+<p align="center">
+  With all these awesome features, while keeping it <b>easy to install and use</b>
+</p>
 
+<p align="center">
+  <b><i>This project is not affiliate to the official WireGuard Project</i></b>
+</p>
 
 <p align="center">
   Join our Discord Server for quick help, or you wanna chat about this project!
 </p>
+
+<p align="center">
+  <a align="center" href="https://discord.gg/72TwzjeuWm">
+    <img src="https://img.shields.io/discord/1276818723637956628?labelColor=ffffff&style=for-the-badge&logo=discord&label=Discord"/>
+  </a>
+</p>
+
 <p align="center">
-  <a align="center" href="https://discord.gg/72TwzjeuWm"><img src="https://img.shields.io/discord/1276818723637956628?labelColor=ffffff&style=for-the-badge&logo=discord&label=Discord"></a>
-</p> 
+  Alternatively, you can also reach out at our Matrix.org Chatroom :)
+</p>
 
+<p align="center">
+  <a href="https://app.element.io/#/room/#wgd:matrix.org">
+    Matrix.org Chatroom
+  </a>
+</p>
 
 <hr>
 

src/static/locale/active_languages.json

@@ -1,67 +1,67 @@
 [
-	{
-		"lang_id": "cs",
-		"lang_name": "Czech",
-		"lang_name_localized": "Česky"
-	},
-	{
-		"lang_id": "de-de",
-		"lang_name": "German",
-		"lang_name_localized": "Deutsch"
-	},
-	{
-		"lang_id": "en",
-		"lang_name": "English",
-		"lang_name_localized": "English"
-	},
-	{
-		"lang_id": "es-es",
-		"lang_name": "Spanish",
-		"lang_name_localized": "Español"
-	},
-	{
-		"lang_id": "it-it",
-		"lang_name": "Italian",
-		"lang_name_localized": "Italiano"
-	},
-	{
-		"lang_id": "nl-nl",
-		"lang_name": "Dutch",
-		"lang_name_localized": "Nederlands"
-	},
-	{
-		"lang_id": "ru",
-		"lang_name": "Russian",
-		"lang_name_localized": "Русский"
-	},
-	{
-		"lang_id": "tr-tr",
-		"lang_name": "Turkish",
-		"lang_name_localized": "Türkçe"
-	},
-	{
-		"lang_id": "uk",
-		"lang_name": "Ukrainian",
-		"lang_name_localized": "Українська"
-	},
-	{
-		"lang_id": "zh-cn",
-		"lang_name": "Chinese (Simplified)",
-		"lang_name_localized": "中文（简体）"
-	},
-	{
-		"lang_id": "zh-hk",
-		"lang_name": "Chinese (Traditional)",
-		"lang_name_localized": "中文（繁體）"
-	},
-	{
+    {
+        "lang_id": "cs",
+        "lang_name": "Czech",
+        "lang_name_localized": "Česky"
+    },
+    {
+        "lang_id": "de-de",
+        "lang_name": "German",
+        "lang_name_localized": "Deutsch"
+    },
+    {
+        "lang_id": "en",
+        "lang_name": "English",
+        "lang_name_localized": "English"
+    },
+    {
+        "lang_id": "es-es",
+        "lang_name": "Spanish",
+        "lang_name_localized": "Español"
+    },
+    {
+        "lang_id": "it-it",
+        "lang_name": "Italian",
+        "lang_name_localized": "Italiano"
+    },
+    {
+        "lang_id": "nl-nl",
+        "lang_name": "Dutch",
+        "lang_name_localized": "Nederlands"
+    },
+    {
+        "lang_id": "ru",
+        "lang_name": "Russian",
+        "lang_name_localized": "Русский"
+    },
+    {
+        "lang_id": "tr-tr",
+        "lang_name": "Turkish",
+        "lang_name_localized": "Türkçe"
+    },
+    {
+        "lang_id": "uk",
+        "lang_name": "Ukrainian",
+        "lang_name_localized": "Українська"
+    },
+    {
+        "lang_id": "zh-cn",
+        "lang_name": "Chinese (Simplified)",
+        "lang_name_localized": "中文（简体）"
+    },
+    {
+        "lang_id": "zh-hk",
+        "lang_name": "Chinese (Traditional)",
+        "lang_name_localized": "中文（繁體）"
+    },
+    {
         "lang_id": "sv-se",
         "lang_name": "Swedish",
         "lang_name_localized": "Svenska"
-  	},
-	{
-		"lang_id": "pl",
-		"lang_name": "Polish",
-		"lang_name_localized": "Polski"
-	}
-]
+    },
+    {
+        "lang_id": "pl",
+        "lang_name": "Polish",
+        "lang_name_localized": "Polski"
+    }
+]