doc/update overview section (#904)

* Update overview section

* fix typo

* logomeaning

* Update introduction content

* Update introduction content

* Update suport the project

* typo

* Added linked information

* Finished overview section

docs/docs/contribution-guidelines.md

@@ -0,0 +1,5 @@
+---
+sidebar_position: 6
+---
+
+# Contribution Guidelines

docs/docs/overview/introduction.md

@@ -1,7 +0,0 @@
----
-sidebar_position: 1
----
-
-# Introduction
-
-This is the first

docs/docs/overview/introduction.mdx

@@ -0,0 +1,25 @@
+---
+sidebar_position: 1
+---
+
+# Introduction
+
+Hello, I am glad you are here.
+
+<p style={{textAlign: 'center'}}>
+
+![Introduction Image](https://user-images.githubusercontent.com/27055614/182044984-2ee6d1ed-c4a7-4331-8a4b-64fcde77fe1f.png)
+
+</p>
+
+My name is Alex. I am an Electrical Engineer by schooling, then turned into a Software Engineer by trade, and by the pure love of problem solving.
+
+We were lying in bed with our newborn, and my wife said, "We are starting to accumulate a lot of photos and videos of our baby and I don't want to pay for **_App-Which-Must-Not-Be-Named_** anymore, and you always want to build something for me. So why don't you build me an app which can do that?"
+
+That was how the idea started to grow in my head. After that, I began to find existing solutions in the self-hosting space with similar backup functionality and the performance level of the **_App-Which-Must-Not-Be-Named_**. As a result, the current solutions mainly focus on the gallery-type application. However, I want a simple-to-use backup tool with a native mobile app that can view photos and videos efficiently. So I set sail on this journey as a hungry engineer on the hunt.
+
+Another motivation that pushed me to deliver my execution of the **_App-Which-Must-Not-Be-Named_** alternative or replacement is for contributing back to the open source community that I have greatly benefited from over the years.
+
+I'm proud to share this creation with you, who values privacy, memories, and the joy of looking back at those moments in an easy-to-use and friendly interface.
+
+If you like the application or it helps you in someway, please consider [supporting](./support-the-project.md) to the project. It will help me to continue to develop and maintain the application.

docs/docs/overview/logo-mearning.md

@@ -3,3 +3,15 @@ sidebar_position: 2
 ---
 
 # Logo meaning
+
+Why the colorful flower, you asked?
+
+I really like the Japanese culture, especially books, history, and food. The current logo is a spin-off of [the Oda clan's symbol](https://en.wikipedia.org/wiki/Oda_clan). 
+
+![Oda_emblem](https://user-images.githubusercontent.com/27055614/182044504-a5ed33a8-5640-42de-b359-18fdbee9fb90.svg)
+
+One of my favorite books is [Taikō](https://www.goodreads.com/book/show/336228.Taiko), it is the story about a prominent figure in the history of Japan, [Toyotomy Hideyoshi](https://www.britannica.com/biography/Toyotomi-Hideyoshi). He came from nothing, and through resilient and his wonderful mind, he has become one of the most powerful ruler in Japan's history. I enjoy his personality and the way he moved through life.
+
+The color is an adaptation of **_App-Which-Must-Not-Be-Named_**'s color scheme, with an extra color (pink) to complete the flower's fifth petals. The petal layers are the same color scheme as the main layer rotating back and forth to "bring the flower to life."
+
+![image](https://user-images.githubusercontent.com/27055614/182044984-2ee6d1ed-c4a7-4331-8a4b-64fcde77fe1f.png)

docs/docs/overview/support-the-project.md

@@ -3,3 +3,18 @@ sidebar_position: 3
 ---
 
 # Support the project
+
+I've committed to this project, and I will not stop. I will keep updating the docs, adding new features, and fixing bugs. But I can't do it alone. So I need your help to give me additional motivation to keep going.
+
+As our hosts in the [selfhosted.show - In the episode 'The-organization-must-not-be-name is a Hostile Actor'](https://selfhosted.show/79?t=1418) said, this is a massive undertaking that the team and I are doing. And I would love to someday be able to do this full-time, and I am asking for your help to make that happen.
+
+If you feel like this is the right cause and the app is something you are seeing yourself using for a long time, please consider supporting the project with the option below.
+
+## Donation
+
+* Monthly donation via [GitHub Sponsors](https://github.com/sponsors/alextran1502)
+* One-time donation via [Github Sponsors](https://github.com/sponsors/alextran1502?frequency=one-time&sponsor=alextran1502)
+
+## Contribution
+
+If you are a programmer/developer and the app's [technology stack](./technology-stack.md) is something you are familiar with, please consider contributing to the project. The team and I am always looking for new contributors. You can refer to the [contribution guildelines](/docs/contribution-guidelines) to start leaving your mark on the project. 

docs/docs/overview/technology-stack.md

@@ -3,3 +3,21 @@ sidebar_position: 4
 ---
 
 # Technology stack
+
+The app is built with the following technologies
+
+## Frontend
+* [Flutter](https://flutter.dev/) for the mobile app
+  * [Riverpod](https://riverpod.dev/) as state management.
+* [SvelteKit](https://kit.svelte.dev/) for the Web.
+
+## Backend
+* [Nest.js](https://nestjs.com/) for the server.
+  * [TypeORM](https://typeorm.io/) for database management.
+* [PostgreSQL](https://www.postgresql.org/) for the database.
+* [Redis](https://redis.io/) for communication between the core server and the microservices.
+* [NGINX](https://www.nginx.com/) for internal communication between containers and load balancing when scaling.
+
+# App architecture
+
+![Immich Architecture](./img/app-architecture.png)

docs/docusaurus.config.js

@@ -63,7 +63,7 @@ const config = {
         },
       },
       navbar: {
-        title: "Immich",
+        title: "Immich Documentation",
         logo: {
           alt: "Immich University Logo",
           src: "img/logo.png",

docs/src/css/custom.css

@@ -5,9 +5,10 @@
  */
 
 @import url("https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap");
-
+@import url("https://fonts.googleapis.com/css2?family=Overpass:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap");
 html {
-  font-family: "Work Sans", sans-serif;
+  /* font-family: "Work Sans", sans-serif; */
+  font-family: "Overpass", sans-serif;
 }
 
 /* You can override the default Infima variables here. */