More bubble card modules

.HA_VERSION

@@ -1 +1 @@
-2025.6.2
+2025.7.1

bubble/main_button_floors.yaml

@@ -0,0 +1,73 @@
+main_button_floors:
+  name: Main Button Floors
+  version: '1.1'
+  creator: Tony Stork
+  supported:
+    - button
+  description: Module to provide theming for the main indoor floor buttons
+  code: |
+    ${(() => {
+        const occupancy = hass?.states[this.config?.main_button_floors?.occupancy_entity]?.state || '';
+        const hot = hass?.states[this.config?.main_button_floors?.hot_entity]?.state || '';
+        const cold = hass?.states[this.config?.main_button_floors?.cold_entity]?.state || '';
+
+        let bg_color = 'var(--bubble-main-background-color)';
+        let occupied_color = 'var(--accent-color)';
+        let hot_color = 'var(--error-color)';
+        let cold_color = 'var(--purple-color)';
+
+        // Main button background
+        const mainButton = card?.querySelector('.bubble-button-background');
+        if (mainButton) {
+            mainButton.style.opacity = '1';
+            mainButton.style.backgroundColor = occupancy === 'on' ? occupied_color : bg_color;
+            mainButton.style.transition = 'background-color 1s';
+        }
+
+        // Sub button 1
+        const subButton1 = card?.querySelector('.bubble-sub-button-1');
+        if (subButton1) {
+            if (hot === 'on') {
+                subButton1.style.backgroundColor = hot_color;
+            } else if (cold === 'on') {
+                subButton1.style.backgroundColor = cold_color;
+            } else if (occupancy === 'on') {
+                subButton1.style.backgroundColor = occupied_color;
+            } else {
+                subButton1.style.backgroundColor = bg_color;
+            }
+        }
+
+        // Unavailable state
+        if (mainButton && occupancy === 'unavailable') {
+            mainButton.classList.add('is-unavailable');
+        } else if (mainButton) {
+            mainButton.classList.remove('is-unavailable');
+        }
+
+        // No CSS string needed
+        return '';
+    })()}
+  editor:
+    - type: expandable
+      title: Entity Configuration
+      icon: mdi:format-list-bulleted
+      schema:
+        - name: occupancy_entity
+          label: Occupancy Entity
+          selector:
+            entity:
+              device_class: occupancy
+          required: false
+        - name: hot_entity
+          label: Hot Entity
+          selector:
+            entity:
+              device_class: heat
+          required: false
+        - name: cold_entity
+          label: Cold Entity
+          selector:
+            entity:
+              device_class: cold
+          required: false

bubble/main_button_outdoors.yaml

@@ -0,0 +1,43 @@
+main_button_outdoors:
+  name: Main Button Outdoors
+  version: '1.1'
+  creator: Tony Stork
+  supported:
+    - button
+  description: Module to provide theming for outdoor floor buttons
+  code: |
+    ${(() => {
+        const occupancy = hass?.states[this.config?.main_button_outdoors?.occupancy_entity]?.state || '';
+
+        let bg_color = 'var(--bubble-main-background-color)';
+        let occupied_color = 'var(--accent-color)';
+
+        // Main button background
+        const mainButton = card?.querySelector('.bubble-button-background');
+        if (mainButton) {
+            mainButton.style.opacity = '1';
+            mainButton.style.backgroundColor = occupancy === 'on' ? occupied_color : bg_color;
+            mainButton.style.transition = 'background-color 1s';
+        }
+
+        // Unavailable state
+        if (mainButton && occupancy === 'unavailable') {
+            mainButton.classList.add('is-unavailable');
+        } else if (mainButton) {
+            mainButton.classList.remove('is-unavailable');
+        }
+
+        // No CSS string needed
+        return '';
+    })()}
+  editor:
+    - type: expandable
+      title: Entity Configuration
+      icon: mdi:format-list-bulleted
+      schema:
+        - name: occupancy_entity
+          label: Occupancy Entity
+          selector:
+            entity:
+              device_class: occupancy
+          required: false

bubble/main_button_state_red.yaml

@@ -0,0 +1,33 @@
+main_button_state_red:
+  name: Main Button State Red
+  version: '1.1'
+  creator: Tony Stork
+  supported:
+    - button
+  description: Will turn the button red if the entity state is on, otherwise default style applies
+  code: |-
+    ${(() => {
+        const state = hass?.states[this.config?.entity]?.state || '';
+
+        let bg_color = 'var(--bubble-main-background-color)';
+        let red_color = 'var(--error-color)';
+
+        // Main button background
+        const mainButton = card?.querySelector('.bubble-button-background');
+        if (mainButton) {
+            mainButton.style.opacity = '1';
+            mainButton.style.backgroundColor = state === 'on' ? red_color : bg_color;
+            mainButton.style.transition = 'background-color 1s';
+        }
+
+        // Unavailable state
+        if (mainButton && state === 'unavailable') {
+            mainButton.classList.add('is-unavailable');
+        } else if (mainButton) {
+            mainButton.classList.remove('is-unavailable');
+        }
+
+        // No CSS string needed
+        return '';
+    })()}
+  editor: ''

bubble/popup_accent_color_button.yaml

@@ -0,0 +1,33 @@
+popup_accent_color_button:
+  name: Popup Accent Color Button
+  version: '1.0'
+  creator: Tony Stork
+  supported:
+    - button
+  description: Will turn the button to accent color variable if config entity is on, otherwise default style applies
+  code: |-
+    ${(() => {
+        const state = hass?.states[this.config?.entity]?.state || '';
+
+        let bg_color = 'var(--background-color-2)';
+        let accent_color = 'var(--accent-color)';
+
+        // Main button background
+        const mainButton = card?.querySelector('.bubble-button-background');
+        if (mainButton) {
+            mainButton.style.opacity = '1';
+            mainButton.style.backgroundColor = state === 'on' ? accent_color : bg_color;
+            mainButton.style.transition = 'background-color 1s';
+        }
+
+        // Unavailable state
+        if (mainButton && state === 'unavailable') {
+            mainButton.classList.add('is-unavailable');
+        } else if (mainButton) {
+            mainButton.classList.remove('is-unavailable');
+        }
+
+        // No CSS string needed
+        return '';
+    })()}
+  editor: ''

bubble/popup_security_button.yaml

@@ -0,0 +1,33 @@
+popup_security_button:
+  name: Popup Security Button
+  version: '1.0'
+  creator: Tony Stork
+  supported:
+    - button
+  description: Will turn the button red if there is a security fault, otherwise default style applies
+  code: |-
+    ${(() => {
+        const state = hass?.states[this.config?.entity]?.state || '';
+
+        let bg_color = 'var(--background-color-2)';
+        let red_color = 'var(--error-color)';
+
+        // Main button background
+        const mainButton = card?.querySelector('.bubble-button-background');
+        if (mainButton) {
+            mainButton.style.opacity = '1';
+            mainButton.style.backgroundColor = state === 'on' ? red_color : bg_color;
+            mainButton.style.transition = 'background-color 1s';
+        }
+
+        // Unavailable state
+        if (mainButton && state === 'unavailable') {
+            mainButton.classList.add('is-unavailable');
+        } else if (mainButton) {
+            mainButton.classList.remove('is-unavailable');
+        }
+
+        // No CSS string needed
+        return '';
+    })()}
+  editor: ''

bubble/popup_temperature_button.yaml

@@ -0,0 +1,55 @@
+popup_temperature_button:
+  name: Popup Temperature Button
+  version: '1.0'
+  creator: Tony Stork
+  supported:
+    - button
+  description: Will turn the button red if the room is too hot, cyan if too cold, otherwise default style applies
+  code: |-
+    ${(() => {
+        const hot = hass?.states[this.config?.popup_temperature_button?.hot_entity]?.state || '';
+        const cold = hass?.states[this.config?.popup_temperature_button?.cold_entity]?.state || '';
+
+        let bg_color = 'var(--background-color-2)';
+        let hot_color = 'var(--error-color)';
+        let cold_color = 'var(--cyan-color)';
+
+        // Main button background
+        const mainButton = card?.querySelector('.bubble-button-background');
+        if (mainButton) {
+            mainButton.style.opacity = '1';
+            if (hot === 'on') {
+                mainButton.style.backgroundColor = hot_color;
+            } else if (cold === 'on') {
+                mainButton.style.backgroundColor = cold_color;
+            } else {
+                mainButton.style.backgroundColor = bg_color;
+            }
+            mainButton.style.transition = 'background-color 1s';
+        }
+
+        // Unavailable state
+        if (mainButton && state === 'unavailable') {
+            mainButton.classList.add('is-unavailable');
+        } else if (mainButton) {
+            mainButton.classList.remove('is-unavailable');
+        }
+
+        // No CSS string needed
+        return '';
+    })()}
+  editor:
+    - type: expandable
+      title: Entity Configuration
+      icon: mdi:format-list-bulleted
+      schema:
+        - name: hot_entity
+          label: Hot Entity
+          selector:
+            entity:
+              device_class: heat
+        - name: cold_entity
+          label: Cold Entity
+          selector:
+            entity:
+              device_class: cold

packages/gas.yaml

@@ -13,3 +13,10 @@ sensor:
     state_characteristic: mean
     max_age:
       hours: 24
+binary_sensor:
+  - platform: trend
+    sensors:
+      local_average_gas_trend:
+        entity_id: sensor.local_average_gas_price
+        friendly_name: Local Average Gas Trend
+        unique_id: 3405a536-1e02-412f-916b-1a62c9cb8a2e