Skip to content

Commit

Permalink
add custom theme doc
Browse files Browse the repository at this point in the history
  • Loading branch information
piitaya committed Feb 6, 2022
1 parent 427cd63 commit eb52524
Show file tree
Hide file tree
Showing 9 changed files with 58 additions and 2 deletions.
60 changes: 58 additions & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,8 +14,64 @@ Just select your theme in your Home Assistant profile settings.

2 themes are available :

- [Default](docs/themes/default.md)
- [Square](docs/themes/square.md)
- Mushroom (default)
- Mushroom square

## Build your own

You can build your own theme by using the mushroom variables.

```yaml
Mushroom:
# HA variables
ha-card-box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.16)
ha-card-border-radius: 12px
# Mushroom layout
mush-spacing: 12px
# Title
mush-title-padding: 24px 12px 16px
mush-title-spacing: 12px
mush-title-font-size: 24px
mush-title-font-weight: normal
mush-title-line-height: 1.2
mush-subtitle-font-size: 16px
mush-subtitle-font-weight: normal
mush-subtitle-line-height: 1.2
# Card
mush-icon-border-radius: 50%
mush-control-border-radius: 12px
# Chips
mush-chip-spacing: 8px
mush-chip-padding: 0 12px
mush-chip-height: 36px
mush-chip-border-radius: 18px
# Colors
mush-rgb-red: 244, 67, 54
mush-rgb-pink: 233, 30, 99
mush-rgb-purple: 156, 39, 176
mush-rgb-deep-purple: 103, 58, 183
mush-rgb-indigo: 63, 81, 181
mush-rgb-blue: 33, 150, 243
mush-rgb-light-blue: 3, 169, 244
mush-rgb-cyan: 0, 188, 212
mush-rgb-teal: 0, 150, 136
mush-rgb-green: 76, 175, 80
mush-rgb-light-green: 139, 195, 74
mush-rgb-lime: 205, 220, 57
mush-rgb-yellow: 255, 235, 59
mush-rgb-amber: 255, 193, 7
mush-rgb-orange: 255, 152, 0
mush-rgb-deep-orange: 255, 87, 34
mush-rgb-brown: 121, 85, 72
mush-rgb-grey: 158, 158, 158
mush-rgb-blue-grey: 96, 125, 139
mush-rgb-black: 0, 0, 0
mush-rgb-white: 255, 255, 255
# You must keep this to support light/dark theme
modes:
light: {}
dark: {}
```
## Installation
Expand Down
Binary file removed docs/images/default-dark.png
Binary file not shown.
Binary file removed docs/images/default-light.png
Binary file not shown.
Binary file removed docs/images/square-dark.png
Binary file not shown.
Binary file removed docs/images/square-light.png
Binary file not shown.
Empty file removed docs/themes/default.md
Empty file.
Empty file removed docs/themes/square.md
Empty file.
File renamed without changes.
File renamed without changes.

0 comments on commit eb52524

Please sign in to comment.