🌻 Lovelace UI • Minimalist

LaUr3nTiU · October 3, 2023, 3:41pm

I want to do some sort of a adaptive dashboard in the sense that for wide displays I’ll display 3 cards, while for narrower displays only 2 (hiding the 3rd one).

Just by using grid-template-areas, it doesn’t seem possible that I can hide a card named by a grid-area entry. Am I getting this wrong? Or what’s the approach to hide/show some cards for a certain display width?

edit: I know I can use extra_styles and css to hide it, but I was wondering if there’s a way to make use of the grid configuration yaml.

andyblac · October 3, 2023, 6:49pm

try using state-switch

LaUr3nTiU · October 3, 2023, 8:01pm

Hmmm, I was able to switch between displaying 2 cards/entities depending on the width of the display, but I’m having a hard time figuring out how to set the narrow card to be empty.

For example

          - view_layout:
              grid-area: "card5"
            type: custom:state-switch
            entity: mediaquery
            states:
              "(min-width: 1000px)":
                type: markdown
                content: more than 1000 px
              "all":
                type: "custom:button-card"
                template: "card_generic"
                entity: light.office

This switches between the text and the light switch, but I’d like “all” to be empty instead, but it expects an element.

andyblac · October 3, 2023, 9:00pm

don’t use the all state, just remove it .

bbwebb · October 6, 2023, 2:02am

Working on my first dashboard, and still pretty new to Home Assistant. Making good progress on my dashboard, but having a problem trying to change an icon in the Room Card. Specifically I’m trying to change one of the entities to have an icon that is different from what is assigned to the entity. Here is my yaml:

              entity_2:
                entity_id: cover.master_bedroom_slider
                icon: mdi:arrow-up-bold
                templates:
                  - green_on
                tap_action:
                  action: call-service
                  service: cover.open_cover
                  service_data:
                    entity_id: cover.master_bedroom_slider

I’m trying to change the ‘cover’ icon to be an up arrow (mdi:arrow-up-bold)

Any help is appreciated!

Bill

andyblac · October 6, 2023, 9:51am

that is not supported in the default room card, but take a look at my custom room card, it has loads of additional features.

https://community.home-assistant.io/t/my-custom-cards-for-minimalist-ui

I be happen to help in that thread i you need help settingup, or have any questions

bbwebb · October 6, 2023, 11:06am

Thanks! Checking it out now.

nukleuz80 · October 6, 2023, 2:45pm

Hi there,
i’m working on my first simple custom card.

This is what i have, but i need the state under the friendly name:

Here is the template:

---
custom_card_test:
  template:
    - "icon_info_bg"
  show_name: true
  show_state: true
  show_label: false
  show_icon: true
  show_last_changed: false
  variables:
    ulm_custom_card_jb_test_icon_on: ""
    ulm_custom_card_jb_test_icon_off: ""
    ulm_custom_card_jb_test_icon_tilt: ""
    ulm_custom_card_jb_test_color_background: ""

  icon: >
    [[[ 
        if (entity.state == "Offen") 
        return variables.ulm_custom_card_jb_test_icon_on;

        if (entity.state == "Gekippt") 
        return variables.ulm_custom_card_jb_test_icon_tilt;

        else return variables.ulm_custom_card_jb_test_icon_off; 
    ]]]

Here is the card:

  - type: custom:button-card
    entity: sensor.wohnzimmer_tur_advanced
    template: custom_card_test
    name: WZ Tilted
    variables:
      ulm_custom_card_jb_test_icon_on: "mdi:door-open"
      ulm_custom_card_jb_test_icon_off: "mdi:door-closed"
      ulm_custom_card_jb_test_icon_tilt: "mdi:door-sliding"

I don’t get it… Thanks

andyblac · October 6, 2023, 5:12pm

you do this using styles

ie

  styles:
    state:
      - justify-self: "start"
      - font-size: "15px"
      - margin-left: "33%"
      - margin-top: "0%"
      - max-width: "65%"
      - text-overflow: "ellipsis"
      - overflow: "hidden"

nukleuz80 · October 6, 2023, 7:24pm

Thanks for the hint…
I had to change the grid from label to state:

  styles:
    grid:
      - grid-template-areas: '"i n"  "i s"'

Zixten · October 7, 2023, 3:26pm

Hi I’m running Home Assistant 2023.9.3 with the latest version of Minimalist.
It’s been a while since i started my custom dashboard and now I have some time to work some more on it.
Then i Noticed that I have these ugly borders now.
screen
I found that there is a fix and I see that is has been implemented

 # fix added border-lines in 2022.11
  ha-card-border-width: "0px"

Yet it does not work Have been googling and trying all sorts of fixes I found but no luck.
Any one been having tha same problem?

drashish87 · October 8, 2023, 9:06am

You can do this for any entity by following the below!

Developer tool > states > search your entity in your case cover.master_bedroom_slider > click on " i " icon below it > click on the gear icon > you will get icon option to change it!

andyblac · October 8, 2023, 9:28am

you can. but doing so, will stop the state icon changing, it will become a static icon.

drashish87 · October 8, 2023, 9:33am

Mine are working fine,I am using the default room cards.

max5962 · October 10, 2023, 2:45pm

Awesome, can you share the code when you finished it ? please

captaincanada · October 10, 2023, 7:37pm

Great Dashboard!
How did you put the swipe card with the camera entities into minimalist and how is the schedule card working?

thanks for any help

jalejandro0211 · October 15, 2023, 9:24pm

Excuse me, one Q, where I have to locate/put the template section?

nikno · October 16, 2023, 8:22am

My first trials to get tabs to work…

Not sure what I am doing wrong here…all I get is an empty dashboard!?

I have follow the description for adding tabs as it it described here:
https://ui-lovelace-minimalist.github.io/UI/setup/customizing/#how-to-customize-the-dashboard

Currently the yaml file looks something like this (where I expect 2 tabs to show up one “Main” and one “Vito”:

button_card_templates: !include_dir_merge_named "../../custom_components/ui_lovelace_minimalist/__ui_minimalist__/ulm_templates/"
title: "Home trials"
theme: "minimalist-desktop"
background: "var(--background-image)"


views:
  - title: "Main"
    path: 0
    icon: "mdi:home"
    cards:
      - type: vertical-stack
        cards:
    ##########
    ########## TOP CHIPS/PILLS
    ##########
          - type: horizontal-stack
            cards:
################### REMOVED STUFF

  - title: "Vito"
    path: vito
    icon: "mdi:car"
    cards:
      - type: vertical-stack
        cards:
    ##########
    ########## TOP CHIPS/PILLS
    ##########

################### REMOVED STUFF

cosminhriscu · October 16, 2023, 8:30pm

Hi,
I’m working at an adaptive dashboard version for my tablet and I don’t know why, my dashboard is loading very slow. I double checked the code and it seems fine. Does anyone have an ideea why it is working slow and also, after a few minutes it crashes, especially when I’m in Home page? HASS is running on a virtual machine on Synology. I tried on MS Edge, Google Chrome. On FullyKioskBrowser it is even worse. Also I tried on a iPad with HA Companion app, and again it is worse. It could be because I used horizontal-stack in a vertical-stack, some kind of stack-in-stack on a single grid-area? I didn’t used this on all views, but all views are loading very slowly.

slow ui best

IssaSFX · October 17, 2023, 12:12pm

how do you center the entities like adblue inspektion licht usw