🔹 Browser_mod - turn your browser into a controllable device, and a media_player

[smeen89]

Hi,

I’ve been scratching my head trying to remove the padding on the pop up by changing the following settings in browser_mod.js

      .content .container {
        padding: 8px 24px 20px 24px;
      }
      :host([card]) .content .container {
        padding: 8px 8px 20px 8px;
      }

The end goal is to remove the irritating white “border” around this card:

But it does not seem to work, when I inspect the element the padding is back. I’ve tried clearing my cache, styling it with card mod, but to no avail. Any help would be much appreciated!

[houser]

Excellent and valuable mod. Many thanks to devs!
Would appreciate a comment on browser-mod sequences and if there are limitations on what can be used in them.
This fire-dom-event button works to navigate the current browser as it should:

show_name: true
show_icon: true
type: button
tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.navigate
    data:
      path: /apple-tv-swipe-1/0
name: complete call
icon: mdi:apple

The button with a sequence of two services below does not work so far. Both services work on their own.
I want to navigate the browser that makes the call and then run a script from one button.
Can I do that? I assume a sequence is a browser call?
If so what am I doing wrong, as this is not working yet.
Any hints would be much appreciated!

show_name: true
show_icon: true
type: button
tap_action:
  action: fire-dom-event
  service: browser_mod.sequence
  data: null
  sequence:
    - service: browser_mod.navigate
      data:
        path: /apple-tv-swipe-1/0
    - action: call-service
      service: script.atv_single
      target: {}
name: dev fire-dom seq 1
icon: mdi:apple
entity: input_boolean.atv_nav_source_state

[Rico81 (Enrico)]

Hey guys

I’ve got a popup card with blurred background (of the whole screen) and I now want to modify the popup card with a colored font and maybe with a bigger font.
I tried various versions but couldn’t get it working.

dismissable: true
autoclose: false
content: Tonne rausstellen!
title: Morgen ist Müllabfuhr
card_mod:
  style:
    ha-dialog$: |
      div.mdc-dialog div.mdc-dialog__scrim {
        backdrop-filter: blur(3px) !important;
        background-color: transparent !important;
      }

Can anyone help me please?

[VietNgoc (Ngoc John)]

Add to the theme config dialog-backdrop-filter: blur(12px) brightness(0.3)

[Rico81 (Enrico)]

You’re talking about templates, correct?
Actually I’m not using theme templates.
Is there no way to add this to the respective card?

[VietNgoc (Ngoc John)]

Home Assistant Frontend

[Rico81 (Enrico)]

I’m afraid with these little bits of info I am unabe to comply.
So unless you don’t tell me what I have to do in my specific case, this help is not what I need.
I’m not that skilled.
Sorry

[KingFisher]

Is it possible to load another “tab” into the pop-up?

[Protoncek (Pavel)]

Try with tabbed card (available in HACS). I didn’t try it myself, but it’s worth checking…

[ASNNetworks]

Yes, I use this combination since tabbed card exists. Works great for my media remotes, easy switching between TV and AppleTV remote by selecting the tab in the popup

[KingFisher]

thanks @Protoncek & @ASNNetworks for your help! I think, I may not have worded my question / ask clearly enough…what I’m trying to achieve is:
When I click on an area, HA goes to a seperate page (for a room) with all the lights/ speaker/ plus etc. What I would like to achive is load that page into the popup.

[ASNNetworks]

But everything from that view inside a vertical-stack and then use that vertical-stack as the popup.

[KingFisher]

Got it @ASNNetworks - that’s what I’ve started to do - was just looking to see if I could save myself some copy & paste work
again, thanks for taking the time to reply!

[andyblac (Andy Blackburn)]

does anyone know how I can reduce this gap here,

move the green area up, so it looks more like this.

[tiwo_3d (Timo Wozasek)]

Hello,
I want to create a SMALL Popup. I tried nearly everything. But i’m not able to create a SMALL Popup in my mobile. Ist’s always in fullscreen.
Here ist my Code:

show_name: true
show_icon: true
type: button
tap_action:
  action: fire-dom-event
  browser_mod:
    service: browser_mod.popup
    data:
      title: The title
      content: The content
      right_button: Right button
      left_button: Left button
      style:
        ha-dialog$: |
          @media (max-width: 450px), (max-height: 500px) {
            div.mdc-dialog div.mdc-dialog__container {
              align-items: end;
              padding-bottom: 10px;
            }
          }
name: Reset
icon: phu:vac_sbrush

And this is the result

[ASNNetworks]

No need in trying, this is a bug since a few HA updates ago. There are multiple tickets about this on Github: Popup is stretched to the entire window in the android app home assistant · Issue #606 · thomasloven/hass-browser_mod (github.com)

On the link from that ticket, there is a fork someone made, that does fix it temporarily. I tried it myself just now and it works. Good option till the official one is fixed.

[CharlesW1]

The media player entity is unavailable on my iPad and android device.The camera entity is available ,but it always shows broken stream icon.How could I solve these issue?

[funbobby]

Is it possible to open a popup from another popup and if the last popup is dismissed or perhaps another button press is triggered, to have the first popup appear instead of closing all the popups and returning to the main screen?

[le_top]

Is there a way to add browser_mod to a notification group?

I tried:

notify:
  - platform: group
    name: "Mario"
    services:
      - service: mobile_app_sm_a125f
      - service: browser_mod
        target:
          device_id: dc95787473bc2c8d8b590b3e5ae71f0c

But I did not get a notification in my browser.

The log shows:

homeassistant.exceptions.ServiceNotFound: Unable to find service notify.browser_mod

So I guess the service should be called notify.browser_mod and not browser_mod.notification though the latter should be maintained for backward compatibility.

[potts-mike]

With browser mod two, I am trying to do a popup on the current device and am not having any luck. What am I missing? THe below code is working on the laptop that I coded it on but I need it to work from the browser that it is being activated from.

type: tile
name: Basement Sync Box
icon: ''
show_entity_picture: false
tap_action:
  action: toggle
vertical: false
entity: switch.basement_sync_box_light_sync
icon_tap_action:
  action: call-service
  service: browser_mod.popup
  target: {}
  data:
    dismissable: true
    autoclose: false
    content:
      type: vertical-stack
      cards:
        - type: entities
          entities:
            - entity: number.basement_sync_box_brightness
              name: 'Brightness '
            - entity: select.basement_sync_box_hdmi_input
            - entity: select.basement_sync_box_intensity
            - entity: switch.basement_sync_box_light_sync
              name: Light Sync
            - entity: select.basement_sync_box_sync_mode
          state_color: true
        - show_name: true
          show_icon: false
          type: custom:button-card
          tap_action:
            action: call-service
            service: browser_mod.close_popup
            target:
              entity_id: binary_sensor.elv_chrome
          name: Exit