From 5d67a426f377f5e04bf0928f0d07415370406d44 Mon Sep 17 00:00:00 2001
From: Tobias Baunbaek <freeall@gmail.com>
Date: Fri, 8 Dec 2023 15:38:42 +0100
Subject: [PATCH] Add config part

---
 guide/making-a-pear-app.md       | 22 +++++++++++++++++++++-
 guide/starting-a-pear-project.md | 24 +++++++++++++++++++++++-
 2 files changed, 44 insertions(+), 2 deletions(-)

diff --git a/guide/making-a-pear-app.md b/guide/making-a-pear-app.md
index d4afb1a..c2b463e 100644
--- a/guide/making-a-pear-app.md
+++ b/guide/making-a-pear-app.md
@@ -90,7 +90,27 @@ function onMessageAdded(from, message) {
 }
 ```
 
-## Step 3. Run the app
+## Step 3. Update gui settings
+
+To make sure that the app looks the way intended, update the `pear` property in `package.json`. See all the possibly options in the [reference doc](../reference/configuration.md).
+
+Open `package.json` and update the `"pear"` property:
+
+```
+{
+  ...
+  "pear": {
+    "gui": {
+      "backgroundColor": "#1F2430",
+      "height": 540,
+      "width": 720
+    }
+  }
+  ...
+}
+```
+
+## Step 4. Run the app
 
 Now it's time to write the app.
 
diff --git a/guide/starting-a-pear-project.md b/guide/starting-a-pear-project.md
index b478249..591ae4f 100644
--- a/guide/starting-a-pear-project.md
+++ b/guide/starting-a-pear-project.md
@@ -41,7 +41,29 @@ While keeping the app open with `pear dev`, open `index.html` in a code editor.
 
 ![Automatic reload](../assets/chat-app-2.png)
 
-## Step 4. Create a basic UI
+## Step 4. Chagne gui settings
+
+It's possible to change various settings with Pear. This is done with the `pear` property in `package.json`. See all the possibly options in the [reference doc](../reference/configuration.md).
+
+For now, open `package.json` and update it :
+```
+{
+  ...
+  "pear": {
+    "gui": {
+      "backgroundColor": "#00ff00",
+      "height": 540,
+      "width": 720,
+      "alwaysOnTop": true
+    }
+  }
+  ...
+}
+```
+
+When running the app now, it will be very green, and always stay on top.
+
+## Step 5. Create a basic UI
 
 To add some more interesting UI, let's have an example of a chat app, where users are able to create or join chat rooms and write messages to each other.