我创建了另一个Dashboard。
我的仪表盘是完全响应的，所以它可以在台式机、平板电脑和移动应用程序上使用。
它有一个侧边栏，用于提供当前信息。在小屏幕(宽度小于1024px)的小设备上，侧边栏会自动隐藏。
主视图(仪表板本身)是基于默认的hui- mason- view，所以它是完全可配置的，每个卡都可以添加…
另一个很好的特性是，可以在UI的帮助下轻松地添加卡片。
首先，我想向您介绍我的完整设置和布局我的设置仪表板。
但是你不必按照我的方式塑造仪表板。它是完全可配置的。
在台式机和平板电脑上，它看起来像:
和手机:
我的仪表板主要由我创建的两个自定义组件组成：
HA-Dashboard
https://github.com/wassy92x/lovelace-ha-dashboard
可以在HACS中添加此插件作为自定义存储库，但我还在HACS-Default-Repsitient中创建了一个Light-request，因此它将很快以默认的HACS提供。
更新:现在可以使用HACS默认值。
关于配置请参见我的GitHub-Repository。
实体 - 按钮组
https://github.com/wassy92x/lovelace-entities-btn-group
此插件也可以在HACS中添加为自定义存储库，但我还在HACS-Default-Repsitient中创建了一个Ligh-request，因此它将很快以默认的HACS提供。
更新:现在可以使用HACS默认值。
关于配置请参见我的GitHub-Repository。
这个前端插件本身也可以使用，没有我的仪表盘。
此外，你需要以下插件获得仪表板为我的:
视图:- title: Kiosk路径:Kiosk类型:custom:ha-dashboard侧边栏:按钮:- icon: mdi:robot-vacuum action: action: call-service service: browser_mod。popup service_data: title:小米Roborock card: buttons: true entity: vacuum。roborock_vacuum_s5 type: 'custom:xiao -vacuum-card' stickyCards: - type: 'custom:digital-clock' style: | ha-card {margin: 0 5px;border - radius: 0;边框底:1px固体白色;} - type: weather-forecast entity: weather.frankfurt_openweathermap style: | ha_card {padding-top: 0 !important;padding-bottom: 0 !重要;} card: - type: 'custom:auto-entities' card: type: entities title: Offene Fenster/Türen filter: include: - entity_id: binary_sensor。*_fensterkontakt* state: 'on' show_empty: false sort: method: entity_id cards: - type: 'custom:entities-btn-group' title: Wohnzimmer entities: - light. class: 'custom:entities-btn-group'Moritz -实体:气候。wohnzimmer_thermostat_int0000001变量:curTempEntity:传感器。wohnzimmer_temperature - entity: media_player。firetv_wohnzimmer name: FireTV - type: 'custom:entities-btn-group' title: Küche entities: - entity: light.esstischlampe - entity: climate. name: FireTV - type: 'custom:entities-btn-group'kueche_thermostat变量:湿度实体:传感器。kuche_feuchtigkeit curTempEntity:传感器。kuche_temperatur - entity: var.state_spulmaschine name: Spülmaschine - type: 'custom:entities-btn-group' title: Außen entities: - entity: switch.pool_warmwasserpumpe name: Warmwasser - template: - camera variables: pictureUrl: https://mycamera.com/weg name: Weg title: Kiosk
此外，我有以下按钮模板样式的按钮:
Button_Card_templates：默认值：Aspect_ratio：1/1样式：卡： - 边界半径：10px - 框阴影：无 - 转换：无名称： - 字体大小：0.8EM灯：模板： - 默认自定义：>亮度：>亮度：>亮度：>[[if（实体&&实体。&& && tigity.attributes.brightness.brightness.brightness.brightness.brightness.brightness.brightness *（100/255））+'％'}返回'']]]样式：custom_fields：亮度： - 位置：绝对 - 右：5px - top：5px - 字体大小：0.85em double_tap_action：action：call-service服务：browser_mod.popup service_data：title：'[[返回entity.attributes.friendly_name]]'卡片：类型：'自定义：灯实体卡'实体：'[[[返回Entity.entity_id]]'var：模板： - 默认show_state：true样式：状态： - 底部：calc（25％ - 0.4em） - 位置：绝对 - 宽度：100％ - 文本对齐：中心 - 字体大小：0.8em - 字体重量：粗体：模板： - 默认show_entity_picture：true样式：entity_picture： - 宽度：95％ - 高度：100％ - 边界半径：5px气候：模板： - 默认show_icon：false show_state：true show_name：false tap_action：action：call-service服务：browser_mod.popup service_data：title：'[[返回entity.attributes.friendly_name]]'卡：类型：'custom：简单恒温器'实体：'[[返回Entity.entity_id]]'隐藏：温度：'[[[返回变量&&变量.Curtempentity]]'传感器： - 实体：'[[[返回变量&&变量&&变量。Cutempentity]]]'名称：温度 - 实体：'[[返回变量&&变量.Humityingentity]]'名称：feuchtikeit step_size：0.5 custom_fields：curtemp：> [[[如果（变量&&变量&& curtempentity && sends [变量.curtempentity]）{return（math.round（arrowble.curtempentity] .state * 10）/ 10）+状态[变变.Uurtempentity] .attributes.unit_of_measurement}如果（实体&&实体.Attributes）{return（数学.round（entity.Attributes.Current_Temperature * 10）/ 10）+'°C'}返回'']]] targetTemp：> [[[[[[如果（实体&&实体.Attributes）{return entity.attributes.t+''']]湿度：> [[[[[[如果（变量&&变量&& && tolmate [变量＆bumityingentity]）{return（math.round（stars.rounds.humtifyentity] .state *10）/ 10）+状态[变量.Himityentity] .Attributes.unit_of_measurement} return''']]样式：状态： - 底部：5px - 位置：绝对 - 宽度：100％ - 文本 - 对齐：中心 - 字体α：0.8em custom_fields：curtemp： - 位置：绝对 - 左：0 - top：calc（50％ - 0.6em） - 宽度：100％ - 字体大小：1.2em targettemp： - 位置：绝对 - 右：5px - top：5px - 字体大小：0.85em湿度： - 位置：绝对 - 左：5px - top：5px - font-size：0.85em相机：模板： - 默认show_entity_picture：true entity_picture：'[[[返回variables.pictureurl]]]'风格：Entity_picture： - 宽度：95％ - 高度：100％ - 边界半径：5px键：操作：URL URL_Path：'[[返回Variables.pictureUrl]]'
