Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Issue with height of popup #345

Closed
4 tasks done
deadlypantsd opened this issue Jul 25, 2022 · 1 comment
Closed
4 tasks done

Issue with height of popup #345

deadlypantsd opened this issue Jul 25, 2022 · 1 comment

Comments

@deadlypantsd
Copy link

My Home Assistant version: 2022.7.5

What I am doing:
Popup to display entities and gauges

What I expected to happen:
Popup card to be rendered with content to fit

What happened instead:
Content renders in popup, with scrollbar. See Screenshot

Minimal steps to reproduce:
insert below yaml

# The least amount of code or steps possible to reproduce my error
action: fire-dom-event
browser_mod:
  command: popup
  title: NAS
  style:
    .: |
      :host {
        --ha-card-border-radius: 0;
      }
      @media screen and (min-width: 1200px) {
        :host .content {
          width: calc(385px + 385px + 385px);
          height: fit-content !importatant;
          max-width: 90vw;
          max-height: 90vh;
          
        }
      }
    layout-card:
      $grid-layout:
        $:
          hui-entities-card:
            $: |
              .card-content {
                padding: var(--card-content-padding);
                padding-bottom: 0.8em;
              }
              ha-card {
                border-right: 1.5px solid rgba(0, 0, 0, 0.2);
                border-radius: 0;
                transition: none;
                letter-spacing: normal;
              }
              /* portrait */
              @media screen and (max-width: 1200px) {
                ha-card {
                  border-right: none;
                  border-bottom: 1.5px solid rgba(0, 0, 0, 0.2);
                }
              }
            $hui-horizontal-stack-card:
              $: |
                #root {
                  justify-content: space-evenly;
                  margin-top: 1.7em;
                  max-width: 82vw; /* iphonex */
                }
  card:
    type: custom:layout-card
    layout_type: custom:grid-layout
    layout:
      margin: 0
      grid-template-columns: 385px 385px 385px
      grid-template-areas: |
        "system network storage ."
        mediaquery:
        #portrait
        "(max-width: 1200px)":
          grid-template-columns: 1fr
          grid-template-rows: 2fr
          grid-template-areas: |
            "system"
            "network"
            "storage"
    cards:
      #################################################
      #                                               #
      #                    SYSTEM                     #
      #                                               #
      #################################################

      - type: grid
        grid-area: system
        square: false
        columns: 1
        cards:
          - type: grid
            square: false
            columns: 3
            cards:
              - type: gauge
                entity: sensor.vstor_89_cpu_used
                name: CPU
                unit: "%"
                needle: false
              - type: gauge
                entity: sensor.vstor_89_ram_used_percent
                name: RAM
                unit: "%"
                needle: false
              - type: gauge
                entity: sensor.vstor_89_swap_used_percent
                name: Swap
                unit: "%"
                needle: false
          - type: entities
            entities:
              - entity: sensor.vstor_89_uptime
                name: Uptime
                icon: mdi:clock
      #################################################
      #                                               #
      #                   NETWORK                     #
      #                                               #
      #################################################

      - type: grid
        grid-area: network
        square: false
        columns: 2
        cards:
          - type: sensor
            hours_to_show: 24
            graph: line
            entity: sensor.vstor_89_download_speed
            detail: 2
            unit: Mib/s
            icon: mdi:arrow-down-bold
            name: Down
          - type: sensor
            hours_to_show: 24
            graph: line
            entity: sensor.vstor_89_upload_speed
            detail: 2
            unit: Mib/s
            icon: mdi:arrow-up-bold
            name: Up
      #################################################
      #                                               #
      #                    STORAGE                    #
      #                                               #
      #################################################

      - type: grid
        grid-area: storage
        square: false
        columns: 1
        cards:
          - type: grid
            square: false
            columns: 3
            cards:
              - type: gauge
                entity: sensor.vstor_89_data_hdd_used_percent
                name: HDD
                unit: "%"
                needle: false
              - type: gauge
                entity: sensor.vstor_89_data_ssd_used_percent
                name: SSD
                unit: "%"
                needle: false
              - type: gauge
                entity: sensor.vstor_89_data_nvme_used_percent
                name: MythTV
                unit: "%"
                needle: false
          - entity: sensor.vstor_89_hdd_diskio
            icon: mdi:harddisk
            type: custom:multiple-entity-row
            name: HDD I/O
            entities:
              - entity: sensor.vstor_89_hdd_diskio_rb
                name: read
              - entity: sensor.vstor_89_hdd_diskio_wb
                name: write
              - entity: sensor.vstor_89_hdd_diskio_rc
                name: read/s
              - entity: sensor.vstor_89_hdd_diskio_wc
                name: write/s
          - entity: sensor.vstor_89_ssd_diskio
            icon: mdi:harddisk
            type: custom:multiple-entity-row
            name: SSD I/O
            entities:
              - entity: sensor.vstor_89_ssd_diskio_rb
                name: read
              - entity: sensor.vstor_89_ssd_diskio_wb
                name: write
              - entity: sensor.vstor_89_ssd_diskio_rc
                name: read/s
              - entity: sensor.vstor_89_ssd_diskio_wc
                name: write/s
          - entity: sensor.vstor_89_nvme_diskio
            icon: mdi:harddisk
            type: custom:multiple-entity-row
            name: mythTV I/O
            entities:
              - entity: sensor.vstor_89_nvme_diskio_rb
                name: read
              - entity: sensor.vstor_89_nvme_diskio_wb
                name: write
              - entity: sensor.vstor_89_nvme_diskio_rc
                name: read/s
              - entity: sensor.vstor_89_nvme_diskio_wc
                name: write/s
          - entity: sensor.vstor_89_used
            icon: mdi:harddisk
            type: custom:multiple-entity-row
            name: boot I/O
            entities:
              - entity: sensor.vstor_89_nvme_diskio_rb
                name: read
              - entity: sensor.vstor_89_nvme_diskio_wb
                name: write
              - entity: sensor.vstor_89_nvme_diskio_rc
                name: read/s
              - entity: sensor.vstor_89_nvme_diskio_wc
                name: write/s
          - type: custom:gap-card

# Put your code/steps here

Error messages from the browser console:
None

// Select everything from the browser console and copy it
CARD-MOD 3.1.5 IS INSTALLED
browser_mod.js:1 Event {isTrusted: false, detail: 'connected', type: 'connection-status', target: Window, currentTarget: Window, …}
simple-thermostat.js:285 simple-thermostat: 2.4.3
kiosk-mode.js:64 ≡ kiosk-mode            ⋮ 
version 1.7.3            
button-card.js:425   BUTTON-CARD   Version 3.4.2 
bar-card.js:4855   BAR-CARD   Version 3.1.7    
mwc-list-item-base.ts:224 
        
      
        
        
      
        
      
       
        
       GET https://ha.dragontechcomputers.com/hacsfiles/light-entity-card/light-entity-card.js net::ERR_ABORTED 404 (Not Found)
(anonymous) @ mwc-list-item-base.ts:224
r @ mwc-list-item-base.ts:224
a @ mwc-list-item-base.ts:224
(anonymous) @ ha-icon-button-arrow-next.ts:8
a @ ha-icon-button-arrow-next.ts:8
(anonymous) @ ha-panel-lovelace.ts:144
Promise.then (async)
value @ ha-panel-lovelace.ts:144
c @ browser_mod.js:1
await in c (async)
(anonymous) @ browser_mod.js:90
load (async)
(anonymous) @ browser_mod.js:90
(anonymous) @ browser_mod.js:90
mwc-list-item-base.ts:224 
        
      
        
        
      
        
      
       
        
       GET https://ha.dragontechcomputers.com/hacsfiles/lovelace-xiaomi-vacuum-map-card/xiaomi-vacuum-map-card.js net::ERR_ABORTED 404 (Not Found)
(anonymous) @ mwc-list-item-base.ts:224
r @ mwc-list-item-base.ts:224
a @ mwc-list-item-base.ts:224
(anonymous) @ ha-icon-button-arrow-next.ts:8
a @ ha-icon-button-arrow-next.ts:8
(anonymous) @ ha-panel-lovelace.ts:144
Promise.then (async)
value @ ha-panel-lovelace.ts:144
c @ browser_mod.js:1
await in c (async)
(anonymous) @ browser_mod.js:90
load (async)
(anonymous) @ browser_mod.js:90
(anonymous) @ browser_mod.js:90
mwc-list-item-base.ts:224 
        
      
        
        
      
        
      
       
        
       GET https://ha.dragontechcomputers.com/hacsfiles/fan-control-entity-row/fan-control-entity-row.js net::ERR_ABORTED 404 (Not Found)
(anonymous) @ mwc-list-item-base.ts:224
r @ mwc-list-item-base.ts:224
a @ mwc-list-item-base.ts:224
(anonymous) @ ha-icon-button-arrow-next.ts:8
a @ ha-icon-button-arrow-next.ts:8
(anonymous) @ ha-panel-lovelace.ts:144
Promise.then (async)
value @ ha-panel-lovelace.ts:144
c @ browser_mod.js:1
await in c (async)
(anonymous) @ browser_mod.js:90
load (async)
(anonymous) @ browser_mod.js:90
(anonymous) @ browser_mod.js:90
apexcharts-card.js:835  APEXCHARTS-CARD  v2.0.1 
layout-card.js:228 LAYOUT-CARD 2.4.2 IS INSTALLED
multiple-entity-row.js:1  MULTIPLE-ENTITY-ROW  4.4.1 
slider-button-card.js:497   SLIDER-BUTTON-CARD  v1.10.9 
swipe-card.js:21    SWIPE-CARD   Version 4.0.0 
slider-entity-row.js:1 
        
       The main 'lit-element' module entrypoint is deprecated. Please update your imports to use the 'lit' package: 'lit' and 'lit/decorators.ts' or import from 'lit-element/lit-element.ts'. See https://lit.dev/msg/deprecated-import-path for more information.
(anonymous) @ slider-entity-row.js:1
slider-entity-row.js:59 SLIDER-ENTITY-ROW 17.2.1 IS INSTALLED 
mwc-list-item-base.ts:224 
        
       Uncaught (in promise) https://ha.dragontechcomputers.com/hacsfiles/light-entity-card/light-entity-card.js
n.onerror @ mwc-list-item-base.ts:224
error (async)
(anonymous) @ mwc-list-item-base.ts:224
r @ mwc-list-item-base.ts:224
a @ mwc-list-item-base.ts:224
(anonymous) @ ha-icon-button-arrow-next.ts:8
a @ ha-icon-button-arrow-next.ts:8
(anonymous) @ ha-panel-lovelace.ts:144
Promise.then (async)
value @ ha-panel-lovelace.ts:144
c @ browser_mod.js:1
await in c (async)
(anonymous) @ browser_mod.js:90
load (async)
(anonymous) @ browser_mod.js:90
(anonymous) @ browser_mod.js:90
mwc-list-item-base.ts:224 
        
       Uncaught (in promise) https://ha.dragontechcomputers.com/hacsfiles/lovelace-xiaomi-vacuum-map-card/xiaomi-vacuum-map-card.js
n.onerror @ mwc-list-item-base.ts:224
error (async)
(anonymous) @ mwc-list-item-base.ts:224
r @ mwc-list-item-base.ts:224
a @ mwc-list-item-base.ts:224
(anonymous) @ ha-icon-button-arrow-next.ts:8
a @ ha-icon-button-arrow-next.ts:8
(anonymous) @ ha-panel-lovelace.ts:144
Promise.then (async)
value @ ha-panel-lovelace.ts:144
c @ browser_mod.js:1
await in c (async)
(anonymous) @ browser_mod.js:90
load (async)
(anonymous) @ browser_mod.js:90
(anonymous) @ browser_mod.js:90
mwc-list-item-base.ts:224 
        
       Uncaught (in promise) https://ha.dragontechcomputers.com/hacsfiles/fan-control-entity-row/fan-control-entity-row.js
n.onerror @ mwc-list-item-base.ts:224
error (async)
(anonymous) @ mwc-list-item-base.ts:224
r @ mwc-list-item-base.ts:224
a @ mwc-list-item-base.ts:224
(anonymous) @ ha-icon-button-arrow-next.ts:8
a @ ha-icon-button-arrow-next.ts:8
(anonymous) @ ha-panel-lovelace.ts:144
Promise.then (async)
value @ ha-panel-lovelace.ts:144
c @ browser_mod.js:1
await in c (async)
(anonymous) @ browser_mod.js:90
load (async)
(anonymous) @ browser_mod.js:90
(anonymous) @ browser_mod.js:90
browser_mod.js:145 BROWSER_MOD 1.5.3 IS INSTALLED    DeviceID: 971e7717-74dad86d

// Paste it here

I know there are missing JS files. This is not the issue


By replacing the space in the checkboxes ([ ]) with an X below, I indicate that I:

  • Understand that this is a channel for reporting bugs, not a support forum (https://community.home-assistant.io/).

  • Have made sure I am using the latest version of the plugin.

  • Have followed the troubleshooting steps of the "Common Problems" section of 2022-07-25 15_40_06-Clipboard.

  • Understand that leaving one or more boxes unticked or failure to follow the template above may increase the time required to handle my bug-report, or cause it to be closed without further action.

@thomasloven
Copy link
Owner

Closed because of Browser Mod 2.0 release.
Please see #354.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants