Тёплая панель Home Assistant для большой семьи
Тема warm_home, дашборд «Тёплый дом», сценарии (scripts+automations) и helpers. Все entity_id — плейсхолдеры, деплоя нет. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01Up44uyffFr8MuxiqfB61Uv
This commit is contained in:
german
@@ -0,0 +1,135 @@
|
||||
# =============================================================================
|
||||
# Тема «Тёплый дом» (warm_home) для Home Assistant / Lovelace
|
||||
# -----------------------------------------------------------------------------
|
||||
# Палитра тёплого семейного дома: кремовый фон, тёплое дерево и терракота,
|
||||
# мягкий янтарь для акцентов, приглушённый зелёный для «эко»-показателей,
|
||||
# тёплый тёмно-коричневый текст. Мягкие тени, крупные скруглённые карточки.
|
||||
#
|
||||
# Установка:
|
||||
# 1. Положите этот файл в <config>/themes/warm_home.yaml
|
||||
# 2. В configuration.yaml добавьте (если ещё нет):
|
||||
# frontend:
|
||||
# themes: !include_dir_merge_named themes
|
||||
# 3. Перезапустите Home Assistant.
|
||||
# 4. Профиль пользователя → тема → «Тёплый дом (warm_home)».
|
||||
#
|
||||
# Тема даёт и светлый, и «вечерний» (тёмный) вариант — HA сам подхватит
|
||||
# нужный по системной настройке день/ночь (modes: light/dark ниже).
|
||||
# =============================================================================
|
||||
|
||||
warm_home:
|
||||
# ---- Базовая палитра (используется переменными ниже) --------------------
|
||||
warm-cream: "#f6efe6" # кремовый фон
|
||||
warm-cream-2: "#efe4d6" # фон чуть темнее (полосы, вторичные блоки)
|
||||
warm-card: "#fffaf3" # тёплый белый — карточки
|
||||
warm-terracotta: "#c9743a" # тёплое дерево / терракота — главный акцент
|
||||
warm-terracotta-d: "#a95c28" # терракота потемнее (нажатия, ховер)
|
||||
warm-amber: "#e0a458" # мягкий янтарь — второй акцент, «включено»
|
||||
warm-green: "#7d9464" # приглушённый зелёный — «эко» / хорошо
|
||||
warm-red: "#c0562f" # тёплый красный — тревога / внимание
|
||||
warm-text: "#3a332c" # тёплый тёмно-коричневый текст
|
||||
warm-text-soft: "#6f6155" # вторичный текст
|
||||
warm-divider: "#e3d5c3" # тёплые разделители
|
||||
warm-shadow: "rgba(120, 82, 45, 0.16)" # мягкая тёплая тень
|
||||
|
||||
# ---- Скругления, тени, шрифт --------------------------------------------
|
||||
ha-card-border-radius: "18px"
|
||||
ha-card-border-width: "0px"
|
||||
ha-card-box-shadow: "0 4px 18px var(--warm-shadow)"
|
||||
card-mod-icon-color: "var(--warm-terracotta)"
|
||||
primary-font-family: "'Nunito', 'Segoe UI', 'Manrope', system-ui, sans-serif"
|
||||
paper-font-common-base_-_font-family: "'Nunito', 'Segoe UI', system-ui, sans-serif"
|
||||
|
||||
# ---- Основные цвета Home Assistant --------------------------------------
|
||||
primary-color: "var(--warm-terracotta)" # главный акцент HA
|
||||
accent-color: "var(--warm-amber)"
|
||||
dark-primary-color: "var(--warm-terracotta-d)"
|
||||
light-primary-color: "var(--warm-amber)"
|
||||
|
||||
# ---- Текст ---------------------------------------------------------------
|
||||
primary-text-color: "var(--warm-text)"
|
||||
secondary-text-color: "var(--warm-text-soft)"
|
||||
text-primary-color: "#fffaf3" # текст на акцентных кнопках
|
||||
disabled-text-color: "#b8a894"
|
||||
|
||||
# ---- Фон и поверхности ---------------------------------------------------
|
||||
primary-background-color: "var(--warm-cream)"
|
||||
secondary-background-color: "var(--warm-cream-2)"
|
||||
divider-color: "var(--warm-divider)"
|
||||
|
||||
# ---- Карточки ------------------------------------------------------------
|
||||
card-background-color: "var(--warm-card)"
|
||||
ha-card-background: "var(--warm-card)"
|
||||
paper-card-background-color: "var(--warm-card)"
|
||||
|
||||
# ---- Шапка / боковая панель ---------------------------------------------
|
||||
app-header-background-color: "var(--warm-terracotta)"
|
||||
app-header-text-color: "#fffaf3"
|
||||
sidebar-background-color: "var(--warm-card)"
|
||||
sidebar-text-color: "var(--warm-text)"
|
||||
sidebar-selected-text-color: "var(--warm-terracotta)"
|
||||
sidebar-selected-icon-color: "var(--warm-terracotta)"
|
||||
sidebar-icon-color: "var(--warm-text-soft)"
|
||||
|
||||
# ---- Иконки / состояния --------------------------------------------------
|
||||
state-icon-color: "var(--warm-text-soft)"
|
||||
state-icon-active-color: "var(--warm-amber)" # «включено» — тёплый янтарь
|
||||
paper-item-icon-color: "var(--warm-text-soft)"
|
||||
paper-item-icon-active-color: "var(--warm-amber)"
|
||||
|
||||
# ---- Осмысленные состояния (свет/климат/сенсоры) ------------------------
|
||||
state-light-active-color: "var(--warm-amber)"
|
||||
state-switch-active-color: "var(--warm-terracotta)"
|
||||
state-climate-heat-color: "var(--warm-terracotta)"
|
||||
state-climate-cool-color: "#6f97a8"
|
||||
state-binary_sensor-active-color: "var(--warm-red)" # открыто/движение/тревога
|
||||
|
||||
# ---- Переключатели / слайдеры / кнопки ----------------------------------
|
||||
switch-checked-color: "var(--warm-terracotta)"
|
||||
switch-unchecked-color: "#c3b3a1" # выключено — приглушённый тёплый серо-беж
|
||||
paper-slider-active-color: "var(--warm-terracotta)"
|
||||
paper-slider-knob-color: "var(--warm-terracotta)"
|
||||
paper-toggle-button-checked-bar-color: "var(--warm-terracotta)"
|
||||
mdc-theme-primary: "var(--warm-terracotta)"
|
||||
mdc-theme-secondary: "var(--warm-amber)"
|
||||
|
||||
# ---- Семантика «хорошо / внимание / ошибка» -----------------------------
|
||||
success-color: "var(--warm-green)"
|
||||
warning-color: "var(--warm-amber)"
|
||||
error-color: "var(--warm-red)"
|
||||
info-color: "var(--warm-terracotta)"
|
||||
|
||||
# ---- Метки/чипы графиков (тёплая гамма) ---------------------------------
|
||||
# Ряды на графиках энергопотребления и датчиков.
|
||||
graph-color-1: "var(--warm-terracotta)"
|
||||
graph-color-2: "var(--warm-amber)"
|
||||
graph-color-3: "var(--warm-green)"
|
||||
graph-color-4: "#b98a5e"
|
||||
|
||||
# =========================================================================
|
||||
# Режимы: светлый (день) и тёплый вечерний (ночь).
|
||||
# HA автоматически переключает по системной теме / времени суток.
|
||||
# =========================================================================
|
||||
modes:
|
||||
light:
|
||||
warm-cream: "#f6efe6"
|
||||
warm-cream-2: "#efe4d6"
|
||||
warm-card: "#fffaf3"
|
||||
warm-text: "#3a332c"
|
||||
warm-text-soft: "#6f6155"
|
||||
warm-divider: "#e3d5c3"
|
||||
warm-shadow: "rgba(120, 82, 45, 0.16)"
|
||||
|
||||
dark:
|
||||
# Вечерний тёплый режим — приглушённый, глаза отдыхают.
|
||||
warm-cream: "#2b2320" # тёмно-кофейный фон
|
||||
warm-cream-2: "#342a25"
|
||||
warm-card: "#39302a" # тёплые тёмные карточки
|
||||
warm-text: "#f2e7d8" # тёплый светлый текст
|
||||
warm-text-soft: "#c3b3a1"
|
||||
warm-divider: "#4a3d34"
|
||||
warm-shadow: "rgba(0, 0, 0, 0.45)"
|
||||
# Акценты в тёмном режиме чуть теплее и мягче
|
||||
warm-terracotta: "#d78850"
|
||||
warm-amber: "#e8b56b"
|
||||
warm-green: "#93a878"
|
||||
Reference in New Issue
Block a user