docs: add role description

docs/docs/architecture/_category_.json

@@ -1,4 +1,4 @@
 {
   "label": "Architecuture",
-  "position": 3
+  "position": 4
 }

docs/docs/architecture/er.md

@@ -2,6 +2,6 @@
 sidebar_position: 3
 ---
 
-# DataBase
+# ER diagram
 
 ![ER](./img/er.svg)

docs/docs/getstarted/docker.md

@@ -1,7 +1,7 @@
 ---
-sidebar_position: 2
+sidebar_position: 3
 ---
 
 # Running TestPlat as a Docker container
 
-## 
+Under development

docs/docs/getstarted/manual.md

@@ -1,5 +1,5 @@
 ---
-sidebar_position: 3
+sidebar_position: 2
 ---
 
 # Running TestPlat manually
@@ -24,7 +24,7 @@ Moves to backend directory, then install dependencies.
 
 ```bash
 cd backend
-npm ci
+npm install
 ```
 
 Initialize the database with the following command.
@@ -45,7 +45,7 @@ Moves to frontend directory, then install dependencies.
 
 ```bash
 cd frontend
-npm ci
+npm install
 ```
 
 Start frontend server

docs/docs/getstarted/selfhost.md

@@ -6,5 +6,5 @@ sidebar_position: 1
 
 TestPlat is designed for self-hosted use. There are two ways to self-host the application: “Manual” and “Docker”.
 
-- Docker (Recommended)
 - Manual
+- Docker

docs/docs/usage/_category_.json

@@ -0,0 +1,4 @@
+{
+  "label": "Usage",
+  "position": 3
+}

docs/docs/usage/roles.md

@@ -0,0 +1,67 @@
+---
+sidebar_position: 1
+---
+
+# Roles
+
+There are two types of roles in LandTCMS: "Global roles" and "Project roles".
+
+## Global roles
+
+This role is tied to each user's information and affects the entire site, regardless of the project.
+There are two types of roles:
+
+- Administrator
+- User
+
+Administrators can manage site-wide settings and users from the “Administration” menu.
+
+## Project roles
+
+This role can be set for members participating in each project.
+There are three types of roles:
+
+- Manager
+- Developer
+- Reporter
+
+### Permissions for each role
+
+#### Project
+
+| Action | Manager/Owner | Developer | Reporter | Not member |
+| ------ | ------------- | --------- | -------- | ---------- |
+| Delete | ✅            | ❌        | ❌       | ❌         |
+| Update | ✅            | ❌        | ❌       | ❌         |
+| Read   | ✅            | ✅        | ✅       | 🌓         |
+
+#### Project Members
+
+| Action      | Manager/Owner | Developer | Reporter | Not member |
+| ----------- | ------------- | --------- | -------- | ---------- |
+| Add         | ✅            | ❌        | ❌       | ❌         |
+| Delete      | ✅            | ❌        | ❌       | ❌         |
+| Change role | ✅            | ❌        | ❌       | ❌         |
+| Read        | ✅            | ✅        | ✅       | 🌓         |
+
+#### Folders and Test cases
+
+| Action | Manager/Owner | Developer | Reporter | Not member |
+| ------ | ------------- | --------- | -------- | ---------- |
+| Create | ✅            | ✅        | ❌       | ❌         |
+| Delete | ✅            | ✅        | ❌       | ❌         |
+| Update | ✅            | ✅        | ❌       | ❌         |
+| Read   | ✅            | ✅        | ✅       | 🌓         |
+
+#### Test runs
+
+| Action | Manager/Owner | Developer | Reporter | Not member |
+| ------ | ------------- | --------- | -------- | ---------- |
+| Create | ✅            | ✅        | ✅       | ❌         |
+| Delete | ✅            | ✅        | ✅       | ❌         |
+| Update | ✅            | ✅        | ✅       | ❌         |
+| Read   | ✅            | ✅        | ✅       | 🌓         |
+
+1. "Owner" and "Not member" are not role. "Owner" is the user who created project.
+   "Not member" means a user who is not a project member
+1. 🌓 means that read permission is only allowed if the project is set to public.

docs/docusaurus.config.js

@@ -4,7 +4,7 @@
 // There are various equivalent ways to declare your Docusaurus config.
 // See: https://docusaurus.io/docs/api/docusaurus-config
 
-import {themes as prismThemes} from 'prism-react-renderer';
+import { themes as prismThemes } from 'prism-react-renderer';
 
 /** @type {import('@docusaurus/types').Config} */
 const config = {
@@ -43,8 +43,7 @@ const config = {
           sidebarPath: './sidebars.js',
           // Please change this to your repo.
           // Remove this to remove the "edit this page" links.
-          editUrl:
-            'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
+          editUrl: 'https://github.com/facebook/docusaurus/tree/main/packages/create-docusaurus/templates/shared/',
         },
         theme: {
           customCss: './src/css/custom.css',
@@ -64,12 +63,10 @@ const config = {
           alt: 'TestPlat Logo',
           src: 'img/android-chrome-192x192.png',
         },
-        items: [
-          {to: '/docs', label: 'Docs', position: 'left'},
-        ],
+        items: [{ to: '/docs', label: 'Docs', position: 'left' }],
       },
       footer: {
-        style: 'dark',
+        style: 'light',
         copyright: `Copyright © ${new Date().getFullYear()} TestPlat. Built with Docusaurus.`,
       },
       prism: {

docs/src/css/custom.css

@@ -6,7 +6,7 @@
 
 /* You can override the default Infima variables here. */
 :root {
-  --ifm-color-primary: #228e9d;
+  --ifm-color-primary: #205d3b;
   --ifm-color-primary-dark: #29784c;
   --ifm-color-primary-darker: #277148;
   --ifm-color-primary-darkest: #205d3b;
@@ -19,7 +19,7 @@
 
 /* For readability concerns, you should choose a lighter palette in dark mode. */
 [data-theme='dark'] {
-  --ifm-color-primary: #fce3c3;
+  --ifm-color-primary: #4fddbf;
   --ifm-color-primary-dark: #21af90;
   --ifm-color-primary-darker: #1fa588;
   --ifm-color-primary-darkest: #1a8870;