|
1 |
| -# green_dark_mode |
2 |
| -🎨 By JuanMTech -- A matte black theme with a green accent color |
| 1 | +# Green Dark mode |
| 2 | +A matte black theme with a green accent color |
| 3 | + |
| 4 | +[](https://github.com/custom-components/hacs) |
| 5 | + |
| 6 | +[![Subscribe to YouTube channel][youtube-sub-shield]][youtubesubscribe] |
| 7 | + |
| 8 | +[![Become a Patron][become-a-patron-shield]][becomeapatron] |
| 9 | + |
| 10 | +[![Buy me a coffee][buymeacoffee-shield]][buymeacoffee] |
| 11 | + |
| 12 | +### Screenshots |
| 13 | +**1. Desktop** |
| 14 | +<p align="center"> |
| 15 | + <img src="https://i.imgur.com/d1Vgove.png"> |
| 16 | +</p> |
| 17 | + |
| 18 | +**2. Mobile** |
| 19 | +<p align="center"> |
| 20 | + <img src="https://i.imgur.com/KpgdYgY.png"> |
| 21 | +</p> |
| 22 | + |
| 23 | +### Preparation |
| 24 | +1. Make sure that under the **configuration.yaml** file you have the following: |
| 25 | + |
| 26 | +<pre> |
| 27 | +frontend: |
| 28 | + themes: !include_dir_merge_named ../themes |
| 29 | +</pre> |
| 30 | + |
| 31 | +2. Under the Home Assistant **Config** folder, create a new folder named **themes** |
| 32 | +3. **Restart** Home assistant to apply the changes. |
| 33 | + |
| 34 | +### HACS installation |
| 35 | +1. Go into the Community Store (HACS) |
| 36 | +2. Search for Google Dark Theme |
| 37 | +3. Open the theme |
| 38 | +4. Press Install |
| 39 | +5. Restart Home Assistant |
| 40 | + |
| 41 | +### Manual installation |
| 42 | +1. In the Home assistant **themes** folder, create a file named `green_dark_mode.yaml` |
| 43 | +2. In this GitHub repo, go into the **themes** folder, open the `green_dark_mode` file and copy the content |
| 44 | +3. Paste the content in the `green_dark_mode` file created under your Home Assistant themes folder |
| 45 | + |
| 46 | +### Enable theme |
| 47 | +1. Open your Home Assistant **Profile** |
| 48 | +2. Under, **Themes**, select the new Green Dark mode Theme |
| 49 | + |
| 50 | + |
| 51 | +### Custom Header settings |
| 52 | +When using the [Custom Header](https://github.com/maykar/custom-header) plugin, add the following to make sure that the header matches the theme. |
| 53 | + |
| 54 | +<pre> |
| 55 | +custom_header: |
| 56 | + compact_mode: true |
| 57 | + background: var(--app-header-background-color) |
| 58 | + elements_color: var(--app-header-text-color) |
| 59 | + active_tab_color: var(--state-icon-active-color) |
| 60 | + tab_indicator_color: var(--state-icon-active-color) |
| 61 | +</pre> |
| 62 | + |
| 63 | + |
| 64 | + |
| 65 | +[buymeacoffee-shield]: https://i.imgur.com/Hzn2rM8.png |
| 66 | +[buymeacoffee]: https://www.buymeacoffee.com/JuanMTech |
| 67 | +[become-a-patron-shield]: https://i.imgur.com/U9BjCfc.png |
| 68 | +[becomeapatron]: https://www.patreon.com/JuanMTech |
| 69 | +[youtube-sub-shield]: https://i.imgur.com/6TAqHgi.png |
| 70 | +[youtubesubscribe]: https://www.youtube.com/c/JuanMTech?sub_confirmation=1 |
0 commit comments