feat: self-hosting sidebar restructuring (#2669)

## Description 

Provide a concise summary of the changes made in this pull request
#### **Restructuring of the Self-Hosting Sidebar**  
- **New Parent Category:**  
- `Self-Hosting` added as a standalone parent category (moved out of
`Getting Started`).
- **Subcategories under Self-Hosting:**  
  - **New Installation Guides**  
  - **Manage Installation**  
  - **Upgrade Installation Guides**  
  - **Concepts**  

#### **Documentation Overhaul**  
- Rewrote all documentation to align with:  
  - **Diataxis Framework** for clear organization and user focus.  
- **Google Developer Documentation Style Guide** for consistency and
readability.
  - Updated content for accuracy and usability.  

- Archived outdated migration guides by moving them to the community
portal and implemented redirects to ensure users can still access them
if needed.

- Updated all **cross-references** to reflect the new structure.  
- Modified the card design across docs

## User tests

1. https://app.usertesting.com/workspaces/2411288/study/5397388/sessions

## Pull request type

Check the appropriate box:

- [ ] Review Fixes
- [x] Documentation Overhaul
- [ ] Feature/Story
    - Link one or more Engineering Tickets
        * 
- [ ] A-Force
- [ ] Error in documentation
- [ ] Maintenance

## Documentation tickets

 Link to one or more documentation tickets:
 - #2509 (Project)

## Checklist

From the below options, select the ones that are applicable:

- [x] Checked for Grammarly suggestions.
- [x] Adhered to the writing checklist.
- [x] Adhered to the media checklist.
- [x] Verified and updated cross-references or added redirect rules.
- [x] Tested the redirect rules on deploy preview.
- [x] Validated the modifications made to the content on the deploy
preview.
- [x] Validated the CSS modifications on different screen sizes.

.github/styles/config/vocabularies/technical/accept.txt

@@ -153,6 +153,4 @@ AWS ECS EC2
 Droplet
 Enable webhook trigger
 Validation
-Issuer
-AI
-Iframe
+Issuer

.vale.ini

@@ -4,7 +4,7 @@ StylesPath = .github/styles
 # Minimum alert level
 # -------------------
 # The minimum alert level in the output (suggestion, warning, or error).
-MinAlertLevel = warning
+MinAlertLevel = error
 
 Vocab = technical
 

website/docs/advanced-concepts/embed-appsmith-into-existing-application.mdx

@@ -55,7 +55,7 @@ When embedding Appsmith in private mode, access to the Appsmith app is restricte
 ### Prerequisites
 
 * Ensure you have a self-hosted instance of Appsmith. See the [Appsmith installation guides](/getting-started/setup/installation-guides) for detailed instructions on setting up your Appsmith instance.
-* Ensure that Frame ancestors include the parent app domain if you have restricted access for embedding Appsmith. For more information, see [Frame ancestors](/getting-started/setup/instance-configuration/frame-ancestors).
+* Ensure that Frame ancestors include the parent app domain if you have restricted access for embedding Appsmith. For more information, see [Frame ancestors](/getting-started/setup/environment-variables#appsmith_allowed_frame_ancestors).
 * Ensure that you've hosted Appsmith app under the sub-domain of the same domain as the parent app. For example, `appsmith.company.com` and `internal.company.com` sharing the same domain (`company.com`).
 
 ### Embed Appsmith

website/docs/advanced-concepts/granular-access-control/README.md

@@ -4,6 +4,7 @@ description: >-
 title: Granular Access Control
 hide_title: true
 ---
+
 <!-- vale off -->
 
 <div className="tag-wrapper">
@@ -34,28 +35,33 @@ Granular Access Control (GAC) in Appsmith allows you to specify precise access p
 * **Users** - Individual users who need access to the Appsmith instance.
 * **User Groups** - Collections of users that allow you to assign roles to multiple users simultaneously. Users in a group inherit the roles assigned to that group.
 
-## Getting started
+## Get started
 
-To help you get started with Granular Access Control in Appsmith, here are some key areas you can explore. Click on the cards to learn more about each aspect.
+Below are key areas you can explore to get started with Granular Access Control in Appsmith. Click on the cards to learn more about each aspect.
 
+---
 <div className="containerGridSampleApp">
-   <div className="containerColumnSampleApp columnGrid column-one">
-       <div className="containerCol">
-            <a href="/advanced-concepts/granular-access-control/reference/permissions"><strong>Permissions</strong></a>
-       </div>
-       <hr/>
-       <div className="containerDescription">
-           Understand the permissions available as part of Granular Access Control.
-       </div>
-   </div>
-   <div className="containerColumnSampleApp columnGrid column-two">
-    <div className="containerCol">
-           <a href="/advanced-concepts/granular-access-control/reference/custom-roles"><strong>Custom Role</strong></a>
-       </div>
-       <hr/>
-       <div className="containerDescription">
-           Learn how to create Custom role to manage users and user groups in Appsmith.
-       </div>
-   </div>
-</div>
+   <a className="containerAnchor containerColumnSampleApp columnGrid column-one" href="/advanced-concepts/granular-access-control/reference/permissions">
+      <div className="containerHead">
+         <div className="containerHeading">
+            <b>Permissions</b>
+         </div>
+      </div>
+      <hr className="gradient-hr" />
+      <div className="containerDescription">
+         Understand the permissions available as part of Granular Access Control and how to apply them to users and user roles.
+      </div>
+   </a>
 
+   <a className="containerAnchor containerColumnSampleApp columnGrid column-two" href="/advanced-concepts/granular-access-control/reference/custom-roles">
+      <div className="containerHead">
+         <div className="containerHeading">
+            <b>Custom Role</b>
+         </div>
+      </div>
+      <hr className="gradient-hr" />
+      <div className="containerDescription">
+         Learn how to create custom roles to manage users and user groups within your Appsmith instance.
+      </div>
+   </a>
+</div>

website/docs/advanced-concepts/version-control-with-git/README.mdx

@@ -40,7 +40,7 @@ Version control in Appsmith is similar to the traditional Git workflow. For more
     <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
            <a href="/advanced-concepts/version-control-with-git/guides/overview"><strong>Guides</strong></a>
-        </div><hr/>
+        </div><hr className="gradient-hr" />
         <div className="containerDescription">Learn to set up Git, automate with CI/CD, and more.</div>
     </div>
     <div className="columnGrid column-two" style={{margin: "10px"}}>

website/docs/advanced-concepts/version-control-with-git/cd-with-git.md

@@ -36,7 +36,7 @@ The integration is service-agnostic and is **compatible with any CI/CD tool** ca
 <div className="containerColumnSampleApp columnGrid column-one">
        <div className="containerCol">
            <a href="/advanced-concepts/version-control-with-git/cd-with-github-actions"><strong>GitHub Actions</strong></a>
-       </div> <hr/>
+       </div> <hr className="gradient-hr" />
        <div className="containerDescription">GitHub Actions is an automation tool integrated with GitHub repositories, enabling you to automate workflows for building, testing, and deploying code directly from your repository.</div>
        <div className="containerTutorialLink"></div>
    </div>
@@ -50,7 +50,7 @@ The integration is service-agnostic and is **compatible with any CI/CD tool** ca
        </div> <br/>
         <div className="containerCol">
            <a href="/advanced-concepts/version-control-with-git/cd-with-github-actions"><strong>GitHub Actions</strong></a>
-       </div> <hr/>
+       </div> <hr className="gradient-hr" />
        <div className="containerDescription">GitHub Actions is an automation tool integrated with GitHub repositories, enabling you to automate workflows for building, testing, and deploying code directly from your repository.</div>
        <div className="containerTutorialLink"></div>
    </div>
@@ -60,7 +60,7 @@ The integration is service-agnostic and is **compatible with any CI/CD tool** ca
        </div> <br/>
        <div className="containerCol">
            <a href="/advanced-concepts/version-control-with-git/cd-with-bitbucket"><strong>Bitbucket Pipelines</strong></a>
-       </div> <hr/>
+       </div> <hr className="gradient-hr" />
        <div className="containerDescription">Bitbucket Pipelines is a CI/CD service built into Bitbucket Cloud that enables you to build, test, and deploy code directly from your Bitbucket repository</div>
        <div className="containerTutorialLink"></div>
    </div>
@@ -70,7 +70,7 @@ The integration is service-agnostic and is **compatible with any CI/CD tool** ca
        </div> <br/>
        <div className="containerCol">
            <a href="/advanced-concepts/version-control-with-git/cd-with-gitlab"><strong>GitLab CI/CD</strong></a>
-       </div> <hr/>
+       </div> <hr className="gradient-hr" />
        <div className="containerDescription">GitLab CI/CD is a built-in continuous integration and continuous deployment service offered by GitLab, allowing developers to automate the testing and delivery of their code.</div>
        <div className="containerTutorialLink">
        </div>   

website/docs/advanced-concepts/version-control-with-git/guides/overview.md

@@ -9,14 +9,14 @@ You can connect to Git using any provider of your choice with a Remote SSH URL.
 <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/guides/setup-github"><strong>Connect to GitHub</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to connect your Appsmith application to a remote GitHub repository.</div>
         <div className="containerTutorialLink"></div>
     </div>
 <div className="containerColumnSampleApp columnGrid column-two">
 <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/guides/setup-gitlab"><strong>Connect to GitLab</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to connect your Appsmith application to a remote GitLab repository.</div>
 </div>
 </div>
@@ -25,14 +25,14 @@ You can connect to Git using any provider of your choice with a Remote SSH URL.
 <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/guides/setup-bitbucket"><strong>Connect to Bitbucket</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to connect your Appsmith application to a remote Bitbucket repository.</div>
         <div className="containerTutorialLink"></div>
     </div>
 <div className="containerColumnSampleApp columnGrid column-two">
 <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/guides/setup-other-provider"><strong>Connect to Other Git Providers</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to connect your Appsmith application to a remote Azure repository.</div>
 </div>
 </div>
@@ -46,14 +46,14 @@ These guides help you manage Git integration, from resolving merge conflicts to
 <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/import-from-repository"><strong>Import apps from Git</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows you how to import an existing app connected to Git into a new workspace or a different Appsmith account.</div>
         <div className="containerTutorialLink"></div>
     </div>
 <div className="containerColumnSampleApp columnGrid column-two">
 <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/environments-with-git"><strong>Multi environments using Git</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows you how to set up multiple instances in Appsmith using Git, making application development easier.</div>
 </div>
 </div>
@@ -62,14 +62,14 @@ These guides help you manage Git integration, from resolving merge conflicts to
 <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/revert-changes"><strong>Revert Changes</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to revert a committed change to a specific branch or default branch in Git, allowing you to fix a mistake or undo an unwanted change.</div>
         <div className="containerTutorialLink"></div>
     </div>
 <div className="containerColumnSampleApp columnGrid column-two">
 <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/commit-and-push"><strong>Resolve Merge Conflicts in Git</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide offers strategies for resolving these conflicts to ensure smoother collaboration and project management in Git. </div>
 </div>
 </div>
@@ -84,14 +84,14 @@ Here are a few guides for popular options like GitHub Actions, Bitbucket Pipelin
 <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/cd-with-github-actions"><strong>CI/CD Using GitHub Actions</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to integrate Continuous Delivery with Git in Appsmith, enabling automatic updates to the master branch with GitHub Actions.</div>
         <div className="containerTutorialLink"></div>
     </div>
 <div className="containerColumnSampleApp columnGrid column-two">
 <div className="containerCol">
             <a href="/advanced-concepts/version-control-with-git/cd-with-gitlab"><strong>CI/CD Using GitLab</strong></a>
-        </div> <hr/>
+        </div> <hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to integrate Continuous Delivery with Git in Appsmith, enabling automatic updates to the master branch with GitLab CI/CD.</div>
 </div>
 </div>
@@ -100,7 +100,7 @@ Here are a few guides for popular options like GitHub Actions, Bitbucket Pipelin
     <div className="containerColumnSampleApp columnGrid column-one">
         <div className="containerCol">
            <a href="/advanced-concepts/version-control-with-git/cd-with-bitbucket"><strong>CI/CD Using Bitbucket Pipelines</strong></a>
-        </div><hr/>
+        </div><hr className="gradient-hr" />
         <div className="containerDescription">This guide shows how to integrate Continuous Delivery with Git in Appsmith, enabling automatic updates to any branch with Bitbucket Pipelines.</div>
     </div>
     <div className="columnGrid column-two" style={{margin: "10px"}}>