Add files page

components/files.mdx

@@ -0,0 +1,29 @@
+---
+title: "Files"
+description: "Serve static assets from your documentation"
+icon: "folder"
+---
+
+Mintlify automatically serves static assets from your documentation repository at the appropriate path on your domain. For example, if you have `/images/my-logo.png` in your repo, the image file is available at `https://docs.your-project.com/images/my-logo.png`.
+
+This works for any file type you want to make available to your users, including images, PDFs, videos, or schemas.
+
+Files must be less than 20 MB for images and 100 MB for other file types.
+
+## File organization
+
+Organize your files using folders to keep your repository easy to navigate:
+
+```text
+/your-project
+  |- docs.json
+  |- images/
+    |- logo.png
+    |- screenshots/
+      |- dashboard.png
+  |- assets/
+    |- whitepaper.pdf
+    |- demo-video.mp4
+```
+
+Files are served from the root of your domain, so the structure in your repository directly maps to the URL structure. From the previous example, `assets/whitepaper.pdf` would be available at `https://docs.your-project.com/assets/whitepaper.pdf`.

docs.json

@@ -66,6 +66,7 @@
             "pages": [
               "text",
               "image-embeds",
+              "components/files",
               "list-table",
               "code",
               "reusable-snippets",

image-embeds.mdx

@@ -6,8 +6,6 @@
 
 Add images, embed videos, and include interactive content with iframes to your documentation.
 
-All static assets in your docs repository are automatically served at the appropriate path on your domain. For example, if you have `/images/my-logo.png` in your repo, the image will be available at `https://docs.yoursite.com/images/my-logo.png`.
-
 <Frame>
 <img
   className="rounded-xl"
@@ -29,12 +27,12 @@
 ```
 
 <Tip>
   Always include descriptive alt text to improve accessibility and SEO. The alt text should clearly describe what the image shows.
 </Tip>
 
 Image files must be less than 20 MB. For larger files, host them on a CDN service like [Amazon S3](https://aws.amazon.com/s3) or [Cloudinary](https://cloudinary.com).
 
 ### HTML image embeds
 
 For more control over image display, use HTML `<img>` tags:
 
@@ -47,9 +45,9 @@
 />
 ```
 
 #### Disable zoom functionality
 
 To disable the default zoom on click for images, add the `noZoom` property:
 
 ```html highlight="4"
 <img 
@@ -76,7 +74,7 @@
 ```
 
 <Note>
   Images within anchor tags automatically display a pointer cursor to indicate they are clickable.
 </Note>
 
 #### Light and dark mode images
@@ -128,7 +126,7 @@
   src="https://www.youtube.com/embed/4KzFe50RQkQ"
   title="YouTube video player"
   frameBorder="0"
   allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
   allowFullScreen
 ></iframe>
 </Frame>
@@ -145,7 +143,7 @@
 ></video>
 ```
 
 ### Autoplay videos
 
 To autoplay a video, use:
 
@@ -164,7 +162,7 @@
   When using JSX syntax, write double-word attributes in camelCase: `autoPlay`, `playsInline`, `allowFullScreen`.
 </Note>
 
 ## iframes
 
 Embed external content using iframe elements: