setup help please?

[Ni3kjm]

Just switching over from wallpanel screensaver,

I've got my local media backgrounds working fine and stopped the info box movement but i was trying to get the info box transparent and to add some extra entities, but having issues as its not letting me add any cards to add some numerical entities, or time&date, anyone able to advise? its only showing the weather box and nothing else. thanks

wallpanel:
  enabled: true
  debug: false
  hide_toolbar: false
  hide_sidebar: false
  fullscreen: false
  idle_time: 20
  keep_screen_on_time: 86400
  black_screen_after_time: 7200
  control_reactivation_time: 1
  screensaver_stop_navigation_path: /lovelace/dash
  image_url: media-source://media_source
  image_fit: cover
  image_list_update_interval: 3600
  image_order: random
  image_excludes: []
  show_exif_info: false
  fetch_address_data: true
  exif_info_template: >-
    ${address.town|address.city!prefix=!suffix= //
    }${DateTimeOriginal!options=year:numeric,month:long}
  screensaver_entity: input_boolean.wallpanel_screensaver
  info_animation_duration_x: 0
  info_animation_duration_y: 0
  info_animation_timing_function_x: ease-in-out
  info_animation_timing_function_y: ease-in-out
  info_move_pattern: random
  info_move_interval: 60
  info_move_fade_duration: 2
style:
  wallpanel-screensaver-container:
    background-color: '#333333dd'
  wallpanel-screensaver-info-box:
    '--wp-card-width': 450px
    background-color: '#ffffff99'
    box-shadow: >-
      0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14),
      0px 1px 3px 0px rgba(0, 0, 0, 0.12)
  wallpanel-screensaver-info-box-content:
    '--ha-card-background': none
    '--ha-card-box-shadow': none
    '--primary-background-color': '#fafafa'
    '--secondary-background-color': '#e5e5e5'
    '--primary-text-color': '#212121'
    '--secondary-text-color': '#727272'
  badges:
    - entity: person.somebody
    - entity: sun.sun
  cards:
    - type: markdown
      content: Card 1
      wp_style:
        width: 810px
        grid-row: 1
        grid-column: 1 / span 2
    - type: markdown
      content: Card 2
      wp_style:
        width: 400px
        grid-row: 2
        grid-column: 2
    - type: markdown
      content: Card 3
      wp_style:
        width: 400px
        grid-row: 3
        grid-column: 1
    - type: markdown
      content: Card 4
      wp_style:
        width: 400px
        grid-row: 3
        grid-column: 2

[j-a-n]

Could you please edit your comment and put the configuration YAML in a code block? See https://docs.github.com/en/get-started/writing-on-github/working-with-advanced-formatting/creating-and-highlighting-code-blocks

[Ni3kjm]

Not sure if I've done that right

[j-a-n]

No, please use three backticks ```

[Ni3kjm]

Sorry struggled to find it on mobile to update

[j-a-n]

Looks much better now. You have badges and cards beneath style. You have to move it up one level (remove 2 spaces of indentation).

[j-a-n]

Sorry, indentation of badges and cards seems to be correct, but the style block needs two spaces additional indentation.

[j-a-n]

Your corrected config:

wallpanel:
  enabled: true
  debug: false
  hide_toolbar: false
  hide_sidebar: false
  fullscreen: false
  idle_time: 20
  keep_screen_on_time: 86400
  black_screen_after_time: 7200
  control_reactivation_time: 1
  screensaver_stop_navigation_path: /lovelace/dash
  image_url: media-source://media_source
  image_fit: cover
  image_list_update_interval: 3600
  image_order: random
  image_excludes: []
  show_exif_info: false
  fetch_address_data: true
  exif_info_template: >-
    ${address.town|address.city!prefix=!suffix= //
    }${DateTimeOriginal!options=year:numeric,month:long}
  screensaver_entity: input_boolean.wallpanel_screensaver
  info_animation_duration_x: 0
  info_animation_duration_y: 0
  info_animation_timing_function_x: ease-in-out
  info_animation_timing_function_y: ease-in-out
  info_move_pattern: random
  info_move_interval: 60
  info_move_fade_duration: 2
  style:
    wallpanel-screensaver-container:
      background-color: '#333333dd'
    wallpanel-screensaver-info-box:
      '--wp-card-width': 450px
      background-color: '#ffffff99'
      box-shadow: >-
        0px 2px 1px -1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14),
        0px 1px 3px 0px rgba(0, 0, 0, 0.12)
    wallpanel-screensaver-info-box-content:
      '--ha-card-background': none
      '--ha-card-box-shadow': none
      '--primary-background-color': '#fafafa'
      '--secondary-background-color': '#e5e5e5'
      '--primary-text-color': '#212121'
      '--secondary-text-color': '#727272'
  badges:
    - entity: person.somebody
    - entity: sun.sun
  cards:
    - type: markdown
      content: Card 1
      wp_style:
        width: 810px
        grid-row: 1
        grid-column: 1 / span 2
    - type: markdown
      content: Card 2
      wp_style:
        width: 400px
        grid-row: 2
        grid-column: 2
    - type: markdown
      content: Card 3
      wp_style:
        width: 400px
        grid-row: 3
        grid-column: 1
    - type: markdown
      content: Card 4
      wp_style:
        width: 400px
        grid-row: 3
        grid-column: 2