DBuit / sidebar-card

406 stars 39 forks source link

New sidebar remains black #46

Closed steveuk23 closed 10 months ago

steveuk23 commented 2 years ago

Hi. I've installed this through hacs and created a new dashboard just to test this. So as far as i understand all i need to do is add all my config into the Raw configuration editor of my dashboard so i copied your example code and pasted it right at the top but it's only displaying a black sidebar with nothing else showing. This is what's in my raw configuration editor.. Could you tell me where i'm going wrong Thanks

sidebar:
  width:
    mobile: 0
    tablet: 25
    desktop: 20
  digitalClock: true
  hideTopMenu: false
  style: |
    :host {
        --sidebar-background: #FFF;
        --sidebar-text-color: #000;
        --face-color: #FFF;
        --face-border-color: #FFF;
        --clock-hands-color: #000;
        --clock-seconds-hand-color: #FF4B3E;
        --clock-middle-background: #FFF;
        --clock-middle-border: #000;
    }
  template: |
    <li>
      {% if now().hour  < 5 %} Good Night {{'\U0001F634'}}
      {% elif now().hour < 12 %} Good Morning {{'\u2615\uFE0F'}}
      {% elif now().hour < 18 %} Goedenmiddag {{'\U0001F44B\U0001F3FB'}}
      {% else %} Goedenavond {{'\U0001F44B\U0001F3FB'}}{% endif %}
    </li>
  sidebarMenu:
    - action: navigate
      navigation_path: lovelace-mobile/home
      name: Home
      active: true
    - action: navigate
      navigation_path: /lovelace-mobile/heating
      name: Heating
      active: true
    - action: navigate
      navigation_path: /lovelace-mobile/cameras
      name: Cameras
    - action: navigate
      navigation_path: lovelace-mobile/ground-floor
      name: Downstairs
    - action: toggle
      entity: light.room_lamp
      name: Room Lamp
      state: light.beganegrond
      icon: mdi:led-strip-variant

sidebar

firegrisus commented 2 years ago

I have the same problem. I have received working code but I am left with an empty sidebar area. I've been searching for days but don't know what's wrong with my install. The code should be correct because it works for someone else. No sidebar is displayed for me

Does anyone have a hint what I could have forgotten?

DBuit commented 2 years ago

Can @firegrisus and @steveuk23 check your browser console to see if there is an error?

firegrisus commented 2 years ago

Hello, I have reloaded some repositories etc. in hacs and have now been able to make the clock visible. But everything from bottomCard onwards is not displayed. I have tried code from the repositories and everything above bottomCard is shown (e.g. menu) If I insert the menu under bootomCard or entities they are not shown.

almighty059 commented 2 years ago

I'm having the same problem. Has anyone found a solution yet?

wtrbuit commented 2 years ago

Hello, I have reloaded some repositories etc. in hacs and have now been able to make the clock visible. But everything from bottomCard onwards is not displayed. I have tried code from the repositories and everything above bottomCard is shown (e.g. menu) If I insert the menu under bootomCard or entities they are not shown.

What type of bottomCard are you loading? We have an ongoing issue #45 about problems with the bottomCard since the December update.

If I understand correctly the issue with the black sidebar has been resolved?

wtrbuit commented 2 years ago

I'm having the same problem. Has anyone found a solution yet?

Hi, can you check your browser console to see if you have any errors? Do you have the latest version of the card?

firegrisus commented 2 years ago

What type of bottomCard are you loading? We have an ongoing issue #45 about problems with the bottomCard since the December update.

If I understand correctly the issue with the black sidebar has been resolved?

Hi, yes the sidebar is no longer just one colour (black). The clock and the date are displayed. The problem is solved. There is now the problem that everything under the code bottomCard is not displayed.

firegrisus commented 2 years ago

What type of bottomCard are you loading? We have an ongoing issue #45 about problems with the bottomCard since the December update

This is only a test code. sidebar: hideHassSidebar: false digitalClock: true clock: false hideTopMenu: false showTopMenuOnMobile: false date: true dateFormat: dddd, DD MMMM YYYY title: null style: | :host { --sidebar-background: #210443; --sidebar-text-color: #fff; --face-color: #210443; --face-border-color: #21353E; --clock-hands-color: #fff; --clock-seconds-hand-color: #fff; --clock-middle-background: #21353E; --clock-middle-border: #21353E; background: url("/local/backgr.jpg") template: >

  • {% if now().hour < 5 %} Good Night {{'\U0001F634'}} {% elif now().hour < 12 %} Good Morning {{'\u2615\uFE0F'}} {% elif now().hour < 18 %} Good Afternoon {{'\U0001F44B\U0001F3FB'}} {% else %} Good Evening {{'\U0001F44B\U0001F3FB'}}{% endif %}
  • {% if states('sensor.current_lights_on') | float > 0 %}
    <li>{{states('sensor.current_lights_on')}} light on</li> {% endif %}

    sidebarMenu:

    The content behind bottomcard is missing

    My original code - which I got "ready" and which also ran correctly with the creator - is much longer and more extensive. Therefore I have tried to test with little code

    By the way, I am an absolute layman and the texts are translated from German into English (if incomprehensible - my English is too bad).

    test sidebar

    wtrbuit commented 2 years ago

    @firegrisus you have put bottomCard in your YAML twice. That won't work, it can only hold one instance of bottomCard. You can however add a vertical-stack in the bottom card and put more than one card in that stack.

    Unfortunately as mentioned there is an issue at the moment with especially the vertical-stack and custom cards. Your entities card should work. So if you remove the second bottomCard property you should see the hue play light.

    Also you can only create one menu. In your code there is a second sidebarMenu as well.