Fix images for light and dark mode. Made improvements to docs (#22)

Author: karan925

docs/about/images/CodeRabbitFlow.png

@@ -24,70 +24,78 @@ image: "/preview_meta.jpg"
 
 This section covers the plans, pricing, and subscription management of CodeRabbit.
 
-### **Understanding Your Options**
+## **Understanding Your Options**
 
--   **Transparent Pricing**: CodeRabbit offers a per-seat pricing model that scales with your team size, ensuring you pay for what you need.
--   **7-Day Free Trial**: All plans start with a generous 7-day free trial for CodeRabbit Pro for the entire organization, ensuring a commitment-free experience
--   **No Credit Card Required**: You won't need a credit card to start your free trial.
--   **CodeRabbit Seats**
-    Every developer who submits a pull request is counted as a separate seat. Seats can be purchased for all or for a limited number of developers.
+- **Transparent Pricing**: CodeRabbit offers a per-seat pricing model that scales with your team size, ensuring you pay for what you need.
+- **7-Day Free Trial**: All plans start with a generous 7-day free trial for CodeRabbit Pro for the entire organization, ensuring a commitment-free experience
+- **No Credit Card Required**: You won't need a credit card to start your free trial.
+- **CodeRabbit Seats**
+  Every developer who submits a pull request is counted as a separate seat. Seats can be purchased for all or for a limited number of developers.
 
-### 1. Pro Plan
+---
+
+## **Pro Plan**
 
-### Features:
+### Features
 
--   This plan begins with a 7-day free trial, with no credit card required.
--   Summarization of pull requests.
--   Includes line-by-line reviews of all changes in the Pull Request
--   Ability to have conversations with CodeRabbit bot.
--   Reviews on unlimited public and private repositories within the organization.
+- This plan begins with a 7-day free trial, with no credit card required.
+- Summarization of pull requests.
+- Includes line-by-line reviews of all changes in the Pull Request
+- Ability to have conversations with CodeRabbit bot.
+- Reviews on unlimited public and private repositories within the organization.
 
-### Pricing:
+### Pricing
 
--   Monthly: $15 per month.
--   Annual: $12 per month billed annually, with a 20% discount.
+- Monthly: $15 per month.
+- Annual: $12 per month billed annually, with a 20% discount.
 
-### Billing:
+### Billing
 
--   Billed per participating developer.
+- Billed per participating developer.
 
-### Usage Limits:
+### Usage Limits
 
 These are the hourly usage limits for each developer per repository:
 
--   Number of files reviewed per hour: 100 Files
--   Number of reviews per hour (includes incremental reviews): 9
--   Number of conversations per hour: 50
+- Number of files reviewed per hour: 100 Files
+- Number of reviews per hour (includes incremental reviews): 9
+- Number of conversations per hour: 50
+
+---
+
+## **Free Plan**
 
-### 2. Free Plan
+### Features
 
-### Features:
+- Starts with a 7-day free trial of the Pro plan.
+- unlimited access on both public and private repositories.
+- Summarization pull requests on private repositories.
+- Reviews pull requests on public repositories.
 
--   Starts with a 7-day free trial of the Pro plan.
--   unlimited access on both public and private repositories.
--   Summarization pull requests on private repositories.
--   Reviews pull requests on public repositories.
+### Pricing
 
-### Pricing:
+- $0 per month.
 
--   $0 per month.
+### Billing
 
-### Billing:
+- Free forever, no credit card required.
 
--   Free forever, no credit card required.
+---
 
-### **Subscription Management**
+## **Subscription Management**
 
-### 1. Pro Plan
+### Pro Plan
 
--   GitHub/GitLab organization owners can purchase or make changes to the subscription.
--   You can choose to manually purchase seats and assign them to developers, or have them assigned automatically as developers create pull requests.
--   During the trial period, seat assignment is automatic, but the number of seats can be adjusted when purchasing the subscription.
+- GitHub/GitLab organization owners can purchase or make changes to the subscription.
+- You can choose to manually purchase seats and assign them to developers, or have them assigned automatically as developers create pull requests.
+- During the trial period, seat assignment is automatic, but the number of seats can be adjusted when purchasing the subscription.
 
-![Untitled](./images/pricing.png)
+![Untitled](./images/cr_seat_manage_dark.png#gh-dark-mode-only)
+![Untitled](./images/cr_seat_manage_light.png#gh-light-mode-only)
 
-### 2. Free Plan
+### Free Plan
 
--   Seats are assigned to new developers immediately
+- Seats are assigned to new developers immediately
 
-![Untitled](./images/pricing2.png)
+![Untitled](./images/cr_seat_free_dark.png#gh-dark-mode-only)
+![Untitled](./images/cr_seat_free_light.png#gh-light-mode-only)

docs/about/images/cr_seat_free_dark.png

@@ -10,11 +10,13 @@ image: "/preview_meta.jpg"
   <meta name="title" content="CodeRabbit: AI-powered Code Reviews" />
   <meta name="description" content="Accelerate Code Reviews with AI" />
 
-  <meta property="og:type" content="website" />
-  <meta property="og:url" content="https://coderabbit.ai/" />
-  <meta property="og:title" content="CodeRabbit: AI-powered Code Reviews" />
-  <meta property="og:description" content="Accelerate Code Reviews with AI" />
-  <meta property="og:image" content="/preview_meta.jpg" />
+{" "}
+
+<meta property="og:type" content="website" />
+<meta property="og:url" content="https://coderabbit.ai/" />
+<meta property="og:title" content="CodeRabbit: AI-powered Code Reviews" />
+<meta property="og:description" content="Accelerate Code Reviews with AI" />
+<meta property="og:image" content="/preview_meta.jpg" />
 
   <meta name="twitter:image" content="https://coderabbit.ai/preview_meta.jpg" />
   <meta name="twitter:card" content="summary_large_image" />
@@ -28,49 +30,51 @@ Welcome to CodeRabbit's Support! Please refer this section if you encounter any
 
 These are the most common questions our support team receives, and you might find an answer here
 
-### 1. Can I switch between different organizations on CodeRabbit?
+### Can I switch between different organizations on CodeRabbit?
 
 Yes, you can switch between different organizations on CodeRabbit. To do so, click on the organization name in the top right corner of the CodeRabbit UI.
 
-![Switch Organizations](./images/help3.png)
+<div align="center">![Switch Organizations](./images/cr_support_orgs_light.png#gh-light-mode-only)</div>
+<div align="center">![Switch Organizations](./images/cr_support_orgs_dark.png#gh-dark-mode-only)</div>
 
-### 2. Can CodeRabbit subscription be used across multiple organizations?
+### Can CodeRabbit subscription be used across multiple organizations?
 
 Subscription seat are tied to the specific GitHub/GitLab organization under which they are purchased and cannot be used under another organization.
 
-### 3. Can CodeRabbit review my existing PRs after integrating it?
+### Can CodeRabbit review my existing PRs after integrating it?
 
 CodeRabbit would by default only review new PRs or existing PRs which have a new commits after the app is installed.
 You can however use @coderabbitai review command on the PR to trigger a review of existing PRs.
 
-### 4. Who can add the repositories on CodeRabbit?
+### Who can add the repositories on CodeRabbit?
 
 You need to be GitHub/GitLab admin to add the repositories.
 
-### 5. Do I need own OpenAI key with CodeRabbit Pro?
+### Do I need own OpenAI key with CodeRabbit Pro?
 
 OpenAI cost is part of the subscription.There is no additional cost for OpenAI.
 
-### 6. What is the difference between CodeRabbit OSS ai-pr-reviewer and CodeRabbit Pro ?
+### What is the difference between CodeRabbit OSS ai-pr-reviewer and CodeRabbit Pro ?
 
 ai-pr-reviewer is our Open Source Software (OSS) for pull request reviews. With CodeRabbit OSS, you need your own OpenAI key, and you will incur OpenAI costs.
 On the other hand, with a CodeRabbit Pro subscription, the OpenAI cost is included. Additionally, CodeRabbit Pro offers advanced prompts and superior noise reduction features, which are not present in CodeRabbit OSS.
 
-### 7. Can I use both CodeRabbit OSS and CodeRabbit Pro together ?
+### Can I use both CodeRabbit OSS and CodeRabbit Pro together ?
 
 You can, but this will result in duplicate reviews. We suggest you use only one of the two.
 
-### Explore More
-
-To see more common issues faced by CodeRabbit users, visit our FAQ section for detailed answers and solutions to frequently encountered problems.
-
 ### **Opening a Support Ticket**
 
 To get assistance from our support team, open a ticket using the help icon on the CodeRabbit UI:
 
 Complete the support ticket by providing your name, email, a description of your issue, and attaching any necessary files. If you are reporting a bug , please provide the GitHub or GitLab organization name.
 
-![Open a Ticket](./images/help2.png)
+![Open a Ticket](./images/cr_support_help_light.png#gh-light-mode-only)
+![Open a Ticket](./images/cr_support_help_dark.png#gh-dark-mode-only)
+
+:::tip
+To see more common issues faced by CodeRabbit users, visit our FAQ section for detailed answers and solutions to frequently encountered problems.
+:::
 
 ### **Community Collaboration**
 

docs/about/images/cr_seat_free_light.png

@@ -74,13 +74,14 @@ Yes, you can change it under the repository settings.
 
 There are hourly rate limits for each developer per repository:
 
--   Number of files reviewed per hour: 200
--   Number of reviews : 3 back to back reviews followed by 4 reviews/hour
--   Number of conversations: 25 back to back messages followed by 50 messages/hr
-
+- Number of files reviewed per hour: 200
+- Number of reviews : 3 back to back reviews followed by 4 reviews/hour
+- Number of conversations: 25 back to back messages followed by 50 messages/hr
 
 In-trial and open-source plans have lower rate limits than the paid plan. In all cases, we re-allow further reviews/conversations after a brief timeout.
 
-Please note that we're continually innovating and enhancing our application with new capabilities. Stay tuned and follow us for updates as new exciting features are built. We're committed to making your experience with CodeRabbit even better.
+:::note
+We are continually innovating and enhancing our application with new capabilities. Stay tuned and follow us for updates as new exciting features are built. We're committed to making your experience with CodeRabbit even better.
+:::
 
 If you have further questions or need additional information, don't hesitate to reach out to us at [[email protected]](mailto:[email protected]).

docs/about/images/cr_seat_manage_dark.png

@@ -28,14 +28,20 @@ To add additional repositories after the sign-up, go to the repositories page wi
 
 Click on the "**Add repositories**" button. Upon clicking, you'll be redirected to GitHub.
 
-![Untitled](./images/add1.png)
+![AddRepo](./images/cr_add_repo_light.png#gh-light-mode-only)
+![AddRepo](./images/cr_add_repo_dark.png#gh-dark-mode-only)
 
 Upon successful installation, you will be automatically redirected back to the CodeRabbit UI. Here, you can view the list of repositories that CodeRabbit now has access to.
 
-![Untitled](./images/add4.png)
+:::note
 
-Note for GitLab the flow is slightly different. All the repositories display by default and you can toggle and enable the ones where the CodeRabbit app should be installed.
+For **GitLab** the flow is slightly different. All the repositories display by default and you can toggle and enable the ones where the CodeRabbit app should be installed.
+
+![AddRepo](./images/cr_add_repo_gitlab_light.png#gh-light-mode-only)
+![AddRepo](./images/cr_add_repo_gitlab_dark.png#gh-dark-mode-only)
+
+:::
 
 ### **Need help?**
 
-If you require assistance, our support team is here to help. Simply click on the help icon within the CodeRabbit user interface. For more detailed information, please refer to the "Support" section. Additionally, consider joining the CodeRabbit Discord community to connect with other users and access a wealth of knowledge about using CodeRabbit effectively.
+If you require assistance, our support team is here to help. Simply click on the help icon within the CodeRabbit user interface. For more detailed information, please refer to the "Support" section. Additionally, consider joining the CodeRabbit **Discord** community to connect with other users and access a wealth of knowledge about using CodeRabbit effectively.

docs/about/images/cr_seat_manage_light.png

@@ -5,6 +5,7 @@ slug: /dashboard
 description: Accelerate Code Reviews with AI
 image: "/preview_meta.jpg"
 ---
+
 <head>
  <meta charSet="utf-8" />
   <meta name="title" content="CodeRabbit: AI-powered Code Reviews" />
@@ -22,19 +23,21 @@ image: "/preview_meta.jpg"
   <meta name="twitter:description" content="Accelerate Code Reviews with AI" />
 </head>
 
-CodeRabbit Dashboard displays organization's pull request activity and value provided by CodeRabbit reviews. This includes the number of pull requests reviewed, actionable items,optional comments and more. 
+CodeRabbit Dashboard displays organization's pull request activity and value provided by CodeRabbit reviews. This includes the number of pull requests reviewed, actionable items, optional comments and more.
 
 Dashboard displays the following information:
 
 - **Pull Requests Overview:** View the number of pull requests reviewed by CodeRabbit per week, month, and year.
 - **CodeRabbit's Activity:** Understand the metrics related to the number of reviews conducted by CodeRabbit, actionable items, and optional suggestions.
 
-![Untitled](./images/analytic2.png)
+![Untitled](./images/cr_dash_dark.png#gh-dark-mode-only)
+![Untitled](./images/cr_dash_light.png#gh-light-mode-only)
 
-Access the list of recent pull request reviewed.
+Access the list of recent pull requests reviewed.
 
-![Untitled](./images/analytic3.png)
+![Untitled](./images/cr_history_dark.png#gh-dark-mode-only)
+![Untitled](./images/cr_history_light.png#gh-light-mode-only)
 
 ### **Need help?**
 
-If you require assistance, our support team is here to help. Simply click on the help icon within the CodeRabbit user interface. For more detailed information, please refer to the "Support" section. Additionally, consider joining the CodeRabbit Discord community to connect with other users and access a wealth of knowledge about using CodeRabbit effectively.
+If you require assistance, our support team is here to help. Simply click on the help icon within the CodeRabbit user interface. For more detailed information, please refer to the "Support" section. Additionally, consider joining the CodeRabbit Discord community to connect with other users and access a wealth of knowledge about using CodeRabbit effectively.

docs/about/images/cr_support_help_dark.png

@@ -28,9 +28,10 @@ Signing up for CodeRabbit is quick and easy, allowing you to get started in just
 
 ### **Step 1: Getting Started**
 
-**Login with GitHub or GitLab**: Log in with your GitHub or GitLab account at https://coderabbit.ai/login
+**Login with GitHub or GitLab**: Log in with your GitHub or GitLab account at [https://coderabbit.ai/login](https://coderabbit.ai/login)
 
-![Untitled](./images/signup.png)
+![Login](./images/cr_login2.png#gh-light-mode-only)
+![Login](./images/cr_login_dark.png#gh-dark-mode-only)
 
 ### **Step 2: Select Organization**
 
@@ -44,9 +45,11 @@ After selecting the organization, you will be directed to a GitHub repositories
 
 ![Untitled](./images/add3.png)
 
-After you have installed the CodeRabbit app, the reviews will start automatically with the new pull requests or incremental commits to existing pull requests. To trigger reviews on existing pull requests, post @coderabbitai review as a comment on the pull request.
+After you have installed the CodeRabbit app, the reviews will start automatically with the new pull requests or incremental commits to existing pull requests. To trigger reviews on existing pull requests, post "@coderabbitai review" as a comment on the pull request.
 
-Note that the automatic code review behavior can be changed to "On-Demand". To make this change, go to the repository settings in the UI or modify the appropriate setting in the YAML file to disable reviews.
+:::tip
+The automatic code review behavior can be changed to "On-Demand". To make this change, go to the repository settings in the UI or modify the appropriate setting in the YAML file to disable reviews.
+:::
 
 ### **Need help?**
 

docs/about/images/cr_support_help_light.png

@@ -4,6 +4,7 @@ description: Efficiently manage your PR reviews with our intuitive commands. Use
 sidebar_label: CodeRabbit Commands
 image: "/preview_meta.jpg"
 ---
+
 <head>
  <meta charSet="utf-8" />
   <meta name="title" content="CodeRabbit Commands" />
@@ -25,26 +26,28 @@ Manage your PR reviews with the following commands:
 
 By default, CodeRabbit automatically reviews all pull requests. Additionally, for each pull request, it will review all incremental commits. However, this behavior can be overridden using the following commands:
 
-- **Pause Reviews**: 
+- **Pause Reviews**:
   - Use `@coderabbitai pause` in a PR comment to halt ongoing reviews.
-  
-- **Resume Reviews**: 
+- **Resume Reviews**:
   - Enter `@coderabbitai resume` in a PR comment to continue paused reviews.
-  
-- **On-Demand Reviews**: 
+- **On-Demand Reviews**:
   - Disable automatic reviews for your repository to switch to on-demand reviews.
-  - Use `@coderabbitai review` in a PR comment. This command will override all review filters that might be set up in the repository settings and will initiate a one-time review.  
-  
-- **Skip Specific PR**: 
+  - Use `@coderabbitai review` in a PR comment. This command will override all review filters that might be set up in the repository settings and will initiate a one-time review.
+- **Skip Specific PR**:
+
   - To exclude a specific PR from review, include `@coderabbitai ignore` in the PR description.
 
 - **Resolve Command**:
+
   - Use `@coderabbitai resolve` to mark all the CodeRabbit review comments as resolved all at once.
 
 - **Help Command**:
   - You can at any time post `@coderabbitai help` in a PR comment to get the list of all valid commands.
 
-**Note:** Ensure you input these commands as PR comments. For direct bot interactions, use review comments on code diffs or files.
+:::note
+Ensure you input these commands as PR comments. For direct bot interactions, enter your input in the review comments of a code diff or file.
+:::
 
 ### Feedback
+
 If you have suggestions for additional commands or improvements, we would love to hear from you! Please submit your feedback to our support team.