From abf62f28db683cb3410c599d4d97101620b8e89b Mon Sep 17 00:00:00 2001
From: Aayush Shah <58813006+akumaaayush@users.noreply.github.com>
Date: Wed, 26 Jul 2023 05:14:57 +0545
Subject: [PATCH] Themes tab: Add QuickCss button (#1475)

---
 src/components/VencordSettings/ThemesTab.tsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/VencordSettings/ThemesTab.tsx b/src/components/VencordSettings/ThemesTab.tsx
index 79ddc509..a6703947 100644
--- a/src/components/VencordSettings/ThemesTab.tsx
+++ b/src/components/VencordSettings/ThemesTab.tsx
@@ -21,7 +21,7 @@ import { Link } from "@components/Link";
 import { Margins } from "@utils/margins";
 import { useAwaiter } from "@utils/react";
 import { findLazy } from "@webpack";
-import { Card, Forms, React, TextArea } from "@webpack/common";
+import { Button, Card, Forms, React, TextArea } from "@webpack/common";
 
 import { SettingsTab, wrapTab } from "./shared";
 
@@ -112,7 +112,16 @@ function ThemesTab() {
                         <li>• Click the fork button on the top right</li>
                         <li>• Edit the file</li>
                         <li>• Use the link to your own repository instead</li>
+                        <li>• Use the link to your own repository instead </li>
+                        <li>OR</li>
+                        <li>• Paste the contents of the edited theme file into the QuickCSS editor</li>
                     </ul>
+                    <Forms.FormDivider className={Margins.top8 + " " + Margins.bottom16} />
+                    <Button
+                        onClick={() => VencordNative.quickCss.openEditor()}
+                        size={Button.Sizes.SMALL}>
+                        Open QuickCSS File
+                    </Button>
                 </Forms.FormText>
             </Card>
             <Forms.FormTitle tag="h5">Themes</Forms.FormTitle>