From b1dcd51c00528eaf3432ffc2afba7a39e9baa9ba Mon Sep 17 00:00:00 2001
From: Jafeth Garro <45522320+IAmJafeth@users.noreply.github.com>
Date: Fri, 23 Aug 2024 09:26:30 -0600
Subject: [PATCH] chore: Added 'Live Editing Zen Theme' guide

---
 content/.obsidian/workspace.json        |  33 ++++++++++++++-----
 content/assets/live-editing/inspect.png | Bin 0 -> 519 bytes
 content/guides/live-editing.md          |  41 ++++++++++++++++++++++++
 3 files changed, 66 insertions(+), 8 deletions(-)
 create mode 100644 content/assets/live-editing/inspect.png
 create mode 100644 content/guides/live-editing.md

diff --git a/content/.obsidian/workspace.json b/content/.obsidian/workspace.json
index 6418fc1..d66bad0 100644
--- a/content/.obsidian/workspace.json
+++ b/content/.obsidian/workspace.json
@@ -13,13 +13,26 @@
             "state": {
               "type": "markdown",
               "state": {
-                "file": "faq.md",
+                "file": "guides/index.md",
+                "mode": "preview",
+                "source": true
+              }
+            }
+          },
+          {
+            "id": "42952bec6b18e374",
+            "type": "leaf",
+            "state": {
+              "type": "markdown",
+              "state": {
+                "file": "guides/live-editing.md",
                 "mode": "preview",
                 "source": true
               }
             }
           }
-        ]
+        ],
+        "currentTab": 1
       }
     ],
     "direction": "vertical"
@@ -85,7 +98,7 @@
             "state": {
               "type": "backlink",
               "state": {
-                "file": "faq.md",
+                "file": "guides/live-editing.md",
                 "collapseAll": false,
                 "extraContext": false,
                 "sortOrder": "alphabetical",
@@ -102,7 +115,7 @@
             "state": {
               "type": "outgoing-link",
               "state": {
-                "file": "faq.md",
+                "file": "guides/live-editing.md",
                 "linksCollapsed": false,
                 "unlinkedCollapsed": true
               }
@@ -125,7 +138,7 @@
             "state": {
               "type": "outline",
               "state": {
-                "file": "faq.md"
+                "file": "guides/live-editing.md"
               }
             }
           }
@@ -146,15 +159,19 @@
       "command-palette:Open command palette": false
     }
   },
-  "active": "c48eb70606bbaae4",
+  "active": "fe7bf5045f52d84c",
   "lastOpenFiles": [
+    "assets/live-editing",
+    "assets/live-editing/inspect.png",
+    "assets/image (3).png",
+    "guides/index.md",
+    "guides/live-editing.md",
+    "faq.md",
     "guides/manage-profiles.md",
     "guides/install-macos.md",
-    "faq.md",
     "assets/macos-installation-guide/gatekeeper.png",
     "assets/macos-installation-guide/open-dmg.png",
     "index.md",
-    "guides/index.md",
     "assets/macos-installation-guide/broken-menu.png",
     "assets/macos-installation-guide/Screenshot from 2024-08-20 22-41-07.png",
     "assets/macos-installation-guide/broken menu.png",
diff --git a/content/assets/live-editing/inspect.png b/content/assets/live-editing/inspect.png
new file mode 100644
index 0000000000000000000000000000000000000000..b0c687feb1426e97425aaa75d36f3ad2c7098394
GIT binary patch
literal 519
zcmV+i0{H!jP)<h;3K|Lk000e1NJLTq0015U000;W1^@s6?P*QF00009a7bBm000ie
z000ie0hKEb8vp<SpGibPR7i>Kl)X*@K@>(0E(xLHw^3+Fpo9opi0uMWt_fSN3Fs0Y
zKns0@wN`AjqS8<;ghrs1S0EBfD#A8sq74=%CMvKfL1W^VOfmPn_nyhj&Dfrvo+tc*
z)_w!}5B^cvtr8}a36)BPTFqcI8ZFe+>-8ebyQr!<Gsk8%)fX3Ks@3X3z>iYZJqm@w
z_rQvh!!%7UFRuuNLJI+Vy?aWf5`Mp*>+74TIhJp1nkK-)P=Iha0>E%MoSE}Cr@CIR
zF&>YndV(Mz2*S)-%c-8HMx#NwTqc{%lFKOsgTXiN`1oXX;6y^C+wEc)28LmfOm3qn
z3h{UxNs{K)E_KzSD8AcwI(Hl$9a1c6G@G}p14pA#91h2)_-o9zI<VbtCl-sni%C+7
zv$J#3>GX17pU($Czu%wgZ*Il`a5|l=uW!(9w`jFmmWQ?kXEHkg6pI?El=Qah^%?-8
zm;hjZ{{UUr@pwF(p6Uz+gXO@QrjgGVaJ$`8{ct$K)>aZ(mI(v`=(>)}<>K-2VQyc`
zzj{^rn_uQX_$zt=$@_OvgwKzt0000EWmrjOO-%qQ00008000000002eQ<DGy002ov
JPDHLkV1n8?-yQ$}

literal 0
HcmV?d00001

diff --git a/content/guides/live-editing.md b/content/guides/live-editing.md
new file mode 100644
index 0000000..d54fb58
--- /dev/null
+++ b/content/guides/live-editing.md
@@ -0,0 +1,41 @@
+---
+title: Live Editing Zen Theme
+---
+
+This guide will help you customize the appearance of Zen Browser by live editing the `userChrome.css` file. Follow the steps below to start customizing your browser's theme.
+
+## Step 1: Access the Profile Folder
+
+1. Open Zen Browser.
+2. Type `about:profiles` in the address bar and press Enter.
+3. Look for the **Profile you want to save your theme** .
+4. Click on **Open Profile Folder**. This will open the folder where Zen Browser stores your user data.
+
+## Step 2: Create the `chrome` Folder
+
+1. In the Profile Folder, create a new folder and name it `chrome`.
+2. Inside the `chrome` folder, create a new blank file named `userChrome.css`.
+
+## Step 3: Open Style Editor in Zen Browser
+
+1. In Zen Browser, press `Ctrl + Shift + Alt + I` to open the Developer Tools.
+2. Navigate to the **Style Editor** tab.
+3. In the filter/search bar, type `userChrome` to locate the `userChrome.css` file you created earlier.
+
+## Step 4: Edit the `userChrome.css` File
+
+1. The `userChrome.css` file should now be visible in the Style Editor.
+2. You can start editing the file directly within the Style Editor.
+	 - **Note:** You can use the **Inspect** button  ![[inspect.png]] to hover over and select elements on the page. This allows you to learn about the `id`, `class`, or other attributes of elements, which you can then target in your `userChrome.css` file.
+1. To apply your changes, save the file by clicking **Save** or by pressing `Ctrl + S`.
+
+> [!tip]
+>  If a style does not apply as expected, try adding the `!important` keyword at the end of the CSS rule. This forces the browser to apply the style regardless of any other existing styles.
+
+> [!Notes] 
+>Any changes you make to the `userChrome.css` file will be applied immediately to Zen Browser.
+>Use this file to customize various UI elements, such as colors, fonts, and layout.
+
+---
+
+This guide is designed to help you quickly and efficiently customize your Zen Browser experience. Happy theming!