docs: Add a seperate directory for remote server installation guide w…

…ith some outlines and placeholders.

apps/react/docs/docs/02-Installation/index.mdx → apps/react/docs/docs/02-Installation Localhost/index.mdx

@@ -1,6 +1,6 @@
 ---
-id: instalation-guide
-title: Instalation Guide
+id: installation-guide-localhost
+title: Installation on Localhost
 ---
 
 # WKS Platform Installation Guide

apps/react/docs/docs/03-Installation Remote Server/00-Prerequisites/index.mdx

@@ -0,0 +1,14 @@
+---
+id: prerequisites
+title: 🔍 Prerequisites
+---
+
+# Prerequisites
+
+## 💻 Hardware and Software Requirements
+
+> List the minimum and recommended server specifications for running the platform remotely.
+
+## 🛠️ Initial Setup
+
+> Step-by-step guide on configuring servers to meet the platform’s operational requirements. May include network configurations as needed.

apps/react/docs/docs/03-Installation Remote Server/01-Installation Guide/index.mdx

@@ -0,0 +1,22 @@
+---
+id: installation
+title: 🛠️ Installation Guide
+---
+
+# Installation Guide
+
+### Customizing Environment Variables 🛠️
+
+> Instructions on how to effectively set and customize environment variables.
+
+### Configuration File Management 📋
+
+> Tips on managing .yml/.yaml files, including common tweaks and optimizations.
+
+## 🚀 Installing the WKS Power Platform
+
+> Detailed steps for installing the platform, including downloading necessary software, deploying services, and initial service configuration.
+
+## ✅ Post-Installation Checks
+
+> Checklist to ensure everything is set up correctly and running as expected.

apps/react/docs/docs/03-Installation Remote Server/02-Troubleshooting Common Issues/index.mdx

@@ -0,0 +1,14 @@
+---
+id: troubleshooting-common-issues
+title: 👷 Troubleshooting Issues
+---
+
+# Troubleshooting Common Issues
+
+## 🔍 Identifying Common Problems
+
+> A list of frequent issues encountered during remote deployments.
+
+## 🛠️ Recommended Solutions
+
+> Practical solutions and troubleshooting steps for each listed problem.

apps/react/docs/docs/03-Installation Remote Server/03-Security Best Practices/index.mdx

@@ -0,0 +1,14 @@
+---
+id: security-best-practices
+title: 🔒 Security Best Practices
+---
+
+# Security Best Practices
+
+## 🔑 Keycloak Security Setups
+
+> Detailed best practices for configuring Keycloak in a remote environment to ensure robust security.
+
+## 🛡️ General Security Tips
+
+> General advice on maintaining the security integrity of the platform when hosted remotely.

apps/react/docs/docs/03-Installation Remote Server/index.mdx

@@ -0,0 +1,27 @@
+---
+id: installation-guide-remote
+title: Installation on Remote Server
+---
+
+# WKS Platform Installation Guide for Remote Servers
+
+## 🌟 Introduction
+
+Multi-tenancy on the WKS Power Platform is designed to provide each tenant with a secure and isolated operational environment, akin to providing separate office suites within a single corporate building. This architecture allows service providers to manage multiple clients efficiently while ensuring that each client's data and operations remain private and secure.
+
+## 🏛️ Architectural Overview
+
+### Tenant URL Structure 🌐
+
+- Each tenant accesses their environment through a unique subdomain, following the format tenant_id.somedomain.com (e.g., saasCustomer1.wksplatform.com).
+- This subdomain serves as the dedicated entry point to the tenant’s specific portion of the platform, ensuring direct and secure access.
+
+### Keycloak Realms 🔐
+
+- Each tenant has a separate Keycloak realm, providing a dedicated security domain that controls authentication and authorization. This setup ensures that user credentials and permissions are managed locally within each tenant's realm, enhancing security and privacy.
+- Upon onboarding a new tenant, a realm is specifically created and configured with unique security settings and user management protocols tailored to meet the tenant's needs.
+
+### MongoDB Databases 🗃️
+
+- Each tenant has a separate database to store tenant-specific data securely and maintain complete data isolation between tenants.
+- Creating a dedicated MongoDB database for each new tenant setup, ensuring that data from one tenant is completely inaccessible to another.

apps/react/docs/src/css/custom.css

@@ -43,4 +43,8 @@ img[alt$="><"] {
   height: auto;
   margin: auto;
   float: none!important;
+}
+
+h1 {
+  margin-top: 1rem;
 }