diff --git a/README.md b/README.md index 94a0dcc..e103462 100644 --- a/README.md +++ b/README.md @@ -10,6 +10,7 @@ Lovelace Button card for your entities. - 3 actions on tap `toggle`, `more_info` and `service` - state display (optional) - custom color for `on` and `off` state (optional) + - custom state definition with customizable color (optional) - custom size (optional) - custom icon (optional) - custom css style (optional) @@ -19,6 +20,7 @@ Lovelace Button card for your entities. - `icon` : apply color settings to the icon only - `card` : apply color settings to the card only - automatic font color if color_type is set to `card` + - support unit of measurement - blank card and label card (for organization) - support for [custom_updater](https://github.com/custom-components/custom_updater) @@ -38,7 +40,7 @@ Lovelace Button card for your entities. | name | string | optional | `Air conditioner` | Define an optional text to show below the icon | show_state | boolean | `false` | `true` \| `false` | Show the state on the card. defaults to false if not set | style | object | optional | `- text-transform: none` | Define a list of css attribute and their value to apply to the card - +| state | list | optional | See [example section](examples) | State to use for the color of the button. Multiple states can be defined ## Instructions 1. Download the [button-card](https://raw.githubusercontent.com/kuuji/button-card/master/button-card.js) @@ -221,6 +223,26 @@ Vertical Stack with : ``` +Input select card with select next service and custom color for states. + +![cube](examples/cube.png) + + +```yaml + - type: "custom:button-card" + entity: input_select.cube_mode + icon: mdi:cube + action: service + show_state: true + state: + - value: 'sleeping' + color: var(--disabled-text-color) + - value: 'media' + color: rgb(5, 147, 255) + - value: 'light' + color: rgb(189, 255, 5) +``` + ## Credits diff --git a/changelog.md b/changelog.md index 558433d..978073d 100644 --- a/changelog.md +++ b/changelog.md @@ -1,3 +1,36 @@ +## 0.0.3 +Custom state, label card and icon attribute + +### New features : + + - New setting for custom states + - Label card for organization + - Use icon attribute from entity if it exists + +#### Custom state example with input select entity + +```yaml + - type: "custom:button-card" + entity: input_select.cube_mode + icon: mdi:cube + action: service + show_state: true + state: + - value: 'sleeping' + color: var(--disabled-text-color) + - value: 'media' + color: rgb(5, 147, 255) + - value: 'light' + color: rgb(189, 255, 5) +``` + +### Other + + - Allow to show both state and name (and doesn't break the style) + - Support for unit of measurement + + + ## 0.0.2 Custom service, blank card and custom_updater support diff --git a/examples/README.md b/examples/README.md index 3380677..d021646 100644 --- a/examples/README.md +++ b/examples/README.md @@ -10,6 +10,7 @@ 1. [Stack of light buttons](#stack-of-light-buttons) 1. [Volume up buttons with service call and blank cards](#volume-up-buttons-with-service-call-and-blank-cards) 1. [Scene setting buttons with label card](#scene-setting-buttons-with-label-card) +1. [Input select card with select next service and custom color for states](#input-select-card-with-select-next-service-and-custom-color-for-states) ### Simple icon button @@ -225,7 +226,7 @@ Horizontal stack with : - 1x Scene 4 Button - 1x Scene Off Button - ![scenes](examples/scenes.png) + ![scenes](scenes.png) ```yaml - type: vertical-stack @@ -262,3 +263,24 @@ Horizontal stack with : color: rgb(66, 134, 244) icon: mdi:eye-off-outline ``` + + +## Input select card with select next service and custom color for states. + +![cube](cube.png) + + +```yaml + - type: "custom:button-card" + entity: input_select.cube_mode + icon: mdi:cube + action: service + show_state: true + state: + - value: 'sleeping' + color: var(--disabled-text-color) + - value: 'media' + color: rgb(5, 147, 255) + - value: 'light' + color: rgb(189, 255, 5) +``` \ No newline at end of file diff --git a/examples/cube.png b/examples/cube.png new file mode 100644 index 0000000..a7dc36c Binary files /dev/null and b/examples/cube.png differ diff --git a/package-lock.json b/package-lock.json index d455cd3..0df996a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "button-card", - "version": "0.0.2", + "version": "0.0.3", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 1d9db71..6961600 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "button-card", - "version": "0.0.2", + "version": "0.0.3", "description": "Button card for lovelace", "main": "button-card.js", "scripts": { diff --git a/tracker.json b/tracker.json index e52bdf4..d5046e7 100644 --- a/tracker.json +++ b/tracker.json @@ -1,7 +1,7 @@ { "button-card": { - "updated_at": "2018-09-03", - "version": "0.0.2", + "updated_at": "2018-10-15", + "version": "0.0.3", "remote_location": "https://raw.githubusercontent.com/kuuji/button-card/master/button-card.js", "visit_repo": "https://github.com/kuuji/button-card", "changelog": "https://github.com/kuuji/button-card/releases/latest"