claus/N22
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Home view: person-kort med fast billedstørrelse + lokation (Hjemme/Ude/zone)

Browse Source
This commit is contained in:
Claus Dethlefsen
2026-04-24 19:14:10 +02:00
parent 158beed9c5
commit 94f0cd4d8a
1 changed files with 113 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboards/views/01_home.yaml
+113 -49
View File
@@ -36,7 +36,7 @@ cards:
# 👨‍👩‍👧‍👦 Familien – tryk for at toggle syg/rask
- type: grid
columns: 4
square: true
square: false
cards:
- type: custom:button-card
@@ -44,20 +44,20 @@ cards:
name: Daniel
show_name: true
show_state: false
show_label: true
show_icon: false
show_entity_picture: true
entity_picture_style:
- border-radius: 50%
- width: 100%
- filter: >
[[[
return states['input_select.daniel_status'] &&
states['input_select.daniel_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
label: >
[[[
const s = entity.state;
const sick = states['input_select.daniel_status'] &&
states['input_select.daniel_status'].state === 'syg';
const loc = s === 'home' ? 'Hjemme' : s === 'not_home' ? 'Ude' : s;
return sick ? loc + ' · Syg' : loc;
]]]
styles:
card:
- padding: 6px
- padding: 8px 4px
- border: >
[[[
return states['input_select.daniel_status'] &&
@@ -65,15 +65,31 @@ cards:
? '2px solid rgba(220,50,50,0.8)' : '2px solid transparent';
]]]
- border-radius: 12px
entity_picture:
- width: 60px
- height: 60px
- border-radius: 50%
- object-fit: cover
- filter: >
[[[
return states['input_select.daniel_status'] &&
states['input_select.daniel_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
name:
- font-size: 11px
- padding-top: 4px
- font-size: 12px
- font-weight: 600
- padding-top: 6px
- color: >
[[[
return states['input_select.daniel_status'] &&
states['input_select.daniel_status'].state === 'syg'
? 'rgb(220,50,50)' : 'var(--primary-text-color)';
]]]
label:
- font-size: 10px
- color: var(--secondary-text-color)
- padding-bottom: 2px
tap_action:
action: call-service
service: input_select.select_option
@@ -94,20 +110,20 @@ cards:
name: Claus
show_name: true
show_state: false
show_label: true
show_icon: false
show_entity_picture: true
entity_picture_style:
- border-radius: 50%
- width: 100%
- filter: >
[[[
return states['input_select.claus_status'] &&
states['input_select.claus_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
label: >
[[[
const s = entity.state;
const sick = states['input_select.claus_status'] &&
states['input_select.claus_status'].state === 'syg';
const loc = s === 'home' ? 'Hjemme' : s === 'not_home' ? 'Ude' : s;
return sick ? loc + ' · Syg' : loc;
]]]
styles:
card:
- padding: 6px
- padding: 8px 4px
- border: >
[[[
return states['input_select.claus_status'] &&
@@ -115,15 +131,31 @@ cards:
? '2px solid rgba(220,50,50,0.8)' : '2px solid transparent';
]]]
- border-radius: 12px
entity_picture:
- width: 60px
- height: 60px
- border-radius: 50%
- object-fit: cover
- filter: >
[[[
return states['input_select.claus_status'] &&
states['input_select.claus_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
name:
- font-size: 11px
- padding-top: 4px
- font-size: 12px
- font-weight: 600
- padding-top: 6px
- color: >
[[[
return states['input_select.claus_status'] &&
states['input_select.claus_status'].state === 'syg'
? 'rgb(220,50,50)' : 'var(--primary-text-color)';
]]]
label:
- font-size: 10px
- color: var(--secondary-text-color)
- padding-bottom: 2px
tap_action:
action: call-service
service: input_select.select_option
@@ -144,20 +176,20 @@ cards:
name: Anne
show_name: true
show_state: false
show_label: true
show_icon: false
show_entity_picture: true
entity_picture_style:
- border-radius: 50%
- width: 100%
- filter: >
[[[
return states['input_select.anne_status'] &&
states['input_select.anne_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
label: >
[[[
const s = entity.state;
const sick = states['input_select.anne_status'] &&
states['input_select.anne_status'].state === 'syg';
const loc = s === 'home' ? 'Hjemme' : s === 'not_home' ? 'Ude' : s;
return sick ? loc + ' · Syg' : loc;
]]]
styles:
card:
- padding: 6px
- padding: 8px 4px
- border: >
[[[
return states['input_select.anne_status'] &&
@@ -165,15 +197,31 @@ cards:
? '2px solid rgba(220,50,50,0.8)' : '2px solid transparent';
]]]
- border-radius: 12px
entity_picture:
- width: 60px
- height: 60px
- border-radius: 50%
- object-fit: cover
- filter: >
[[[
return states['input_select.anne_status'] &&
states['input_select.anne_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
name:
- font-size: 11px
- padding-top: 4px
- font-size: 12px
- font-weight: 600
- padding-top: 6px
- color: >
[[[
return states['input_select.anne_status'] &&
states['input_select.anne_status'].state === 'syg'
? 'rgb(220,50,50)' : 'var(--primary-text-color)';
]]]
label:
- font-size: 10px
- color: var(--secondary-text-color)
- padding-bottom: 2px
tap_action:
action: call-service
service: input_select.select_option
@@ -194,20 +242,20 @@ cards:
name: Andreas
show_name: true
show_state: false
show_label: true
show_icon: false
show_entity_picture: true
entity_picture_style:
- border-radius: 50%
- width: 100%
- filter: >
[[[
return states['input_select.andreas_status'] &&
states['input_select.andreas_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
label: >
[[[
const s = entity.state;
const sick = states['input_select.andreas_status'] &&
states['input_select.andreas_status'].state === 'syg';
const loc = s === 'home' ? 'Hjemme' : s === 'not_home' ? 'Ude' : s;
return sick ? loc + ' · Syg' : loc;
]]]
styles:
card:
- padding: 6px
- padding: 8px 4px
- border: >
[[[
return states['input_select.andreas_status'] &&
@@ -215,15 +263,31 @@ cards:
? '2px solid rgba(220,50,50,0.8)' : '2px solid transparent';
]]]
- border-radius: 12px
entity_picture:
- width: 60px
- height: 60px
- border-radius: 50%
- object-fit: cover
- filter: >
[[[
return states['input_select.andreas_status'] &&
states['input_select.andreas_status'].state === 'syg'
? 'grayscale(100%)' : 'none';
]]]
name:
- font-size: 11px
- padding-top: 4px
- font-size: 12px
- font-weight: 600
- padding-top: 6px
- color: >
[[[
return states['input_select.andreas_status'] &&
states['input_select.andreas_status'].state === 'syg'
? 'rgb(220,50,50)' : 'var(--primary-text-color)';
]]]
label:
- font-size: 10px
- color: var(--secondary-text-color)
- padding-bottom: 2px
tap_action:
action: call-service
service: input_select.select_option