Update README.md
This commit is contained in:
parent
d55f8f4a8f
commit
e7b58fdd63
110
README.md
110
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
|
||||
[<img src="./images/screenshots/dashie_default.png" width="20%" height="20%">](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_default.png)
|
||||
[<img src="./images/screenshots/dashie_colorful.png" width="20%" height="20%">](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_colorful.png)
|
||||
[<img src="./images/screenshots/dashie_gruvbox.png" width="20%" height="20%">](https://git.ahall.se/magnus/dashie/raw/branch/main/images/screenshots/dashie_gruvbox.png)
|
||||
[<img src="./images/screenshots/dashie_subdued.png" width="20%" height="20%">](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.
|
||||
```
|
||||
Loading…
Reference in New Issue