Bubble Card v1.1.2

Design enhancements and new styling options!

v1.1.2 fix: The GUI editor was not working correctly after the v1.1.0, it's now fixed!

v1.1.0 changelog:

💡 New features:

• The pop-ups have undergone a slight visual transformation, and they look great!
• A new animation has been added to the horizontal-buttons-stack that activates once the page has loaded. This can be disabled with rise_animation: false.
• Introduced bg_color to modify the background color of a pop-up.
• Introduced bg_opacity to adjust the background opacity of a pop-up. The previous default was bg_opacity: 100.
• Introduced bg_blur to alter the background blur effect of a transparent pop-up. The previous default was bg_blur: 0.
• Introduced shadow_opacity to adjust the shadow opacity of a pop-up. The previous default was shadow_opacity: 0.
• All new options are accessible in the GUI editor.

✔️ Fixes

• Minor enhancements have been implemented.

More styling options for the other cards will be added soon. Please feel free to open an issue for any specific styling requests.

I really appreciate your feedback on any issues you may encounter, and thank you once again for your continued support!

Bubble Card v1.1.1

Design enhancements and new styling options!

v1.1.1 fix: The blur effect on Safari is now fixed.

v1.1.0 changelog:

💡 New features:

• The pop-ups have undergone a slight visual transformation, and they look great!
• A new animation has been added to the horizontal-buttons-stack that activates once the page has loaded. This can be disabled with rise_animation: false.
• Introduced bg_color to modify the background color of a pop-up.
• Introduced bg_opacity to adjust the background opacity of a pop-up. The previous default was bg_opacity: 100.
• Introduced bg_blur to alter the background blur effect of a transparent pop-up. The previous default was bg_blur: 0.
• Introduced shadow_opacity to adjust the shadow opacity of a pop-up. The previous default was shadow_opacity: 0.
• All new options are accessible in the GUI editor.

✔️ Fixes

• Minor enhancements have been implemented.

More styling options for the other cards will be added soon. Please feel free to open an issue for any specific styling requests.

I really appreciate your feedback on any issues you may encounter, and thank you once again for your continued support!

Bubble Card v1.1.0

Design enhancements and new styling options!

💡 New features:

• The pop-ups have undergone a slight visual transformation, and they look great!
• A new animation has been added to the horizontal-buttons-stack that activates once the page has loaded. This can be disabled with rise_animation: false.
• Introduced bg_color to modify the background color of a pop-up.
• Introduced bg_opacity to adjust the background opacity of a pop-up. The previous default was bg_opacity: 100.
• Introduced bg_blur to alter the background blur effect of a transparent pop-up. The previous default was bg_blur: 0.
• Introduced shadow_opacity to adjust the shadow opacity of a pop-up. The previous default was shadow_opacity: 0.
• All new options are accessible in the GUI editor.

✔️ Fixes

• Minor enhancements have been implemented.

More styling options for the other cards will be added soon. Please feel free to open an issue for any specific styling requests.

I really appreciate your feedback on any issues you may encounter, and thank you once again for your continued support!

Bubble Card v1.0.3

Bubble Card is out of beta!

v1.0.3 is just a fast release that fix an issue introduced in v1.0.0 for the pop-ups, it was not possible to trigger them anymore in some cases #99

Thanks a lot for all your feedbacks! Almost 70 issues closed since the first beta!

And a big thank you for your help @BWilky, @Danm72, @samuel9554 and @marmoul70 🥳

💡 New features :

• You can now set a timeout to close your pop-ups with auto_close: 10000, this value is in milliseconds (thanks @BWilky) #94
• You can now enable/disable the back button/event in your pop-ups, this allow you to navigate through your pop-ups when you press the back button of your browser, just add back_open: true (Beta users: This was the previous default behavior, set it to true to keep everything like before the update.) #89
• In your horizontal-buttons-stack you can now close a pop-up by clicking on the same button a second time #62
• You can now fix the margin of your pop-ups if they are not centered well in your theme with margin: 13px #91
• In your horizontal-buttons-stack you can now easily modify the style of a single button with a custom style by selecting it's class. If your button's link is #kitchen then the class to modify it will be .kitchen #76
• Bubble Card is out of beta, in my head it's more than a feature! Oh and instead of v0.0.1 like the betas the new build will be v1.0.0

✔️ Fixes

• Fixed the pop-ups trigger
• The editor is now displayed correctly on mobile
• Some GUI editor improvement
• Some other improvements
• Fixed a last minute issue introduced in v1.0.0

Please report any issues you may encounter, this release is a big one and I hope that everything is working!

Bubble Card v1.0.2

Bubble Card is out of beta!

v1.0.2 is just a fast release that fix an issue introduced in v1.0.0 for the pop-ups, the close button was no longer removing the hash from the url on your browser #96

Thanks a lot for all your feedbacks! Almost 70 issues closed since the first beta!

And a big thank you for your help @BWilky, @Danm72, @samuel9554 and @marmoul70 🥳

💡 New features :

• You can now set a timeout to close your pop-ups with auto_close: 10000, this value is in milliseconds (thanks @BWilky) #94
• You can now enable/disable the back button/event in your pop-ups, this allow you to navigate through your pop-ups when you press the back button of your browser, just add back_open: true (Beta users: This was the previous default behavior, set it to true to keep everything like before the update.) #89
• In your horizontal-buttons-stack you can now close a pop-up by clicking on the same button a second time #62
• You can now fix the margin of your pop-ups if they are not centered well in your theme with margin: 13px #91
• In your horizontal-buttons-stack you can now easily modify the style of a single button with a custom style by selecting it's class. If your button's link is #kitchen then the class to modify it will be .kitchen #76
• Bubble Card is out of beta, in my head it's more than a feature! Oh and instead of v0.0.1 like the betas the new build will be v1.0.0

✔️ Fixes

• Fixed the pop-ups trigger
• The editor is now displayed correctly on mobile
• Some GUI editor improvement
• Some other improvements
• Fixed a last minute issue introduced in v1.0.0

Please report any issues you may encounter, this release is a big one and I hope that everything is working!

Bubble Card v1.0.1

Bubble Card is out of beta!

Thanks a lot for all your feedbacks! Almost 70 issues closed since the first beta!

And a big thank you for your help @BWilky, @Danm72, @samuel9554 and @marmoul70 🥳

💡 New features :

• You can now set a timeout to close your pop-ups with auto_close: 10000, this value is in Milliseconds (thanks @BWilky) #94
• You can now enable/disable the back button/event in your pop-ups, this allow you to navigate through your pop-ups when you press the back button of your browser, just add back_open: true (Beta users: This was the previous default behavior, set it to true to keep everything like before the update.) #89
• In your horizontal-buttons-stack you can now close a pop-up by clicking on the same button a second time #62
• You can now fix the margin of your pop-ups if they are not centered well in your theme with margin: 13px #91
• In your horizontal-buttons-stack you can now easily modify the style of a single button with a custom style by selecting it's class. If your button's link is #kitchen then the class to modify it will be .kitchen #76
• Bubble Card is out of beta, in my head it's more than a feature! Oh and instead of v0.0.1 like the betas the new build will be v1.0.0

✔️ Fixes

• Fixed the pop-ups trigger
• The editor is now displayed correctly on mobile
• Some GUI editor improvement
• Some other improvements
• Fixed a last minute issue introduced in v1.0.0

All new options will soon be available in the documentation.

Please report any issues you may encounter, this release is a big one and I hope that everything is working!

Bubble Card v1.0.0

Bubble Card v1.0.0 is out of beta!

Thanks a lot for all your feedbacks! Almost 70 issues closed since the first beta!

And a big thank you for your help @BWilky, @Danm72, @samuel9554 and @marmoul70 🥳

💡 New features :

• You can now set a timeout to close your pop-ups with auto_close: 10000, this value is in Milliseconds (thanks @BWilky) #94
• You can now enable/disable the back button/event in your pop-ups, this allow you to navigate through your pop-ups when you press the back button of your browser, just add back_open: true (Beta users: This was the previous default behavior, set it to true to keep everything like before the update.) #89
• In your horizontal-buttons-stack you can now close a pop-up by clicking on the same button a second time #62
• You can now fix the margin of your pop-ups if they are not centered well in your theme with margin: 13px #91
• In your horizontal-buttons-stack you can now easily modify the style of a single button with a custom style by selecting it's class. If your button's link is #kitchen then the class to modify it will be .kitchen #76
• Bubble Card is out of beta, in my head it's more than a feature! Oh and instead of v0.0.1 like the betas the new build will be v1.0.0

✔️ Fixes

• Fixed the pop-ups trigger
• The editor is now displayed correctly on mobile
• Some GUI editor improvement
• Some other improvements

All new options will soon be available in the documentation.

Please report any issues you may encounter, this release is a big one and I hope that everything is working!

Bubble Card v0.0.1-beta.11

BETA 11 - Fixes for beta 9 and 10

This is again a fast update that just fix some bugs that was introduced in beta 9.

✔️ Fixes :

• There was an issue that was slowing down (a lot) your dashboard after some time, this is now fixed and everything is really faster now!
• Pop-ups triggers are now working as expected
• The Close when the state is different toggle in the editor is now fixed
• is_sidebar_hidden is now working like before
• Fixed a typo in the editor

And for those who missed it here is the beta 9 changelog (it's a big one) :

💡 New features :

• Styles templates, see below
• Localization for states (like in the pop-ups, you don't need state_unit anymore)
• You can now show the entity state in buttons and covers with show_state: true
• You can now change the width of the horizontal-buttons-stack with width_desktop: 100%
• You can now open a pop-up based on the state of any entity, see below
• Pop-ups now support entity-picture
• If you set only an hash to a pop-up, only the close button will be displayed

✔️ Fixes :

• BREAKING CHANGE (sort of) : The desktop_width of pop-ups was not correct, you will have to remove 60px to your current value to have the same width as before
• BREAKING CHANGE (sort of) : After the update it's possible that your horizontal-buttons-stack will not be displayed correctly, just open the editor to fix that
• The editor is now fully working and with live preview for all cards
• The pop-up hash checker system has been fully rewritten and should fix a lot if not all issues
• A lot of the code has been rewritten and everything should be faster and more stable
• A lot of the CSS has been rewritten and the pop-ups and all the cards are now displayed like they should
• All cards are now displaying the icon and name of the entity if none are defined
• And more!

Styles template

Advanced users can now add templates in JS in their custom styles, here is an exemple of a button that is red when it's off and blue when it's on.

type: custom:bubble-card
card_type: button
entity: switch.test
name: Test
styles: |
  .switch-button {
    background-color: ${state === 'on' ? 'blue' : 'red'} !important;
  }

For now you have access to these variables :

state will return the state of your entity.
entity will return your entity like switch.test in this exemple.

Pop-ups trigger

This new feature allows you to open a pop-up based on the state of any entity, for example you can open a "Security" pop-up with a camera when a person is in front of your house. You can also create a toggle helper (input_boolean) and trigger its opening/closing in an automation.

Here is an example :

type: custom:bubble-card
card_type: pop-up
hash: '#kitchen'
name: Security
icon: mdi:video
trigger_entity: binary_sensor.front_door_motion
trigger_state: 'on'
trigger_close: true

All new options are available in the documentation.

Please report any issues you may encounter, this release is a big one and I hope that everything is working!

Bubble Card v0.0.1-beta.10

BETA 9... and now 10 - A major update!

This is a fast update that just fix a bug that was introduced in beta 9, the background color of buttons is now working like before and it also fix the state variable in custom styles for some cards.

Here is the beta 9 changelog :

💡 New features :

• Styles templates, see below
• Localization for states (like in the pop-ups, you don't need state_unit anymore)
• You can now show the entity state in buttons and covers with show_state: true
• You can now change the width of the horizontal-buttons-stack with width_desktop: 100%
• You can now open a pop-up based on the state of any entity, see below
• Pop-ups now support entity-picture
• If you set only an hash to a pop-up, only the close button will be displayed

✔️ Fixes :

• BREAKING CHANGE (sort of) : The desktop_width of pop-ups was not correct, you will have to remove 60px to your current value to have the same width as before
• BREAKING CHANGE (sort of) : After the update it's possible that your horizontal-buttons-stack will not be displayed correctly, just open the editor to fix that
• The editor is now fully working and with live preview for all cards
• The pop-up hash checker system has been fully rewritten and should fix a lot if not all issues
• A lot of the code has been rewritten and everything should be faster and more stable
• A lot of the CSS has been rewritten and the pop-ups and all the cards are now displayed like they should
• All cards are now displaying the icon and name of the entity if none are defined
• And more!

Styles template

Advanced users can now add templates in JS in their custom styles, here is an exemple of a button that is red when it's off and blue when it's on.

type: custom:bubble-card
card_type: button
entity: switch.test
name: Test
styles: |
  .switch-button {
    background-color: ${state === 'on' ? 'blue' : 'red'} !important;
  }

For now you have access to these variables :

state will return the state of your entity.
entity will return your entity like switch.test in this exemple.

Pop-ups trigger

This new feature allows you to open a pop-up based on the state of any entity, for example you can open a "Security" pop-up with a camera when a person is in front of your house. You can also create a toggle helper (input_boolean) and trigger its opening/closing in an automation.

Here is an example :

type: custom:bubble-card
card_type: pop-up
hash: '#kitchen'
name: Security
icon: mdi:video
trigger_entity: binary_sensor.front_door_motion
trigger_state: 'on'
trigger_close: true

All new options are available in the documentation.

Please report any issues you may encounter, this release is a big one and I hope that everything is working!

Bubble Card v0.0.1-beta.9

BETA 9 - A major update!

💡 New features :

• Styles templates, see below
• Localization for states (like in the pop-ups, you don't need state_unit anymore)
• You can now show the entity state in buttons and covers with show_state: true
• You can now change the width of the horizontal-buttons-stack with width_desktop: 100%
• You can now open a pop-up based on the state of any entity, see below
• Pop-ups now support entity-picture
• If you set only an hash to a pop-up, only the close button will be displayed

✔️ Fixes :

• BREAKING CHANGE (sort of) : The desktop_width of pop-ups was not correct, you will have to remove 60px to your current value to have the same width as before
• BREAKING CHANGE (sort of) : After the update it's possible that your horizontal-buttons-stack will not be displayed correctly, just open the editor to fix that
• The editor is now fully working and with live preview for all cards
• The pop-up hash checker system has been fully rewritten and should fix a lot if not all issues
• A lot of the code has been rewritten and everything should be faster and more stable
• A lot of the CSS has been rewritten and the pop-ups and all the cards are now displayed like they should
• All cards are now displaying the icon and name of the entity if none are defined
• And more!

Styles template

Advanced users can now add templates in JS in their custom styles, here is an exemple of a button that is red when it's off and blue when it's on.

type: custom:bubble-card
card_type: button
entity: switch.test
name: Test
styles: |
  .switch-button {
    background-color: ${state === 'on' ? 'blue' : 'red'} !important;
  }

For now you have access to these variables :

state will return the state of your entity.
entity will return your entity like switch.test in this exemple.

Pop-ups trigger

This new feature allows you to open a pop-up based on the state of any entity, for example you can open a "Security" pop-up with a camera when a person is in front of your house. You can also create a toggle helper (input_boolean) and trigger its opening/closing in an automation.

Here is an example :

type: custom:bubble-card
card_type: pop-up
hash: '#kitchen'
name: Security
icon: mdi:video
trigger_entity: binary_sensor.front_door_motion
trigger_state: 'on'
trigger_close: true

All new options will be soon available in the documentation.

Please report any issues you may encounter, this release is a big one and I hope that everything is working!