🌻 Lovelace UI • Minimalist

The big card is likely made using Stack-In-Card by RomRider (in vertical mode).
The cards inside it are probably Title, Horizontal Stack (with 2 binary sensor or input_boolean cards), Thermostat and then Graph.

I can’t figure out how to get Imswel’s person card to display in English–
I’ve tried placing the language file in the card folder, changing the Minimalist integration language, and changing the Home Assistant language (to a few different English variants).

Anyone know why this might be?
Also if anyone knows how to get this card to display vertically similar to the option in the Mushroom person card, I’d love an explanation.

Hi billyjoebob999!
I did what you kindly suggested but I did it the wrong way, I suppose.
Check below my code, please.



What am I doing wrong, please?
I feel myself close to the point but still a bit confused :sweat_smile:

Thank you very much :pray:

    - type: horizontal-stack
      cards: 
        - type: custom:button-card
          show_icon: false
          show_name: false
          show_label: false
          styles:
            grid:
              - grid-template-areas: "'item1 item1' 'item2 item2' 'item3 item3' 'item4 item4'"
              - grid-template-columns: 1fr 1fr
              - grid-template-rows: "min-content min-content min-content"
              - row-gap: 10px
            card:
              - border-radius: var(--border-radius)
              - box-shadow: var(--box-shadow)
              - padding: 10px
          custom_fields:
            item1:
              card:
                type: custom:button-card
                template: card_title
                name: Tesla | M3 van Léon
                label: '[[[ return "Het is " + states["sensor.temp_tesla"].state + "°C in de auto." ]]]'
            item2:
              card:
                type: custom:button-card
                template: list_2_items
                custom_fields:
                  item1:
                    card:
                      type: custom:button-card
                      template: card_power_outlet
                      entity: switch.m3_van_leon_sentry_mode_switch
                      name: Sentry mode
                      styles:
                        card:
                          - box-shadow: "none"  
                  item2:
                    card:
                      type: custom:button-card
                      template: card_binary_sensor
                      entity: binary_sensor.m3_van_leon_parking_brake_sensor
                      styles:
                        card:
                          - box-shadow: "none"   
            item3:
              card:
                type: horizontal-stack
                cards:
                  - type: 'custom:button-card'
                    template: custom_card_mpse_thermostat
                    entity: climate.m3_van_leon_hvac_climate_system
                    styles:
                      card:
                        - box-shadow: none

            item4:
              card:
                type: horizontal-stack
                cards:
                  - type: custom:button-card
                    template: card_graph
                    variables:
                      ulm_card_graph_color: "var(--google-red)"
                      ulm_card_graph_name: Temperatuur
                      ulm_card_graph_entity: sensor.temp_tesla

2 Likes

How do you manage your power?

I have another question. Which colors are allowed to set up for the room card? Currently i set my default colors for the room card with the _no_state variable.!

schlaf

- type: 'custom:button-card'
                template:
                  - card_room
                  - blue_no_state
                name: Schlafzimmer

but if I want silver instead of blue for example, then I get an error.

silver

My question is: Is that the method we should set the color for this, or should that be the color if the entity has no state? If yes → Which colors are allowed for the rooms? Is there a list? If no → Where should I set the color for this in the correct way?

Just have to graph cards in order to display the current value from my SMA inverter in W as well the daily rate.

Don’t have a smartmeter yet in order to monitor also the grid + house consumption, still on the buy list :smiley:
image

But thank you very much for sharing the code

1 Like

Good day. Looking for some guidance on how to automatically change themes ( day or night).

Below command does nothing

service: frontend.set_theme
data:
  name: minimalist-mobile
  mode: dark

only way I’ve been able to make it work is by splitting the theme file into a minimalist-mobile-light and minimalist-mobile-dark and calling those files.

Perhaps I’m missing something when calling the service?

Thank you.

I see two issues.

In your ui-lovelace.yaml you need to delete lines 7-16. Its not needed. You only need lines 1-6.

Looks like the “views” folder is a subfolder under dashboard. You need to move that up one level. Should look something like this:

Config:
-- ui-lovelace-minimalist
   -- custom_cards
   -- dashboard
       - ui-lovelace.yaml
   -- views
       - 01_home.yaml
       - 02_room.yaml
       - etc

What do I need to change for Lovelace UI-Minimalist to take up the entire length of my tablet screen?
I’m stuck on a smartphone format.

@xXkr13g3rXx

take a look at the colors folder following the path below:

config/custom_components/ui_lovelace_minimalist/lovelace/ulm_templates/card_templates/colors/

there you can find the correct color and state combinations

1 Like

I have something similar for my Tesla (it’s a WIP). The icon in the status card changes depending on state. It also pulsates every second when charging, every 5 seconds when sleeping and spins when driving.

4 Likes

Hi billyjoebob999,
thanks again.
During my investigation I found that also StudioCodeServer add-on is not working properly :man_facepalming:t2:
The autocompletion and other functions are not working.
Could the reason be that I have Home Assistant OS installed on Virtualbox on a Windows PC?

After solving this issue with StudioCode I can come back to the yaml files and my dashboards.
Thanks a lot.

Mind sharing the code? thx in advance!

How did you do the sidebar and how do you use it? Are they all navigation to different views? What about the chips in the bottom left?

Hello all

Do you know if exists a way to slide to view ?
Situation, I split my dashboard in many views - one for room -
index.yaml is my home view, inside I have navigation buttons. It’s work very well
But I’m asking if there is a way to slide to right to view2, then slide to right to view3 etc. And same way, slide to left to return to view1, slide to left to return to index ?

Thanks

Do you have screenshots?

Have it now adjusted for my setup:

There is still one script button missing near the “Max Range Switch” in order to adjust the Charging AMPs and disable my automations for solar charing, but still to lazy to write the script for that topic…

#Tesla Card
    - type: horizontal-stack
      cards: 
        - type: custom:button-card
          template: edge
        - type: custom:button-card
          show_icon: false
          show_name: false
          show_label: false
          styles:
            grid:
              - grid-template-areas: "'item1 item1' 'item2 item2' 'item3 item3' 'item4 item4' 'item5 item5'"
              - grid-template-columns: 1fr 1fr
              - grid-template-rows: "min-content min-content min-content"
              - row-gap: 10px
            card:
              - border-radius: var(--border-radius)
              - box-shadow: var(--box-shadow)
              - padding: 10px
          custom_fields:
            item1:
              card:
                type: custom:button-card
                template: card_title
                name: Tesla | MY von Christoph
                label: '[[[ return "Es hat " + states["sensor.tesla_model_y_temperature_sensor_inside"].state + "°C im Auto." ]]]'
            item2:
              card:
                type: custom:button-card
                entity: device_tracker.tesla_model_y_location_tracker
                show_entity_picture: true
                show_icon: false
                show_name: false
                entity_picture: /local/pictures/Tesla_ModelY.png
                style:
                  - padding: 0px
                styles:
                  card:
                    - box-shadow: "none"
                  entity_picture:
                    - width: 100%
                    - padding-bottom: 0%
            item3:
              card:
                type: custom:button-card
                template: list_2_items
                custom_fields:
                  item1:
                    card:
                      type: custom:button-card
                      template: card_power_outlet
                      entity: switch.tesla_model_y_sentry_mode_switch
                      name: Sentry Mode
                      styles:
                        card:
                          - box-shadow: "none"  
                  item2:
                    card:
                      type: custom:button-card
                      template: card_binary_sensor
                      entity: binary_sensor.tesla_model_y_parking_brake_sensor
                      styles:
                        card:
                          - box-shadow: "none"  
            item4:
              card:
                type: custom:button-card
                template: list_2_items
                custom_fields:
                  item1:
                    card:
                      type: custom:button-card
                      template: card_graph
                      variables:
                        ulm_card_graph_color: "var(--google-blue)"
                        ulm_card_graph_entity: sensor.tesla_model_y_battery_sensor
                        ulm_card_graph_hours: 60
                        ulm_card_graph_type: bar
                        ulm_card_graph_name: Akku
                      styles:
                        card:
                          - box-shadow: "none"
 
                  item2:
                    card:
                      type: custom:button-card
                      template: card_graph
                      variables:
                        ulm_card_graph_color: "var(--google-green)"
                        ulm_card_graph_entity: sensor.tesla_model_y_range_sensor
                        ulm_card_graph_hours: 60
                        ulm_card_graph_name: Reichweite
                        ulm_card_graph_type: bar
                      styles:
                        card:
                          - box-shadow: "none"
            item5:
              card:
                type: custom:button-card
                template: card_script
                variables:
                  ulm_card_script_title: 'Maximal Reichweite'
                  ulm_card_script_icon: 'mdi:connection'
                tap_action:
                  action: call-service
                  service: script.turn_on
                  service_data:
                    entity_id: script.tesla_set_charing_limit_to_100
                styles:
                  card:
                    - box-shadow: "none"
        - type: custom:button-card
          template: edge

Thanks again for sharing your view. Maybe this is also inspiration for others. For me this is enough the rest of the controls i can do over the Tesla mobile app

15 Likes

This is what I’ve managed to get so far input time changes randomly. Not sure why.

1 Like

Thanks for the code, I didn’t know how to do this with button-card.
I love your Power view by the way, it’d work very well on a tablet.