perfect. many thanks for your work.
How can I create a custom style for a card, or do I have to create a custom card in order to do this? E.g., I have a card (card_binary_sensor
) showing my garage door sensor; I would like to have the cell shaded in green, when itās closed, and red, when itās open. Do I need to create a custom card for this?
Same here as wellā¦ As long as the phone is inside the zones, everything is fine. Once it goes outside the zones the card disappears and the console log says:
ButtonCardJSTemplateError: TypeError: Cannot read properties of undefined (reading 'attributes') in 'if (states[variables.ulm_card_person_entity].state != 'home'){
if (states[variables.ulm_card_p...'
at HTMLElement.eval (eval at _evalTemplate (button-card.js?hacstag=146194325342:425), <anonymous>:5:99)
at HTMLElement._evalTemplate (button-card.js?hacstag=146194325342:425)
at HTMLElement._getTemplateOrValue (button-card.js?hacstag=146194325342:425)
at button-card.js?hacstag=146194325342:433
at Array.forEach (<anonymous>)
at HTMLElement._buildCustomFields (button-card.js?hacstag=146194325342:433)
at HTMLElement._gridHtml (button-card.js?hacstag=146194325342:517)
at HTMLElement._buttonContent (button-card.js?hacstag=146194325342:499)
at HTMLElement._cardHtml (button-card.js?hacstag=146194325342:479)
at HTMLElement.render (button-card.js?hacstag=146194325342:425)
I am currently working to add the horizontal light cards. This will hopefully be added in the next release
I recommend you read more about romriders custom button card, and watch some YouTube
6:40 in to the video is a good place for you
This way you can learn super much!!
Step 2 might be too create one single card to your liking.
And if you like it, then learn how to create templates
Thank you very much @Andy_Miller & @peroyvind . This should be fixed with the next release: Make card_person zones optional and more robust by checkerschaf Ā· Pull Request #114 Ā· UI-Lovelace-Minimalist/UI (github.com)
Hello Guys.
Iām building the second ui using this great repo.
I have a question about how the lovelace cache works on iOS (not sure if Android has the same issue).
I canāt post a video here, but if I use some ānavigate to pathā buttonsā¦ the first time I use them after opening the app, the ui do a kind of refresh of the page. After a couple of time i navigate through the tabs, it becomes smooth.
This behavior is a bit annoying due to the fact i have the same card on the top of the screen in each view. So it is really visible this refresh.
I donāt know if I was clear with my explanation, maybe I will post a gif that shows better the problem.
Do you know if I can do a sort of āpreloadingā on the app opening to avoid it?
Good morning.
I have created a dashboard for a pair of firetabs i brought to use as tv remotes.
I would like the power button icon color to change state with the state of the TV if this is possible??
Iām looking to go red when off and green when on or just the default white when off and green when on.
At the moment when i push the button it turns yellow briefly but then goes white again when the TV is on.
Is anyone able to point me in the right direction for this or already has it functioning??
Thanks.
Hi,
Could you post the code for the media card?
Thanks
i am testing the new room card but i struggling to get the variables right.
- type: custom:button-card
template:
- card_room
- blue
entity: climate.midea_ac_16492674455697
variables:
- entity 1: light.vardagsrummet
- entity 2: light.diskbank
- entity 3: light.diskbank
- entity 4: light.diskbank
name: Vardagsrum
icon: mdi:sofa-outline
Really dumb question, but Iām using the same mini-media-player card but the border for my card doesnāt match the theme. How did you get it to match?
v1.0.0-beta.9
Good morning everyone,
here from us for you still a small Christmas gift.
This release has, in addition to a few minor bug fixes, again some new cards in the luggage. Among other things, new cards for device_tracker, input_numbers, printer and wifi.
Try it out and have fun with it.
In the meantime we could also get in contact with the Github support. Unfortunately it seems that none of us maintainers can get the rights over the UI organization and the associated wiki page repository.
If we donāt hear back from @Paddy0174 in the near future, we will probably have to move the repo to a new Github organization + Wiki Page.
Currently there are also some discussions going on in the repository about how to handle the repo in the future. A medium-term goal of ours is to make the Minimalist UI available via HACS as well. This will probably involve a major restructuring of the repo and some breaking changes. We are always grateful for your feedback. Feel free to join the discussions on the repo.
We wish you a Merry Christmas with your families and a relaxing holiday season.
Features
-
#121 Custom-card "Device Tracker (Online or Offline ?) @vncnt-dev
-
#111 Thermostat card @httpedo13
-
#117 Custom printer card with toner status @mp-se
-
#127 Custom Input Number Card @sildehoop
-
#133 Added wifi signal card @mp-se
-
#116 Additional custom light card @13robin37
Code enhancements
-
#114 Make card_person zones optional and more robust @checkerschaf
-
#140 New release light cards @basbruss
Bug Fixes
-
#112 Revert Set opacity-bg to 0.1 @CM000n
-
#113 Fix non colored chips on edge and chrome @CM000n
-
#140 New release light cards @basbruss
Translations
- #124 IT Language for Welcome card.yaml @httpedo13
Documentation
- #135 Restructure images in custom cards folder + fix broken links @bavo
Thank you so much for helping out to keep this UI awesome
@13robin37, @CM000n, @basbruss, @bavo, @checkerschaf, @httpedo13, @mp-se, @sildehoop, @vncnt-dev
The variables should be:
Hello bms,
I love your room card .Can you give me template code please?
Which one?
sorry! I was talking about this one, but I realized it was done by AndyVRD
You can follow the current development here @Benjaminh86 :
Initial attempt at creating the room card by bavo Ā· Pull Request #125 Ā· UI-Lovelace-Minimalist/UI (github.com)
Thank you so much
What are the demand for this room card? I dont get the small icon on the right side to show.
This is the correct setup.
- type: custom:button-card
template:
- card_room
- blue
entity: light.vardagsrummet
variables:
entity_id_1: light.ikea_besta_1
entity_id_2: light.test1
entity_id_3: light.test2
entity_id_4: light.test3
name: Vardagsrum
icon: mdi:sofa-outline
Sure, you can pass through every property using a variable. Try this (untested):
Using
type: "custom:button-card"
template: custom_card_graph
entity: sensor.waschmaschine_verbrauch
variables:
bar: "true"
custom_icon: mdi:washing-machine
group_by: "hour"
Template
custom_card_graph:
show_icon: false
show_name: false
styles:
grid:
- grid-template-areas: '"item1" "item2"'
- grid-template-columns: 1fr
- grid-template-rows: min-content min-content
card:
- border-radius: var(--border-radius)
- box-shadow: var(--box-shadow)
- padding: 0px
variables:
hours: 24
bar: false
graph_color: red
custom_icon: null
name: null
group_by: null
custom_fields:
item1:
card:
type: 'custom:button-card'
icon: '[[[ return variables.custom_icon ]]]'
template:
- icon_info
- card_generic
styles:
card:
- box-shadow: none
- border-radius: var(--border-radius) var(--border-radius) 0px 0px
- padding: 12px
entity: '[[[ return entity.entity_id ]]]'
name: '[[[ return variables.name == "null" ? entity.friendly_name : variables.name ]]]'
item2:
card:
type: 'custom:mini-graph-card'
group_by: >
[[[
if (variables.group_by === 'hour') {
return 'hour';
} else if (variables.group_by === 'date') {
return 'date';
}
return 'interval';
]]]
entities:
- entity: '[[[ return entity.entity_id ]]]'
line_color: "[[[ return 'rgba(var(--color-' + variables.graph_color + '),1)'; ]]]"
hours_to_show: '[[[ return variables.hours ]]]'
show:
graph: '[[[ return variables.bar === "true" ? "bar" : "line"; ]]]'
name: false
icon: false
legend: false
state: false
style: |
ha-card {
box-shadow: none;
border-radius: var(--border-radius);
}