diff --git a/README.md b/README.md
index dc6684b..8326745 100644
--- a/README.md
+++ b/README.md
@@ -1,62 +1,25 @@
# Dashie
-Dashie is a simple personal dashboard with themes and multiple pages, generated per visit from the YAML configuration files. The YAML configuration files have to be edited by hand.
+Dashie is a simple personal dashboard with themes and multiple pages, generated on the fly from the YAML configuration files.
There is no multiuser support right now.
-Inspired by Dashy, https://dashy.to/.
+A shoutout to Dashy, https://dashy.to/, which Dashie is visually heavily inspired by.
+
+## Screenshots
+[
](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_default.png)
+[
](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_colorful.png)
+[
](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_gruvbox.png)
+[
](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_subdued.png)
# Installation
-Copy examples/*.yaml to the web root, and put everything on a webserver serving the directory statically.
+Copy examples/*.yaml to the web root (or write `start.yaml` from scratch instead), and put everything on a webserver serving the directory statically.
-# Themes
+# YAML files
+The YAML configuration files have to be edited by hand right now.
-The themes.yaml file in the web root has the following format per theme:
+In the future dashie is probably going to get a server written in Go, enabling interactive editing and possibly multiuser support.
-```yaml
-gruvbox: # Name of theme.
- page:
- text: "#bdae93" # Color of the page name.
- background: "#282828 url('/images/backgrounds/gruvbox.svg')" # background color/image of the page.
- header: "#504945" # Background color of the header section.
- footer: # Colors for the footer (The 'Dashie v[x]' line).
- show: true # Show or hide the footer.
- text: "#a89984"
- background: "#504945"
-
- page_select: # Colors for the page boxes.
- text: "#bdae93"
- background: "#3c3836"
-
- theme_select: # Colors for the theme selector.
- text: "#bdae93"
- background: "#3c3c36"
- border: "#665c54"
-
- section:
- background: "#504945"
- shadow: "10px 10px 15px 0px rgba(0, 0, 0, 0.25)"
- # These colors will be used in a roundrobin fashion when displaying
- # sections, if a section is not explicitly using a color index.
- # The first is the border color, the second is the section label color.
- borders:
- - ["#fb4934", "#eee"]
- - ["#b8bb26", "#333"]
- - ["#fabd2f", "#333"]
- - ["#458588", "#eee"]
- - ["#fe8019", "#333"]
- - ["#689d6a", "#333"]
-
- item:
- label: # The label can be left blank to receive the same color as the section border.
- background: "#282828"
- description: "#d5c4a1"
- url: "#a89984"
- icon: # Icon can be left blank, same behaviour as label.
- hover: brighter # Determines mouse pointer hovering over section background color.
- #Can be brighter, darker or anything else to disable behaviour.
-```
-
-# Dashboard YAML files
+## Dashboard YAML files
Icons use the Material Design Icons library, see https://pictogrammers.com/library/mdi/ for a searchable list of icons. To use the abacus icon, type "abacus" in the icon property of the section items.
@@ -101,4 +64,51 @@ sections:
- label: Spotify
url: https://spotify.com
icon: music
+```
+
+## Themes
+The themes.yaml file in the web root has the following format per theme:
+
+```yaml
+gruvbox: # Name of theme.
+ page:
+ text: "#bdae93" # Color of the page name.
+ background: "#282828 url('/images/backgrounds/gruvbox.svg')" # background color/image of the page.
+ header: "#504945" # Background color of the header section.
+ footer: # Colors for the footer (The 'Dashie v[x]' line).
+ show: true # Show or hide the footer.
+ text: "#a89984"
+ background: "#504945"
+
+ page_select: # Colors for the page boxes.
+ text: "#bdae93"
+ background: "#3c3836"
+
+ theme_select: # Colors for the theme selector.
+ text: "#bdae93"
+ background: "#3c3c36"
+ border: "#665c54"
+
+ section:
+ background: "#504945"
+ shadow: "10px 10px 15px 0px rgba(0, 0, 0, 0.25)"
+ # These colors will be used in a roundrobin fashion when displaying
+ # sections, if a section is not explicitly using a color index.
+ # The first is the border color, the second is the section label color.
+ borders:
+ - ["#fb4934", "#eee"]
+ - ["#b8bb26", "#333"]
+ - ["#fabd2f", "#333"]
+ - ["#458588", "#eee"]
+ - ["#fe8019", "#333"]
+ - ["#689d6a", "#333"]
+
+ item:
+ label: # The label can be left blank to receive the same color as the section border.
+ background: "#282828"
+ description: "#d5c4a1"
+ url: "#a89984"
+ icon: # Icon can be left blank, same behaviour as label.
+ hover: brighter # Determines mouse pointer hovering over section background color.
+ #Can be brighter, darker or anything else to disable behaviour.
```
\ No newline at end of file