Like RGB Color settings different between button cards

[mlohus93]

Checklist

• [ X ] I updated the card to the latest version available
• [ X ] I cleared the cache of my browser

Describe the bug Buttons side by side defined with same rgb colors are displaying differently

Version of the card Version: 4.1.1. (worked correctly in 3.5)

To Reproduce This is the configuration I used:

      - type: horizontal-stack
        cards:
          - type: vertical-stack
            cards:
              **- type: conditional
                conditions:
                  - entity: switch.garage_myq_power_group
                    state: 'on'
                card:
                  type: custom:button-card
                  entity: cover.garage_door
                  show_state: true
                  show_name: false
                  icon: none
                  color: rgb(0, 100, 0)
                  tap_action:
                    action: none
                  hold_action:
                    action: toggle
                    confirmation:
                      text: '[[[ return `OPEN/CLOSE Garage, Are you sure?` ]]]'
                  state:
                    - value: Open
                      icon: none
                      color: rgb(255, 0, 0)
                      styles:
                        card:
                          - animation: blink 1s infinite
                    - value: Unavailable
                      icon: none
                      color: rgb(200, 200, 0)
                      styles:
                        card:
                          - animation: blink 1s infinite
                    - value: Closed
                      icon: none
                      color: rgb(0, 100, 0)
                  color_type: card
                  styles:
                    card:
                      - font-size: 22px
                      - font-weight: bold
                      - height: 50px
                      - padding: 10px 10px 10px 10px
                      - '--mdc-ripple-color': gainsboro
                      - '--mdc-ripple-press-opacity': 0.5**
              - type: conditional
                conditions:
                  - entity: switch.garage_myq_power_group
                    state: 'off'
                card:
                  type: custom:button-card
                  entity: input_text.myq_off
                  show_state: true
                  show_name: false
                  icon: none
                  color: rgb(0, 0, 255)
                  tap_action:
                    action: none
                  hold_action:
                    action: none
                  state:
                    - value: MyQ Off
                      icon: none
                      color: rgb(0, 0, 255)
                    - value: MyQ Off
                      icon: none
                      color: rgb(0, 0, 255)
                    - value: MyQ Off
                      icon: none
                      color: rgb(0, 0, 255)
                  color_type: card
                  styles:
                    card:
                      - font-size: 22px
                      - font-weight: bold
                      - height: 50px
                      - padding: 10px 10px 10px 10px
                      - '--mdc-ripple-color': gainsboro
                      - '--mdc-ripple-press-opacity': 0.5
          - type: vertical-stack
            cards:
              - type: conditional
                conditions:
                  - entity: switch.garage_myq_power_group
                    state: 'on'
                card:
                  type: custom:button-card
                  entity: input_text.myq_on
                  show_state: true
                  show_name: false
                  icon: none
                  color: rgb(0, 100, 0)
                  tap_action:
                    action: none
                  hold_action:
                    action: none
                  state:
                    - value: MyQ On
                      icon: none
                      color: rgb(0, 100, 0)
                    - value: MyQ On
                      icon: none
                      color: rgb(0, 100, 0)
                    - value: MyQ On
                      icon: none
                      color: rgb(0, 100, 0)
                  color_type: card
                  styles:
                    card:
                      - font-size: 22px
                      - font-weight: bold
                      - height: 50px
                      - padding: 10px 10px 10px 10px
                      - '--mdc-ripple-color': gainsboro
                      - '--mdc-ripple-press-opacity': 0.5
              - type: conditional
                conditions:
                  - entity: switch.garage_myq_power_group
                    state: 'off'
                card:
                  type: custom:button-card
                  entity: input_text.myq_off
                  show_state: true
                  show_name: false
                  icon: none
                  color: rgb(0, 0, 255)
                  tap_action:
                    action: none
                  hold_action:
                    action: none
                  state:
                    - value: MyQ Off
                      icon: none
                      color: rgb(0, 0, 255)
                    - value: MyQ Off
                      icon: none
                      color: rgb(0, 0, 255)
                    - value: MyQ Off
                      icon: none
                      color: rgb(0, 0, 255)
                  color_type: card
                  styles:
                    card:
                      - font-size: 22px
                      - font-weight: bold
                      - height: 50px
                      - padding: 10px 10px 10px 10px
                      - '--mdc-ripple-color': gainsboro
                      - '--mdc-ripple-press-opacity': 0.5
          - type: custom:button-card
            icon: mdi:garage-variant
            entity: switch.garage_myq_power_group
            color: white
            color_type: icon
            tap_action:
              action: toggle
            confirmation:
              text: '[[[ return `Toggle MyQ Power, Are you sure?` ]]]'
            hold_action:
              action: none
            name: MyQ
            state:
              - value: 'off'
                icon: mdi:garage-variant
                color: gray
              - value: 'on'
                icon: mdi:garage-variant
                color: rgb(255, 255, 0)
              - value: unavailable
                color: white
                icon: mdi:cancel
                styles:
                  card:
                    - background-color: Red
            styles:
              card:
                - font-size: 12px
                - font-weight: bold
                - height: 50px
                - width: 50px

Screenshots If applicable, add screenshots to help explain your problem.

Expected behavior

The "MyQ Off" buttons are correctly shown in a Royal Blue rgb(0, 0, 255) and the "MyQ On" button is correctly shown in Green rgb(0, 100, 0) however the "Closed" button is showing in a Gray/Blue color even though the card calls for Green rgb(0,100,0). I expected "Closed" to look the same as "MyQ On"

Desktop (please complete the following information):

• Browser Chrome on MacBook Pro 2015 running MacOS Monterey 12.6.8
• Version 116.0.5845.110 (Official Build) (x86_64)

Smartphone (please complete the following information):

• Device: iPhone 12 Pro
• OS: iOS 16.6
• Browser - Safari
• Version - Built into iOS 16.6
• App - Home Assistant Companion for iOS
• Version 2023.4 (2023.460)

Additional context Add any other context about the problem here.

[RomRider]

Because the state is not Closed but closed same for Open and Unavailable they all should be lowercase so nothing matches.

[mlohus93]

OK well you can close this one then; I stand corrected. I do find it bizarre that color/text changes occurred perfectly for button-card 3.5 and went wonky for 4.1.1 without any code changes, but I cannot disagree that changing Open and Closed to open and closed did in fact get it working correctly. Thanks and apologies for the false alarm.