Me and my wife are using android on two different phone brands (Motorola and Samsung). So this seems to not be a IOS problem only.
Hello is there any chance to get in Media_player card extra field for text to speech? And if, how to do it??
For other users it would be nice to say where. Otherwise this message doesn’t help anybody
I use the “card_room” on my minimalist theme. I find this card so biggest with my tablet. How must to modify on this “card_room” code to minimize this card by half?
---
card_room:
template:
- "ulm_translation_engine"
variables:
label_use_temperature: true
label_use_brightness: false
double_tap_action:
action: "call-service"
service: "input_select.select_option"
service_data:
option: "[[[ return variables.ulm_input_select_option ]]]"
entity_id: "[[[ return variables.ulm_input_select ]]]"
color: "var(--google-grey-500)"
size: "45%"
aspect_ratio: "1/1"
show_icon: true
show_label: true
show_name: true
icon: "mdi:sofa-single"
label: |-
[[[
if (variables.label_use_temperature) {
return (entity?.attributes?.current_temperature || entity?.attributes?.temperature || entity?.attributes?.device_temperature || entity?.state || '-') + (entity?.attributes?.unit_of_measurement || '°C');
} else if (variables.label_use_brightness && entity?.state == "on" && entity?.attributes?.brightness != null) {
let bri = Math.round(entity?.attributes?.brightness / 2.55);
return (bri ? bri : "0") + "%";
}
return variables.ulm_translation_state;
]]]
state:
- value: "unavailable"
styles:
custom_fields:
notification:
- border-radius: "50%"
- border: "2px solid var(--card-background-color)"
- width: "24.5px"
- height: "24.5px"
- position: "absolute"
- left: "50%"
- top: "50%"
- transform: "translate(-50%,-50%)"
- margin-top: "35%"
- margin-left: "-35%"
- line-height: 0
- display: "grid"
- background-color: "[[[ return 'rgba(var(--color-red),1)'; ]]]"
styles:
icon:
- color: "rgba(var(--color-theme),0.2)"
label:
- justify-self: "start"
- align-self: "start"
- font-weight: "bold"
- font-size: "14px"
- filter: "opacity(40%)"
- margin-left: "12px"
- max-width: "[[[ return `calc(100% - (12px + ${!variables?.entity_1 && !variables?.entity_2 ? 5 : 0}px))`; ]]]"
- text-overflow: "ellipsis"
- overflow: "hidden"
- margin-top: "[[[ return !variables?.entity_1 ? '-24%' : '-10%'; ]]]"
name:
- justify-self: "start"
- align-self: "end"
- font-weight: "bold"
- font-size: "18px"
- margin-left: "12px"
- margin-bottom: "[[[ return !variables?.entity_1 ? (!variables?.entity_2 ? '15.8%' : '24%') : '10%'; ]]]"
- max-width: "[[[ return `calc(100% - (12px + ${!variables?.entity_2 ? 5 : 0}px))`; ]]]"
- text-overflow: "ellipsis"
- overflow: "hidden"
state:
- justify-self: "start"
- font-weight: "bold"
- font-size: "12px"
- filter: "opacity(40%)"
- margin-left: "6px"
img_cell:
- background-color: "rgba(var(--color-theme),0.05)"
- border-radius: "50%"
- width: "75%"
- height: "75%"
- max-width: "none"
- max-height: "none"
- position: "absolute"
- left: "50%"
- top: "50%"
- transform: "translate(-50%,-50%)"
- margin-top: "25%"
- margin-left: "-25%"
grid:
- grid-template-areas: "[[[ return !variables?.entity_1 ? (!variables?.entity_2 ? `'n n n' 'l l i3' 'i i i4'` : `'n n i2' 'l l i3' 'i i i4'`) : `'n n n i1' 'l l l i2' 'i i . i3' 'i i . i4'`; ]]]"
- grid-template-columns: "[[[ return !variables?.entity_1 ? '1fr 1fr 1fr' : '1fr 1fr 1fr 1fr'; ]]]"
- grid-template-rows: "[[[ return !variables?.entity_1 ? '1fr 1fr 1fr' : '1fr 1fr 1fr 1fr'; ]]]"
- justify-items: "center"
card:
- border-radius: "20px"
- box-shadow: "var(--box-shadow)"
- padding: "5px"
custom_fields:
i1: &widget_icon_room_styling
- border-radius: "50%"
- width: "80%"
- height: "80%"
- line-height: 0
- display: "grid"
i2: *widget_icon_room_styling
i3: *widget_icon_room_styling
i4: *widget_icon_room_styling
custom_fields:
notification: >
[[[
if (entity?.state == 'unavailable'){
return '<ha-icon icon="mdi:exclamation" style="width: 50%; height: 50%; color: var(--primary-background-color);"></ha-icon>';
}
]]]
i1:
card:
type: "custom:button-card"
template: >
[[[
let templates = [ 'widget_icon_room' ];
if (variables?.entity_1?.templates?.length) {
templates.push(...variables.entity_1.templates);
}
return templates;
]]]
variables: "[[[ return variables?.entity_1; ]]]"
state:
- operator: "template"
value: "[[[ return !variables.entity_1; ]]]"
styles:
card:
- display: "none"
entity: "[[[ return variables?.entity_1?.entity_id; ]]]"
i2:
card:
type: "custom:button-card"
template: >
[[[
let templates = [ 'widget_icon_room' ];
if (variables?.entity_2?.templates?.length) {
templates.push(...variables.entity_2.templates);
}
return templates;
]]]
variables: "[[[ return variables?.entity_2; ]]]"
state:
- operator: "template"
value: "[[[ return !variables.entity_2; ]]]"
styles:
card:
- display: "none"
entity: "[[[ return variables?.entity_2?.entity_id; ]]]"
i3:
card:
type: "custom:button-card"
template: >
[[[
let templates = [ 'widget_icon_room' ];
if (variables?.entity_3?.templates?.length) {
templates.push(...variables.entity_3.templates);
}
return templates;
]]]
variables: "[[[ return variables?.entity_3; ]]]"
state:
- operator: "template"
value: "[[[ return !variables.entity_3; ]]]"
styles:
card:
- display: "none"
entity: "[[[ return variables?.entity_3?.entity_id; ]]]"
i4:
card:
type: "custom:button-card"
template: >
[[[
let templates = [ 'widget_icon_room' ];
if (variables?.entity_4?.templates?.length) {
templates.push(...variables.entity_4.templates);
}
return templates;
]]]
variables: "[[[ return variables?.entity_4; ]]]"
state:
- operator: "template"
value: "[[[ return !variables.entity_4; ]]]"
styles:
card:
- display: "none"
entity: "[[[ return variables?.entity_4?.entity_id; ]]]"
widget_icon_room:
variables:
tap_action:
action: "toggle"
hold_action:
action: "more-info"
tap_action:
action: "[[[ return variables?.tap_action?.action ? variables.tap_action.action : 'none'; ]]]"
entity: "[[[ return variables.tap_action.entity; ]]]"
navigation_path: "[[[ return variables.tap_action.navigation_path; ]]]"
url_path: "[[[ return variables.tap_action.url_path; ]]]"
service: "[[[ return variables.tap_action.service; ]]]"
service_data: "[[[ return variables.tap_action.service_data; ]]]"
hold_action:
action: "[[[ return variables?.hold_action?.action ? variables.hold_action.action : 'none'; ]]]"
entity: "[[[ return variables.hold_action.entity; ]]]"
navigation_path: "[[[ return variables.hold_action.navigation_path; ]]]"
url_path: "[[[ return variables.hold_action.url_path; ]]]"
service: "[[[ return variables.hold_action.service; ]]]"
service_data: "[[[ return variables.hold_action.service_data; ]]]"
size: "15px"
color: "var(--google-grey)"
show_icon: true
show_name: false
styles:
icon:
- width: "50%"
- height: "50%"
- line-height: "0"
- color: "rgba(var(--color-theme),0.2)"
img_cell:
- border-radius: "50%"
- background-color: "rgba(var(--color-theme),0.05)"
grid:
- grid-template-areas: "'i'"
card:
- height: "100%"
- box-shadow: "none"
- padding: "0px"
- border-radius: "50%"
Found a way on my own, instead of modifying the whole template from the welcome_scenes card i just created the same one again in my view and made the condition on the whole card.
So when Holiday Season is off it will show just 6 pillars and when Holiday Season is on it will show it with 7 pillars.
If anybody has a better idea, i’m open to change it again 
Here is my code:
- view_layout:
grid-area: "welcome"
type: conditional
conditions:
- entity: binary_sensor.christmas_season
state: 'on'
card:
type: "custom:button-card"
template: "card_welcome_scenes"
entity: input_boolean.ui_scenes
variables:
ulm_weather: weather.entity
ulm_language: "de-DE"
ulm_card_welcome_scenes_collapse: input_boolean.ui_scenes
ulm_translation_scenes: " "
entity_1: # Wifi Guest
entity_id: script.wifi_guest_access
icon: "mdi:wifi-plus"
name: "WIFI"
color: "purple"
entity_2: # All lights
entity_id: sensor.lights_on_total
icon: "mdi:lightbulb-multiple"
name: "Lichter"
color: "blue"
nav_path: /adaptive-dash/ui-lovelace-minimalist-all-lights
entity_3: # Raffstore
entity_id: sensor.docker_hass_state
icon: "mdi:window-shutter-cog"
name: "Raffstore"
color: "green"
nav_path: /adaptive-dash/ui-lovelace-minimalist-all-covers
entity_4: # CCTV
entity_id: sensor.docker_hass_state
icon: "mdi:cctv"
name: "CCTV"
color: "red"
nav_path: /adaptive-dash/ui-lovelace-minimalist-cctv
entity_5: # Shopping List
entity_id: sensor.docker_hass_state
icon: "mdi:cart-outline"
name: "Shopping"
color: "blue"
nav_path: /adaptive-dash/ui-lovelace-minimalist-shopping
entity_6: # Tesla / Garage View
entity_id: sensor.docker_hass_state
icon: "si:tesla"
name: "Tesla"
color: "red"
nav_path: /adaptive-dash/ui-lovelace-minimalist-garage
entity_7:
entity_id: light.weihnachten
icon: "mdi:gift"
name: "Weihnachten"
color: "green"
If my binary_sensor is ‘off’ i have the same yaml but without entity_7
Hi,
Can someone help me please? I can’t get the name translated on the Person Card chip: home and not_home. Anyone an idea?
Hi,
Just noticed that this card was not updated with the fix for the translation engine after changes in HA 2023.04.03.
I have already updated the code to include the fix. You can find the updated code here:
1 Like
Thank You!
just updated to 2023.5. looks like it broke something with the ios-tapbar theme, scrolling down on a page isn´t working anymore. works with any other theme that doesn´t use the bottom navigationbar.
1 Like
Check HACS for a Minimalist update. Latest version is 1.3.5.
That update should fix it for you 
1 Like
ye just saw it, thanks for the info tho
After the 1.3.5 update i’m seeing issues with the minimalist-mobile theme. I use wallpaper’s on my dashboards and it only cover about half of the page. In the screenshot below the wallpaper stops about mid point on the Smart speaker/Chromecast cards and is black the rest of the way down. Clearing the broswer cache, running frontend.reload_themes doesnt change anything. If I change to another theme the wallpaper is fine.
minimalist-mobile theme:
vs
minimalist-desktop theme:
HI,
how did you get it to only change the color in the icon area? Currently, when you turn on a lamp, the entire button changes
Same issue exists for the custom_card_person_info. Could you also update the code to include the fix?
It looks like HA 2023.5.1 fixed it
Not sure what you mean.
There is an entity at a room card level (can be a light, can be whatever) and when that is on, the whole card will change color.
And then there are sub-entities (1-4) that are the small buttons. Those are independent to the big card.
Otherwise, post a screenshot with more explanation
On both the android app and while testing in a web browser, the tap bar has moved to the top of the displayed page. How can I move it to the bottom again?
In the theme file minimalist-mobile-tapbar.yaml, the css is set correctly. The bar should be always be stuck to the bottom of the page.
.header {
top: auto !important;
bottom: 0px !important;
box-shadow: var(--footer-shadow);
height: var(--header-height) !important;
}
However when displayed in the browser and inspected this is constructed stylesheet.
.header {
background-color: var(--app-header-background-color);
color: var(--app-header-text-color,#fff);
border-bottom: var(--app-header-border-bottom,none);
position: fixed;
top: 0px;
}
What is overriding the position rules?
Hi,
I’m looking for a bit of help for the room card. I have 2 icons that their color won’t follow the current status of the entity and I’m not sure how to solve this. The first one (entity 3) is a button to trigger an automation. I understand it’s always blue (blue_on) since the automation is always on but I would like to make it blue only when the automation is being executed and grey when not. The other one (entity 4) is a window cover. It stays gray even when the cover is open. I would like it to be grey when the cover is closed and green when it’s open, but adding ‘‘green_on’’ doesn’t have any effect, I guess it’s because the cover is reporting either open/closed instead of on/off?
Thanks!
You could use an input_boolean inside your automation and add this to your icon. The automation triggering can be achived then with a specific tap_action.
Maybe there is an easier way, but i guess with that it would work
1 Like