From 4a01ca01abf63bdb3751569acce9cbb5cf405b40 Mon Sep 17 00:00:00 2001
From: Amy Chan <amy@datacoves.com>
Date: Thu, 18 Sep 2025 17:29:02 -0700
Subject: [PATCH] update README to use npm and reduced images

---
 README.md                                     |  10 +-
 .../metrics-and-logs/README.md                |   2 +-
 .../assets/dashboards-list.png                | Bin
 .../assets/dashboards-nav.png                 | Bin
 .../assets/grafana-alerting-menu.jpg          | Bin
 .../metrics-and-logs/assets/grafana-eye.jpg   | Bin
 .../assets/grafana-view-in-explorer.jpg       | Bin
 .../metrics-and-logs/assets/grafana-view.jpg  | Bin
 .../assets/metrics-and-logs-nav.png           | Bin
 .../metrics-and-logs/grafana.md               |   0
 .../metrics-and-logs/view-failed-git-sync.md  |   0
 .../datacoves-copilot/v1-llm-backup.txt       |  87 ----
 .../v1-llm-config-backup.txt                  |  29 --
 .../v2-llm-config-backup.txt                  | 253 ----------
 docs/how-tos/vs-code/initial.mdx              | 295 +++++++-----
 docusaurus.config.js                          |   6 +-
 static/llms.txt                               | 453 ++++++++++--------
 17 files changed, 434 insertions(+), 701 deletions(-)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/README.md (93%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/dashboards-list.png (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/dashboards-nav.png (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/grafana-alerting-menu.jpg (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/grafana-eye.jpg (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/grafana-view-in-explorer.jpg (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/grafana-view.jpg (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/assets/metrics-and-logs-nav.png (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/grafana.md (100%)
 rename docs/how-tos/{ => datacoves}/metrics-and-logs/view-failed-git-sync.md (100%)
 delete mode 100644 docs/how-tos/vs-code/datacoves-copilot/v1-llm-backup.txt
 delete mode 100644 docs/how-tos/vs-code/datacoves-copilot/v1-llm-config-backup.txt
 delete mode 100644 docs/how-tos/vs-code/datacoves-copilot/v2-llm-config-backup.txt

diff --git a/README.md b/README.md
index d63b44fb..e6e6b9b3 100644
--- a/README.md
+++ b/README.md
@@ -5,13 +5,13 @@ This website is built using [Docusaurus](https://docusaurus.io/), a modern stati
 ## Installation
 
 ```bash
-yarn
+npm install
 ```
 
 ## Local Development
 
 ```bash
-yarn start
+npm run start
 ```
 
 This command starts a local development server and opens up a browser window. Most changes are reflected live without having to restart the server.
@@ -19,7 +19,7 @@ This command starts a local development server and opens up a browser window. Mo
 ## Build
 
 ```bash
-yarn build
+npm run build
 ```
 
 This command generates static content into the `build` directory and can be served using any static contents hosting service.
@@ -29,13 +29,13 @@ This command generates static content into the `build` directory and can be serv
 Using SSH:
 
 ```bash
-USE_SSH=true yarn deploy
+USE_SSH=true npm run deploy
 ```
 
 Not using SSH:
 
 ```bash
-GIT_USER=<Your GitHub username> yarn deploy
+GIT_USER=<Your GitHub username> npm run deploy
 ```
 
 
diff --git a/docs/how-tos/metrics-and-logs/README.md b/docs/how-tos/datacoves/metrics-and-logs/README.md
similarity index 93%
rename from docs/how-tos/metrics-and-logs/README.md
rename to docs/how-tos/datacoves/metrics-and-logs/README.md
index ed889a58..8aafb3d9 100644
--- a/docs/how-tos/metrics-and-logs/README.md
+++ b/docs/how-tos/datacoves/metrics-and-logs/README.md
@@ -1,6 +1,6 @@
 ---
 title: Metrics & Logs
-sidebar_position: 7
+sidebar_position: 70
 ---
 # Metrics and Logs How Tos
 
diff --git a/docs/how-tos/metrics-and-logs/assets/dashboards-list.png b/docs/how-tos/datacoves/metrics-and-logs/assets/dashboards-list.png
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/dashboards-list.png
rename to docs/how-tos/datacoves/metrics-and-logs/assets/dashboards-list.png
diff --git a/docs/how-tos/metrics-and-logs/assets/dashboards-nav.png b/docs/how-tos/datacoves/metrics-and-logs/assets/dashboards-nav.png
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/dashboards-nav.png
rename to docs/how-tos/datacoves/metrics-and-logs/assets/dashboards-nav.png
diff --git a/docs/how-tos/metrics-and-logs/assets/grafana-alerting-menu.jpg b/docs/how-tos/datacoves/metrics-and-logs/assets/grafana-alerting-menu.jpg
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/grafana-alerting-menu.jpg
rename to docs/how-tos/datacoves/metrics-and-logs/assets/grafana-alerting-menu.jpg
diff --git a/docs/how-tos/metrics-and-logs/assets/grafana-eye.jpg b/docs/how-tos/datacoves/metrics-and-logs/assets/grafana-eye.jpg
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/grafana-eye.jpg
rename to docs/how-tos/datacoves/metrics-and-logs/assets/grafana-eye.jpg
diff --git a/docs/how-tos/metrics-and-logs/assets/grafana-view-in-explorer.jpg b/docs/how-tos/datacoves/metrics-and-logs/assets/grafana-view-in-explorer.jpg
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/grafana-view-in-explorer.jpg
rename to docs/how-tos/datacoves/metrics-and-logs/assets/grafana-view-in-explorer.jpg
diff --git a/docs/how-tos/metrics-and-logs/assets/grafana-view.jpg b/docs/how-tos/datacoves/metrics-and-logs/assets/grafana-view.jpg
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/grafana-view.jpg
rename to docs/how-tos/datacoves/metrics-and-logs/assets/grafana-view.jpg
diff --git a/docs/how-tos/metrics-and-logs/assets/metrics-and-logs-nav.png b/docs/how-tos/datacoves/metrics-and-logs/assets/metrics-and-logs-nav.png
similarity index 100%
rename from docs/how-tos/metrics-and-logs/assets/metrics-and-logs-nav.png
rename to docs/how-tos/datacoves/metrics-and-logs/assets/metrics-and-logs-nav.png
diff --git a/docs/how-tos/metrics-and-logs/grafana.md b/docs/how-tos/datacoves/metrics-and-logs/grafana.md
similarity index 100%
rename from docs/how-tos/metrics-and-logs/grafana.md
rename to docs/how-tos/datacoves/metrics-and-logs/grafana.md
diff --git a/docs/how-tos/metrics-and-logs/view-failed-git-sync.md b/docs/how-tos/datacoves/metrics-and-logs/view-failed-git-sync.md
similarity index 100%
rename from docs/how-tos/metrics-and-logs/view-failed-git-sync.md
rename to docs/how-tos/datacoves/metrics-and-logs/view-failed-git-sync.md
diff --git a/docs/how-tos/vs-code/datacoves-copilot/v1-llm-backup.txt b/docs/how-tos/vs-code/datacoves-copilot/v1-llm-backup.txt
deleted file mode 100644
index 3b5c9ef4..00000000
--- a/docs/how-tos/vs-code/datacoves-copilot/v1-llm-backup.txt
+++ /dev/null
@@ -1,87 +0,0 @@
----
-title: Usage
-sidebar_position: 5
----
-
-# Working with an LLM in Datacoves Copilot v1
-
-Once you have [configured your LLM](/how-tos/vscode/datacoves-copilot/v1-llm-config.md), working with the AI chat is a breeze!
-
-## Pre-configured presets
-
-While there are many use cases for AI in the development workflow there are a couple of tasks that come up regularly. To improve the user experience, we have created some presets that provide the LLM with specific instructions to get the best result. Use these or configure your own custom presets.
-
-Current out of the box presents include:
-
-- **Document dbt model:** Will provide descriptions for yml file you have open and provided as context.
-- **Explain dbt model:** Will explain a dbt model file you have open and provided as context.
-- **Explain dbt macro:** Will explain a dbt macro file you have open and provided as context.
-- **Add descriptions to CSV:** Will provide descriptions for CSV files you have open and provided as context.
-
-## How to use the Chat/Presets
-
-### Extension UI/UX
-
-To use your LLM head to the Datacoves Power User extension and open up `Copilot`.
-
-<div style={{ width: "250px" }}>
-  ![LLM Menu](./assets/llm_menu.png)
-</div>
-
-### Provide files for context
-
-The most important thing to remember is providing context to the LLM. In order to do this simply open up the file you wish to work with.
-
-![llm file open](assets/llm_file_open.png)
-
-### Send specific lines of code for context
-
-Highlight the lines of code you wish to send.
-
-![context lines](assets/llm_line_context.png)
-
-### Don't provide context
-
-In the case that you don't want to send an open file for context you can select the icon below.
-
-![llm context](assets/llm_context.gif)
-
-## Using LLM code
-
-Datacoves Copilot makes copying AI generated code simple with 3 options.
-
-![Code Options](assets/llm_code_options.png)
-
-### Replace
-
-Replace the entire code file with the LLM code.
-
-![llm Replace](assets/llm_replace.gif)
-
-### Insert
-
-Insert LLM code into your file.
-
-![llm Insert](assets/llm_insert.gif)
-
-### Copy
-
-Traditional copy and paste.
-
-![llm Copy](assets/llm_copy.gif)
-
-### New Chat
-
-To start a new chat click on the `New Chat` button.
-
-![New Chat](assets/llm_new_chat.png)
-
-## Prefer a Video?
-<div style={{ position: "relative", paddingBottom: "56.25%", height: 0 }}>
-  <iframe
-    src="https://www.loom.com/embed/b6e987152c114c3c8d44dc7712aa3e22?sid=d8847855-38cc-4a84-90b3-6be7e660f8b5"
-    frameBorder="0"
-    allowFullScreen
-    style={{ position: "absolute", top: 0, left: 0, width: "100%", height: "100%" }}
-  />
-</div>
diff --git a/docs/how-tos/vs-code/datacoves-copilot/v1-llm-config-backup.txt b/docs/how-tos/vs-code/datacoves-copilot/v1-llm-config-backup.txt
deleted file mode 100644
index ca0e453e..00000000
--- a/docs/how-tos/vs-code/datacoves-copilot/v1-llm-config-backup.txt
+++ /dev/null
@@ -1,29 +0,0 @@
----
-title: Config
-sidebar_position: 3
----
-
-# Configure your LLM for Datacoves Copilot v1
-
-:::note Datacoves Copilot v1 only support the 4o model gpt model.
-
-:::
-### Step 1: Create a Datacoves Secret
-
-Creating a [Datacoves Secret](/docs/how-tos/datacoves/how_to_secrets.md) requires some key fields to be filled out:
-
-- **Name:** The secret must be named `datacoves-copilot-llm-api`
-- **Description:** Provide a simple description such as: `Open AI config`
-- **Format:** Select `Raw JSON`
-- **Value**: The value will vary based on the LLM you are utilizing.
-  - **Open AI:** You only need your API key. Head to [Open AI](https://platform.openai.com/api-keys) to create your key. `{"OPENAI_API_KEY": "Your key here"}`
-  - **Azure Open AI:** This requires two credentials. Head to [ai.azure.com](https://ai.azure.com) to find your credentials under the [Deployments](https://learn.microsoft.com/en-us/azure/ai-services/openai/how-to/working-with-models?tabs=powershell#model-deployment-upgrade-configuration) tab. `{"AZURE_OPENAI_ENDPOINT": "Your endpoint here", "AZURE_OPENAI_API_KEY"  : "Your key here"}`
-- **Scope:** Select the desired scope, either `Project` or `Environment`.
-- **Project/Environment:** Select the `Project` or `Environment` that will access this LLM.
-
-Lastly, be sure to toggle on the `Share with developers` option so that users with developer access will be able to use the LLM.
-![Share with Devs](assets/llm_share_with_devs.png)
-
-### Example Secret
-
-![Example ](assets/llm_example.png)
diff --git a/docs/how-tos/vs-code/datacoves-copilot/v2-llm-config-backup.txt b/docs/how-tos/vs-code/datacoves-copilot/v2-llm-config-backup.txt
deleted file mode 100644
index 1fe2bbc6..00000000
--- a/docs/how-tos/vs-code/datacoves-copilot/v2-llm-config-backup.txt
+++ /dev/null
@@ -1,253 +0,0 @@
----
-title: Config
-sidebar_position: 9
----
-
-# Configure your LLM in Datacoves Copilot v2
-
-## Create a Datacoves Secret
-
-Creating a [Datacoves Secret](/how-tos/datacoves/how_to_secrets.md) requires some key fields to be filled out:
-
-- **Name:** The secret must be named `datacoves-copilot-api-configs`
-- **Description:** Provide a simple description such as: `Datacoves Copilot config`
-- **Format:** Select `Raw JSON`
-- **Value**: The value will vary depending on the LLM you are utilizing, see `Value formats by LLM Provider` section.
-- **Scope:** Select the desired scope, either `Project` or `Environment`.
-- **Project/Environment:** Select the `Project` or `Environment` that will access this LLM.
-
-Lastly, be sure to toggle on the `Share with developers` option so that users with developer access will be able to use the LLM.
-![Share with Devs](assets/llm_share_with_devs.png)
-
-### Value formats by LLM Provider
-
-#### Amazon Bedrock
-
-```json
-{
-  "default": {
-    "apiModelId": "<MODEL ID>",
-    "awsAccessKey": "<YOUR ACCESS KEY>",
-    "awsSecretKey": "<YOUR ACCESS SECRET KEY>",
-    "awsSessionToken": "<YOUR SESSION TOKEN>",
-    "awsRegion": "<REGION ID>",
-    "awsCustomArn": "",
-    "apiProvider": "bedrock",
-    "id": "default"
-  }
-}
-```
-
-#### Anthropic
-
-```json
-{
-  "default": {
-    "todoListEnabled": true,
-    "consecutiveMistakeLimit": 3,
-    "apiKey": "<YOUR API KEY>",
-    "apiProvider": "anthropic",
-    "id": "default"
-  }
-}
-```
-
-#### Cerebras
-
-```json
-{
-  "default": {
-    "apiModelId": "<MODEL ID>",
-    "cerebrasApiKey": "<YOUR API KEY>",
-    "apiProvider": "cerebras",
-    "id": "default"
-  }
-}
-```
-
-#### Chutes AI
-
-```json
-{
-  "default": {
-    "apiModelId": "<MODEL ID>",
-    "chutesApiKey": "<YOUR API KEY>",
-    "apiProvider": "chutes",
-    "id": "default"
-  }
-}
-```
-
-#### DeepSeek
-
-```json
-{
-  "default": {
-    "apiModelId": "<MODEL ID>",
-    "deepSeekApiKey": "<YOUR API KEY>",
-    "apiProvider": "deepseek",
-    "id": "default"
-  }
-}
-```
-
-#### Glama
-
-```json
-{
-  "default": {
-    "glamaModelId": "<MODEL ID>",
-    "glamaApiKey": "<YOUR API KEY>",
-    "apiProvider": "glama",
-    "id": "default"
-  }
-}
-```
-
-#### Google Gemini
-
-```json
-{
-  "default": {
-    "apiModelId": "<MODEL ID>",
-    "geminiApiKey": "<YOUR API KEY>",
-    "apiProvider": "gemini",
-    "id": "default"
-  }
-}
-```
-
-#### Hugging Face
-
-```json
-{
-  "default": {
-    "huggingFaceApiKey": "<YOUR API KEY>",
-    "huggingFaceModelId": "<MODEL ID>",
-    "huggingFaceInferenceProvider": "auto",
-    "apiProvider": "huggingface",
-    "id": "default"
-  }
-}
-```
-
-#### Mistral
-
-```json
-{
-  "default": {
-    "apiModelId": "<MODEL ID>",
-    "mistralApiKey": "<YOUR API KEY>",
-    "apiProvider": "mistral",
-    "id": "default"
-  }
-}
-```
-
-#### Ollama
-
-```json
-{
-  "default": {
-    "ollamaModelId": "<MODEL ID>",
-    "ollamaBaseUrl": "<BASE URL>",
-    "ollamaApiKey": "<YOUR API KEY>",
-    "apiProvider": "ollama",
-    "id": "default"
-  }
-}
-```
-
-#### OpenAI
-
-```json
-{
-  "default": {
-    "reasoningEffort": "medium",
-    "apiModelId": "<MODEL ID>",
-    "openAiNativeApiKey": "<YOUR API KEY>",
-    "apiProvider": "openai-native",
-    "id": "default"
-  }
-}
-```
-
-#### OpenAI Compatible
-
-```json
-{
-  "default": {
-    "reasoningEffort": "medium",
-    "openAiBaseUrl": "<BASE URL>",
-    "openAiApiKey": "<YOUR API KEY>",
-    "openAiModelId": "<MODEL ID>",
-    "openAiUseAzure": false,
-    "azureApiVersion": "",
-    "openAiHeaders": {},
-    "apiProvider": "openai",
-    "id": "default"
-  }
-}
-```
-
-Set `"openAiUseAzure": true` when using Azure, and optionally a specific version `"azureApiVersion": "<VERSION>"`.
-
-Fine tune model usage using this additional key:
-
-```json
-"openAiCustomModelInfo": {
-    "maxTokens": -1,
-    "contextWindow": 128000,
-    "supportsImages": true,
-    "supportsPromptCache": false,
-    "inputPrice": 0,
-    "outputPrice": 0,
-    "reasoningEffort": "medium"
-}
-```
-
-#### Open Router
-
-```json
-{
-  "default": {
-    "reasoningEffort": "medium",
-    "openRouterApiKey": "<YOUR API KEY>",
-    "openRouterModelId": "<MODEL ID>",
-    "apiProvider": "openrouter",
-    "id": "default"
-  }
-}
-```
-
-#### Requesty
-
-```json
-{
-  "default": {
-    "reasoningEffort": "medium",
-    "requestyApiKey": "<YOUR API KEY>",
-    "requestyModelId": "<MODEL ID>",
-    "apiProvider": "requesty",
-    "id": "default"
-  }
-}
-```
-
-#### xAI Grok
-
-```json
-{
-  "default": {
-    "reasoningEffort": "medium",
-    "apiModelId": "<MODEL ID>",
-    "xaiApiKey": "<YOUR API KEY>",
-    "apiProvider": "xai",
-    "id": "default"
-  }
-}
-```
-
-### Example Secret
-
-![Example ](assets/v2_llm_example.png)
diff --git a/docs/how-tos/vs-code/initial.mdx b/docs/how-tos/vs-code/initial.mdx
index 91a48e04..74c80350 100644
--- a/docs/how-tos/vs-code/initial.mdx
+++ b/docs/how-tos/vs-code/initial.mdx
@@ -6,212 +6,265 @@ sidebar_position: 88
 
 # How to Configure your VS Code in the Datacoves Transform tab
 
+
 When you first log into Datacoves, you will see that VS Code is disabled.
 
+
 We need to connect to your git repository and to your data warehouse and configure your dbt profiles.yml. To do this, you need to update your user settings.
 
+
 ## Open Your User Settings
 
+
 At the top right corner of the page, click the User icon and select _Settings_
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![User Settings](./assets/menu_user_settings.gif)
+</div>
+
 
 ## Setup git connection credentials
 
+
 On the settings page scroll down to the Git SSH keys section.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings](./assets/user_settings_git.png)
+</div>
+
 
 Click the Add drop down and select whether you want to provide an existing private key or have Datacoves auto generate one for you.
 
+
+<div style={{ maxWidth: "300px", margin: "0 auto" }}>
 ![Git Settings Add](./assets/user_settings_git2.png)
+</div>
+
 
 Datacoves will generate and display the corresponding public key, you will need to configure the public key for your git provider.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings Public Key](./assets/user_settings_git3.png)
+</div>
+
 
 Click the _Copy_ button and follow the instructions to configure the public key for your git server.
 
+
 [Github SSH Key Configuration Instructions](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/adding-a-new-ssh-key-to-your-github-account)
 
+
 [Gitlab SSH Key Configuration Instructions](https://www.theserverside.com/blog/Coffee-Talk-Java-News-Stories-and-Opinions/How-to-configure-GitLab-SSH-keys-for-secure-Git-connections#:~:text=Configure%20GitLab%20SSH%20keys,-Log%20into%20GitLab%20and%20click)
 
+
 [Bitbucket SSH Key Configuration Instructions](https://dev.to/jorge_rockr/configuring-ssh-key-for-bitbucket-repositories-2925)
 
+
 Once your public SSH key has been added to your git server, test your connection.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings Test](./assets/user_settings_git4.png)
+</div>
+
 
 If Datacoves is able to connect to your Git repository, you will see _Tested_ next to the repository url.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings Tested](./assets/user_settings_git5.png)
+</div>
 
 # Set up Database Connection 
 
 :::note
-Below you will see a reference chart with the information you will need based on your data warehouse provider. **Select your data warehouse provider from the table below to see the how to guide.** 
+Below you will see a reference chart with the information you will need based on your data warehouse provider. **Select your data warehouse provider from the table below to see the how to guide.**
 :::
 
 <details>
   <summary><strong>BigQuery Setup Instructions</strong></summary>
 
- # BigQuery Setup
- 
- In the Database Connection Section, click `Add`
- 
- ![BigQuery Setup Connection](./assets/connection_bigquery_dropdown.png)
- 
- Give the connection a name. 
- 
- :::tip
- This will be used as your dbt target name and is typically `dev`. 
- :::
- 
- Next select a connection template. A connection template will have defaults pre-configured by your administrator.
- 
- ## Fill in connection details 
- 
- Datacoves will test the connection and display `Tested` next to the connection if successful. 
- 
- ![BigQuery Fields](./assets/connection_bigquery_fields.png)
- 
- Click `Save`
+# BigQuery Setup
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
+  ![BigQuery Setup Connection](./assets/connection_bigquery_dropdown.png)
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
+  ![BigQuery Fields](./assets/connection_bigquery_fields.png)
+</div>
+
+Click `Save`
 
 </details>
 
 <details>
   <summary><strong>Databricks Setup Instructions</strong></summary>
 
-  # Databricks Setup
-  
-  In the Database Connection Section, click `Add`
-  
+# Databricks Setup
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Databricks Setup Connection](./assets/connection_databricks_dropdown.png)
-  
-  Give the connection a name. 
-  
-  :::tip
-  This will be used as your dbt target name and is typically `dev`. 
-  :::
-  
-  Next select a connection template. A connection template will have defaults pre-configured by your administrator.
-  
-  ## Fill in connection details 
-  
-  Datacoves will test the connection and display `Tested` next to the connection if successful. 
-  
-  
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Databricks Fields](./assets/connection_databricks_fields.png)
-  
-  Click `Save`
-  
+</div>
+
+Click `Save`
 
 </details>
 
 <details>
   <summary><strong>Redshift Setup Instructions</strong></summary>
 
-  # Redshift Setup
-  
-  In the Database Connection Section, click `Add`
-  
+# Redshift Setup
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Redshift Setup Connection](./assets/connection_redshift_dropdown.png)
-  
-  Give the connection a name. 
-  
-  :::tip
-  This will be used as your dbt target name and is typically `dev`. 
-  :::
-  
-  Next select a connection template. A connection template will have defaults pre-configured by your administrator.
-  
-  ## Fill in connection details 
-  
-  Datacoves will test the connection and display `Tested` next to the connection if successful. 
-  
-  
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Redshift Fields](./assets/connection_redshift_fields.png)
-  
-  Click `Save`
+</div>
+
+Click `Save`
 
 </details>
 
 <details>
   <summary><strong>Snowflake Setup Instructions</strong></summary>
 
-  # Snowflake Setup
-  
-  ## Setup Snowflake with Key Pair
-  
-  When connecting to Snowflake, you can use either key based authentication or username/password authentication.
-  
-  :::note
-  To enable key-pair authentication, you admin must select `Inferred from user info using a custom template` when setting up the [Connection Template](/how-tos/datacoves/how_to_connection_template.md). The Snowflake username must match the username associated with the email used to authenticate with Datacoves for example `some_user` would be the snowflake username for `some_user@example.com`, please let us know if your username is different.
-  :::
-  
-  If using key based authentication, you will need to provide or generate a key which will need to be added to Snowflake manually or contact us for information on how to automate this integration with Snowflake.
-  
-  Provide or automatically generate your keys. Then add the public key to Snowflake.
-  
+# Snowflake Setup
+
+## Setup Snowflake with Key Pair
+
+When connecting to Snowflake, you can use either key based authentication or username/password authentication.
+
+:::note
+To enable key-pair authentication, your admin must select `Inferred from user info using a custom template` when setting up the [Connection Template](/how-tos/datacoves/how_to_connection_template.md). The Snowflake username must match the username associated with the email used to authenticate with Datacoves, e.g., `some_user` would be the Snowflake username for `some_user@example.com`.
+:::
+
+If using key based authentication, you will need to provide or generate a key which will need to be added to Snowflake manually or contact us for information on how to automate this integration with Snowflake.
+
+Provide or automatically generate your keys. Then add the public key to Snowflake.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Snowflake Settings Generate Keys](./assets/user_settings_snowflake.png)
-  
-  ## Assign the public key to the Snowflake User
-  
-  ```
-  alter user <username> set rsa_public_key='<public key>';
-  ```
-  
-  More information can be found in the [Snowflake Documentation](https://docs.snowflake.com/en/user-guide/key-pair-auth.html#step-4-assign-the-public-key-to-a-snowflake-user)
-  
-  ## Complete the connection
-  
-  In the Database Connection Section, click `Add`
-  
+</div>
+
+## Assign the public key to the Snowflake User
+
+```
+alter user <username> set rsa_public_key='<public key>';
+```
+
+More information can be found in the [Snowflake Documentation](https://docs.snowflake.com/en/user-guide/key-pair-auth.html#step-4-assign-the-public-key-to-a-snowflake-user)
+
+## Complete the connection
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "200px", margin: "0 auto" }}>
   ![Snowflake Setup Connection](./assets/user_settings_snowflake2.png)
-  
-  Give the connection a name. 
-  
-  :::tip
-  This will be used as your dbt target name and is typically `dev`. 
-  :::
-  
-  Next select a connection template. A connection template will have defaults pre-configured by your administrator.
-  
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Snowflake Setup Connection Details](./assets/user_settings_snowflake3.png)
-  
-  ## Fill in connection details
-  
-  Datacoves will test the connection and display `Tested` next to the connection if successful. 
-  
-  :::note
-  You can create additional dbt targets as shown below. This will allow you to execute dbt commands passing a specific target such as `dbt run my_model -t prd`
-  :::
-  
+</div>
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+:::note
+You can create additional dbt targets as shown below. This will allow you to execute dbt commands passing a specific target such as `dbt run my_model -t prd`
+:::
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Snowflake Setup Connection Tested](./assets/user_settings_snowflake4.png)
-  
-  ### Key Pair 
-  
-  If using key pair, you will need to change the auth method to key-pair.
-  
+</div>
+
+### Key Pair
+
+If using key pair, you will need to change the auth method to key-pair.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Select Auth](./assets/connection_select_auth.png)
-  
-  Select the drop down and your key you configured earlier should populate.
-  
+</div>
+
+Select the drop down and your key you configured earlier should populate.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Select Key](./assets/connection_select_key.png)
-  
-  Click `Save`
-  
+</div>
+
+Click `Save`
 
 </details>
 
 ## Once your data warehouse is configured you are now ready to transform your data with dbt
 
 - Scroll to the top of the screen, click `Launchpad` or the Datacoves logo.
-
 - Click `Open` to go into your development environment.
 
 :::note
 Datacoves will take a couple of minutes to apply the new settings, clone your repo, and finish setting up your environment for the first time.
 :::
 
-![Workbench Link](./assets/navigation_launchpad.gif)
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
+  ![Workbench Link](./assets/navigation_launchpad.gif)
+</div>
diff --git a/docusaurus.config.js b/docusaurus.config.js
index d4228ade..231ce765 100644
--- a/docusaurus.config.js
+++ b/docusaurus.config.js
@@ -170,11 +170,7 @@ const config = {
           to: '/docs/how-tos/git',
      
         },
-         {
-          label: 'Metrics & Logs',
-          to: '/docs/how-tos/metrics-and-logs',
-     
-        },
+         
          {
           label: 'My Airflow',
           to: '/docs/how-tos/my_airflow',
diff --git a/static/llms.txt b/static/llms.txt
index ed08a4c2..0df29e9e 100644
--- a/static/llms.txt
+++ b/static/llms.txt
@@ -4841,6 +4841,85 @@ To enable Datacoves cloning from Azure DevOps, you must complete a series of ste
 
 ---
 
+// File: how-tos/datacoves/metrics-and-logs/README
+
+# Metrics and Logs How Tos
+
+Datacoves provides [Grafana](./grafana.md) to monitor Airflow, Docker image builds, and more! 
+
+A user must have a Datacoves role with Grafana access. These include, `Datacoves Admin`, `Project Admin`, or `Environment Admin`. 
+
+![Grafana Icon](assets/grafana-eye.jpg)
+
+---
+
+// File: how-tos/datacoves/metrics-and-logs/view-failed-git-sync
+
+# Monitor git sync or s3 sync failure
+
+This how-to will walk you through the steps to view git sync/s3 failures in Grafana.
+
+### Step 1
+
+A user with Grafana access can navigate to the Grafana UI by clicking on the Eye icon in the top right corner of the Datacoves UI.
+
+![Grafana icon](assets/grafana-eye.jpg)
+
+### Step 2
+
+Navigate to `Alerting` and select `Alerting rules`.
+
+<img src="/how-tos/metrics-and-logs/assets/grafana-alerting-menu.jpg" alt="Grafana Alerting Menu" width="300" height="600" />
+
+
+### Step 3
+
+Expand the folder under `Mimir/Cortex/Loki` and select the `view` icon on the `AirflowWorkerFailedToInit` rule.
+
+![Grafana view](assets/grafana-view.jpg)
+
+### Step 4
+
+Select `View in Explorer` to see the Graph and other information. 
+
+![View in Explorer](assets/grafana-view-in-explorer.jpg)
+
+---
+
+// File: how-tos/datacoves/metrics-and-logs/grafana
+
+# Grafana Dashboards
+
+## Navigation menu
+
+Accessing the dashboards list is easy:
+
+:::tip
+We recommend you bookmark your favorite dashboards so they are pinned in the home page.
+:::
+
+![Dashboards Nav menu](./assets/dashboards-nav.png)
+
+## Prebuilt dashboards
+
+Grafana comes with a set of prebuilt dashboards that you can use right away.
+
+![Dashboards List](./assets/dashboards-list.png)
+
+:::warning
+The following dashboards are not working quite right yet, so please don't use them:  
+. etcd  
+. Kubernetes / Compute Resources / Namespace (Workloads)  
+. Kubernetes / Compute Resources / Node (Pods)  
+. Kubernetes / Compute Resources / Workload  
+. Kubernetes / Controller Manager  
+. Kubernetes / Proxy  
+. Kubernetes / Scheduler  
+. Node Exporter / (all)
+:::
+
+---
+
 // File: how-tos/datahub/how_to_datahub_dbt
 
 # Ingesting dbt Metadata into DataHub
@@ -5870,85 +5949,6 @@ These how to guides cover some Git best practices as well as some setup guides.
 
 ---
 
-// File: how-tos/metrics-and-logs/README
-
-# Metrics and Logs How Tos
-
-Datacoves provides [Grafana](./grafana.md) to monitor Airflow, Docker image builds, and more! 
-
-A user must have a Datacoves role with Grafana access. These include, `Datacoves Admin`, `Project Admin`, or `Environment Admin`. 
-
-![Grafana Icon](assets/grafana-eye.jpg)
-
----
-
-// File: how-tos/metrics-and-logs/view-failed-git-sync
-
-# Monitor git sync or s3 sync failure
-
-This how-to will walk you through the steps to view git sync/s3 failures in Grafana.
-
-### Step 1
-
-A user with Grafana access can navigate to the Grafana UI by clicking on the Eye icon in the top right corner of the Datacoves UI.
-
-![Grafana icon](assets/grafana-eye.jpg)
-
-### Step 2
-
-Navigate to `Alerting` and select `Alerting rules`.
-
-<img src="/how-tos/metrics-and-logs/assets/grafana-alerting-menu.jpg" alt="Grafana Alerting Menu" width="300" height="600" />
-
-
-### Step 3
-
-Expand the folder under `Mimir/Cortex/Loki` and select the `view` icon on the `AirflowWorkerFailedToInit` rule.
-
-![Grafana view](assets/grafana-view.jpg)
-
-### Step 4
-
-Select `View in Explorer` to see the Graph and other information. 
-
-![View in Explorer](assets/grafana-view-in-explorer.jpg)
-
----
-
-// File: how-tos/metrics-and-logs/grafana
-
-# Grafana Dashboards
-
-## Navigation menu
-
-Accessing the dashboards list is easy:
-
-:::tip
-We recommend you bookmark your favorite dashboards so they are pinned in the home page.
-:::
-
-![Dashboards Nav menu](./assets/dashboards-nav.png)
-
-## Prebuilt dashboards
-
-Grafana comes with a set of prebuilt dashboards that you can use right away.
-
-![Dashboards List](./assets/dashboards-list.png)
-
-:::warning
-The following dashboards are not working quite right yet, so please don't use them:  
-. etcd  
-. Kubernetes / Compute Resources / Namespace (Workloads)  
-. Kubernetes / Compute Resources / Node (Pods)  
-. Kubernetes / Compute Resources / Workload  
-. Kubernetes / Controller Manager  
-. Kubernetes / Proxy  
-. Kubernetes / Scheduler  
-. Node Exporter / (all)
-:::
-
----
-
 // File: how-tos/my_airflow/README
 
 # My Airflow 101
@@ -6387,215 +6387,268 @@ Finally, select the Database, Schema, and Table / View for this dataset then cli
 
 # How to Configure your VS Code in the Datacoves Transform tab
 
+
 When you first log into Datacoves, you will see that VS Code is disabled.
 
+
 We need to connect to your git repository and to your data warehouse and configure your dbt profiles.yml. To do this, you need to update your user settings.
 
+
 ## Open Your User Settings
 
+
 At the top right corner of the page, click the User icon and select _Settings_
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![User Settings](./assets/menu_user_settings.gif)
+</div>
+
 
 ## Setup git connection credentials
 
+
 On the settings page scroll down to the Git SSH keys section.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings](./assets/user_settings_git.png)
+</div>
+
 
 Click the Add drop down and select whether you want to provide an existing private key or have Datacoves auto generate one for you.
 
+
+<div style={{ maxWidth: "300px", margin: "0 auto" }}>
 ![Git Settings Add](./assets/user_settings_git2.png)
+</div>
+
 
 Datacoves will generate and display the corresponding public key, you will need to configure the public key for your git provider.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings Public Key](./assets/user_settings_git3.png)
+</div>
+
 
 Click the _Copy_ button and follow the instructions to configure the public key for your git server.
 
+
 [Github SSH Key Configuration Instructions](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/adding-a-new-ssh-key-to-your-github-account)
 
+
 [Gitlab SSH Key Configuration Instructions](https://www.theserverside.com/blog/Coffee-Talk-Java-News-Stories-and-Opinions/How-to-configure-GitLab-SSH-keys-for-secure-Git-connections#:~:text=Configure%20GitLab%20SSH%20keys,-Log%20into%20GitLab%20and%20click)
 
+
 [Bitbucket SSH Key Configuration Instructions](https://dev.to/jorge_rockr/configuring-ssh-key-for-bitbucket-repositories-2925)
 
+
 Once your public SSH key has been added to your git server, test your connection.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings Test](./assets/user_settings_git4.png)
+</div>
+
 
 If Datacoves is able to connect to your Git repository, you will see _Tested_ next to the repository url.
 
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
 ![Git Settings Tested](./assets/user_settings_git5.png)
+</div>
 
 # Set up Database Connection 
 
 :::note
-Below you will see a reference chart with the information you will need based on your data warehouse provider. **Select your data warehouse provider from the table below to see the how to guide.** 
+Below you will see a reference chart with the information you will need based on your data warehouse provider. **Select your data warehouse provider from the table below to see the how to guide.**
 :::
 
 <details>
   <summary><strong>BigQuery Setup Instructions</strong></summary>
 
- # BigQuery Setup
- 
- In the Database Connection Section, click `Add`
- 
- ![BigQuery Setup Connection](./assets/connection_bigquery_dropdown.png)
- 
- Give the connection a name. 
- 
- :::tip
- This will be used as your dbt target name and is typically `dev`. 
- :::
- 
- Next select a connection template. A connection template will have defaults pre-configured by your administrator.
- 
- ## Fill in connection details 
- 
- Datacoves will test the connection and display `Tested` next to the connection if successful. 
- 
- ![BigQuery Fields](./assets/connection_bigquery_fields.png)
- 
- Click `Save`
+# BigQuery Setup
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
+  ![BigQuery Setup Connection](./assets/connection_bigquery_dropdown.png)
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
+  ![BigQuery Fields](./assets/connection_bigquery_fields.png)
+</div>
+
+Click `Save`
 
 </details>
 
 <details>
   <summary><strong>Databricks Setup Instructions</strong></summary>
 
-  # Databricks Setup
-  
-  In the Database Connection Section, click `Add`
-  
+# Databricks Setup
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Databricks Setup Connection](./assets/connection_databricks_dropdown.png)
-  
-  Give the connection a name. 
-  
-  :::tip
-  This will be used as your dbt target name and is typically `dev`. 
-  :::
-  
-  Next select a connection template. A connection template will have defaults pre-configured by your administrator.
-  
-  ## Fill in connection details 
-  
-  Datacoves will test the connection and display `Tested` next to the connection if successful. 
-  
-  
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Databricks Fields](./assets/connection_databricks_fields.png)
-  
-  Click `Save`
-  
+</div>
+
+Click `Save`
 
 </details>
 
 <details>
   <summary><strong>Redshift Setup Instructions</strong></summary>
 
-  # Redshift Setup
-  
-  In the Database Connection Section, click `Add`
-  
+# Redshift Setup
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Redshift Setup Connection](./assets/connection_redshift_dropdown.png)
-  
-  Give the connection a name. 
-  
-  :::tip
-  This will be used as your dbt target name and is typically `dev`. 
-  :::
-  
-  Next select a connection template. A connection template will have defaults pre-configured by your administrator.
-  
-  ## Fill in connection details 
-  
-  Datacoves will test the connection and display `Tested` next to the connection if successful. 
-  
-  
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Redshift Fields](./assets/connection_redshift_fields.png)
-  
-  Click `Save`
+</div>
+
+Click `Save`
 
 </details>
 
 <details>
   <summary><strong>Snowflake Setup Instructions</strong></summary>
 
-  # Snowflake Setup
-  
-  ## Setup Snowflake with Key Pair
-  
-  When connecting to Snowflake, you can use either key based authentication or username/password authentication.
-  
-  :::note
-  To enable key-pair authentication, you admin must select `Inferred from user info using a custom template` when setting up the [Connection Template](/how-tos/datacoves/how_to_connection_template.md). The Snowflake username must match the username associated with the email used to authenticate with Datacoves for example `some_user` would be the snowflake username for `some_user@example.com`, please let us know if your username is different.
-  :::
-  
-  If using key based authentication, you will need to provide or generate a key which will need to be added to Snowflake manually or contact us for information on how to automate this integration with Snowflake.
-  
-  Provide or automatically generate your keys. Then add the public key to Snowflake.
-  
+# Snowflake Setup
+
+## Setup Snowflake with Key Pair
+
+When connecting to Snowflake, you can use either key based authentication or username/password authentication.
+
+:::note
+To enable key-pair authentication, your admin must select `Inferred from user info using a custom template` when setting up the [Connection Template](/how-tos/datacoves/how_to_connection_template.md). The Snowflake username must match the username associated with the email used to authenticate with Datacoves, e.g., `some_user` would be the Snowflake username for `some_user@example.com`.
+:::
+
+If using key based authentication, you will need to provide or generate a key which will need to be added to Snowflake manually or contact us for information on how to automate this integration with Snowflake.
+
+Provide or automatically generate your keys. Then add the public key to Snowflake.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Snowflake Settings Generate Keys](./assets/user_settings_snowflake.png)
-  
-  ## Assign the public key to the Snowflake User
-  
-  ```
-  alter user <username> set rsa_public_key='<public key>';
-  ```
-  
-  More information can be found in the [Snowflake Documentation](https://docs.snowflake.com/en/user-guide/key-pair-auth.html#step-4-assign-the-public-key-to-a-snowflake-user)
-  
-  ## Complete the connection
-  
-  In the Database Connection Section, click `Add`
-  
+</div>
+
+## Assign the public key to the Snowflake User
+
+```
+alter user <username> set rsa_public_key='<public key>';
+```
+
+More information can be found in the [Snowflake Documentation](https://docs.snowflake.com/en/user-guide/key-pair-auth.html#step-4-assign-the-public-key-to-a-snowflake-user)
+
+## Complete the connection
+
+In the Database Connection Section, click `Add`
+
+<div style={{ maxWidth: "200px", margin: "0 auto" }}>
   ![Snowflake Setup Connection](./assets/user_settings_snowflake2.png)
-  
-  Give the connection a name. 
-  
-  :::tip
-  This will be used as your dbt target name and is typically `dev`. 
-  :::
-  
-  Next select a connection template. A connection template will have defaults pre-configured by your administrator.
-  
+</div>
+
+Give the connection a name.
+
+:::tip
+This will be used as your dbt target name and is typically `dev`.
+:::
+
+Next select a connection template. A connection template will have defaults pre-configured by your administrator.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Snowflake Setup Connection Details](./assets/user_settings_snowflake3.png)
-  
-  ## Fill in connection details
-  
-  Datacoves will test the connection and display `Tested` next to the connection if successful. 
-  
-  :::note
-  You can create additional dbt targets as shown below. This will allow you to execute dbt commands passing a specific target such as `dbt run my_model -t prd`
-  :::
-  
+</div>
+
+## Fill in connection details
+
+Datacoves will test the connection and display `Tested` next to the connection if successful.
+
+:::note
+You can create additional dbt targets as shown below. This will allow you to execute dbt commands passing a specific target such as `dbt run my_model -t prd`
+:::
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Snowflake Setup Connection Tested](./assets/user_settings_snowflake4.png)
-  
-  ### Key Pair 
-  
-  If using key pair, you will need to change the auth method to key-pair.
-  
+</div>
+
+### Key Pair
+
+If using key pair, you will need to change the auth method to key-pair.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Select Auth](./assets/connection_select_auth.png)
-  
-  Select the drop down and your key you configured earlier should populate.
-  
+</div>
+
+Select the drop down and your key you configured earlier should populate.
+
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
   ![Select Key](./assets/connection_select_key.png)
-  
-  Click `Save`
-  
+</div>
+
+Click `Save`
 
 </details>
 
 ## Once your data warehouse is configured you are now ready to transform your data with dbt
 
 - Scroll to the top of the screen, click `Launchpad` or the Datacoves logo.
-
 - Click `Open` to go into your development environment.
 
 :::note
 Datacoves will take a couple of minutes to apply the new settings, clone your repo, and finish setting up your environment for the first time.
 :::
 
-![Workbench Link](./assets/navigation_launchpad.gif)
+<div style={{ maxWidth: "700px", margin: "0 auto" }}>
+  ![Workbench Link](./assets/navigation_launchpad.gif)
+</div>
 
 ---