Doc changes (#2106)

* refactored Storybook UI

* refactored Storybook UI

* removed extra cards from the doc, added card for ui components

* added hover behavior to doc page & made it look selected

* separate storybook docs and tests

* separating storybook tests and docs

* fixed spelling errors in docs

* Final round of edits for frontend, added backend folder architecture

* Created CODE_OF_CONDUCT.md

* Add code of conduct to contributing.md

docs/docs/contributor/local-setup/docker-setup.mdx

@@ -27,10 +27,14 @@ You can run `docker --version` to verify the installation.
 
 ## Step 1: Git Clone
 
-In your terminal, run the following command. 
+In your terminal, run the following command:
+
+:::info Note
 
 We recommend using SSH for this step. If you already haven't set up SSH keys, please do so first. You can learn more about it [here](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/about-ssh). 
 
+:::
+
 <Tabs>
 <TabItem value="ssh" label="SSH (Recommended)" default>
 

docs/docs/contributor/local-setup/ide-setup.mdx

@@ -6,7 +6,7 @@ sidebar_custom_props:
   icon: TbBrandVscode
 ---
 
-This section will help you set up your IDE for the project. If you haven't setup your development environment, please refer to our [local setup](/contributor/local-setup) section.
+This section will help you set up your IDE for the project. If you haven't set up your development environment, please refer to our [local setup](/contributor/local-setup) section.
 
 
 ## Visual Studio Code

docs/docs/contributor/local-setup/local-setup.mdx

@@ -41,7 +41,7 @@ twenty
 
 ## IDE Setup
 
-Once Twnenty is running on your computer, you will get the best experience by using an IDE that supports TypeScript and ESLint.
+Once Twenty is running on your computer, you will get the best experience by using an IDE that supports TypeScript and ESLint.
 You will find a guide for [VSCode](/contributor/local-setup/ide-setup) further in the documentation.
 ___
 

docs/docs/contributor/local-setup/troubleshooting.mdx

@@ -9,7 +9,7 @@ sidebar_custom_props:
 
 ## CR line breaks found [Windows]
 
-This is due to the linebreak characters of windows and the git configuration. Try running:
+This is due to the linebreak characters of Windows and the git configuration. Try running:
 ```
 git config --global core.autocrlf false
 ```
@@ -26,5 +26,5 @@ Try installing [yarn classic](https://classic.yarnpkg.com/lang/en/)!
 During Twenty installation, your postgres database needs to be provisioned with right schemas, extensions and users.
 We provide [different ways](/contributor/local-setup/yarn-setup#step-2-set-up-postgresql-database) to set up your postgres instance.
 
-If you sucessfully run this provisioning, you should have a `default` and a `metadata` schemas in your database.
+If you sucessfully run this provisioning, you should have `default` and `metadata` schemas in your database.
 If you don't, make sure you don't have multiple postgres instance running on your computer.

docs/docs/contributor/local-setup/wsl-setup.mdx

@@ -38,7 +38,7 @@ Then, configure your git user name and email using the following commands, repla
 git config --global user.name "Your Name"
 git config --global user.email "youremail@domain.com"
 ```
-:::note
+:::info Note
 
 If you don't have a Github account, create one now with the corresponding email address. We recommend that you setup a SSH key for your Github account. Follow the instructions [here](https://docs.github.com/fr/authentication/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent).
 

docs/docs/contributor/local-setup/yarn-setup.mdx

@@ -30,8 +30,12 @@ Before you can install and use Twenty, make sure you install the following on yo
 
 In your terminal, run the following command. 
 
+:::info Note
+
 We recommend using SSH for this step. If you already haven't set up SSH keys, please do so first. You can learn more about it [here](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/about-ssh). 
 
+:::
+
 <Tabs>
 <TabItem value="ssh" label="SSH (Recommended)" default>
 
@@ -51,7 +55,7 @@ git clone https://github.com/twentyhq/twenty.git
 
 ## Step 2: Set up PostgreSQL Database
 You need to have a PostgreSQL instance available to be able to use Twenty.
-This database needs to be provisionned with the a `twenty` user (password: `twenty`), a `default` database and a `test` database.
+This database needs to be provisioned with a `twenty` user (password: `twenty`), a `default` database and a `test` database.
 
 <Tabs>
 <TabItem value="linux" label="Linux" default>
@@ -71,7 +75,7 @@ cd twenty
 make provision-postgres
 ```
 This will create a Docker container, exposing a PostgresSQL instance at [http://localhost:5432](http://localhost:5432).
-You can access them using `twenty` postgres user (password: `twenty`)
+You can access this using `twenty` postgres user (password: `twenty`)
   </TabItem>
   <TabItem value="mac-os" label="Mac OS" default>
 
@@ -91,18 +95,18 @@ cd twenty
 make provision-postgres
 ```
 This will create a Docker container, exposing a PostgresSQL instance at [http://localhost:5432](http://localhost:5432).
-You can access them using `twenty` postgres user (password: `twenty`)
+You can access this using `twenty` postgres user (password: `twenty`)
 
   </TabItem>
   <TabItem value="wsl" label="Windows (WSL)">
 
-We recommend to provision your database locally:
+We recommend that you provision your database locally:
 ```bash
 cd twenty
 bash ./infra/dev/scripts/setup-postgres-linux.sh
 ```
 This will create a Docker container, exposing a PostgresSQL instance at [http://localhost:5432](http://localhost:5432).
-You can access them using `twenty` postgres user (password: `twenty`)
+You can access this using `twenty` postgres user (password: `twenty`)
   </TabItem>
 </Tabs>