-
Notifications
You must be signed in to change notification settings - Fork 22
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
13db8da
commit 705cff6
Showing
12 changed files
with
120 additions
and
53 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,7 +1,7 @@ | ||
| /* | ||
| * Label component for FTUI version 3 | ||
| * | ||
| * Copyright (c) 2019-2020 Mario Stephan <[email protected]> | ||
| * Copyright (c) 2019-2024 Mario Stephan <[email protected]> | ||
| * Under MIT License (http://www.opensource.org/licenses/mit-license.php) | ||
| * | ||
| * https://github.com/knowthelist/ftui | ||
|
|
@@ -30,7 +30,11 @@ export class FtuiLabel extends FtuiElement { | |
| --color-base: currentColor; | ||
| color: var(--color-base); | ||
| white-space: nowrap; | ||
| display: flex; | ||
| align-items: center; | ||
| justify-content: center; | ||
| } | ||
| :host([align-items=baseline]) { align-items: baseline;} | ||
| :host(:empty:not([text])) slot[name="unit"], | ||
| :host([text=""]) slot[name="unit"] { visibility: hidden; } | ||
| :host slot[name="unit"] { margin-left: 0.15em; display: initial; } | ||
|
|
@@ -41,7 +45,7 @@ export class FtuiLabel extends FtuiElement { | |
| height: .75em; border-radius: 2em; | ||
| opacity: .3; animation: fading 1.5s infinite; | ||
| min-width: 4em; } | ||
| :host([size="10"]),:host([size="11"]),:host([size="12"]),:host([thin]) { | ||
| :host([thin]) { | ||
| font-family: "HelveticaNeue-UltraLight", "Segoe UI", "Roboto Light", "San Francisco", sans-serif; | ||
| line-height: 0.8em; } | ||
| @keyframes fading { | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -9,7 +9,7 @@ | |
| * | ||
| * Version: 3.0.0 | ||
| * | ||
| * Copyright (c) 2020 Mario Stephan <[email protected]> | ||
| * Copyright (c) 2020-2024 Mario Stephan <[email protected]> | ||
| * Under MIT License (http://www.opensource.org/licenses/mit-license.php) | ||
| * https://github.com/knowthelist/ftui | ||
| */ | ||
|
|
@@ -56,6 +56,20 @@ | |
|
|
||
| </ftui-grid-tile> | ||
|
|
||
| <ftui-grid-tile row="3" col="1" height="2" width="3"> | ||
| <header>Current</header> | ||
|
|
||
| <ftui-chart y-label="KWh" | ||
| y-min="0" y-max="10" unit="week"> | ||
| <ftui-chart-data type="bar" | ||
| log="FileLog_StromRechner" | ||
| spec="4:StromRechner.Stromzaehler_state_EnergyDayLast::" | ||
| ></ftui-chart-data> | ||
| <ftui-chart-controls units="week, 30d"></ftui-chart-controls> | ||
| </ftui-chart> | ||
|
|
||
| </ftui-grid-tile> | ||
|
|
||
| </ftui-grid> | ||
|
|
||
| </body> | ||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -9,7 +9,7 @@ | |
| * | ||
| * Version: 3.0.0 | ||
| * | ||
| * Copyright (c) 2020 Mario Stephan <[email protected]> | ||
| * Copyright (c) 2020-2024 Mario Stephan <[email protected]> | ||
| * Under MIT License (http://www.opensource.org/licenses/mit-license.php) | ||
| * https://github.com/knowthelist/ftui | ||
| */ | ||
|
|
@@ -45,7 +45,7 @@ | |
| <ftui-grid-tile row="1" col="3" height="1" width="1"> | ||
| <header>HUE-DEVICE</header> | ||
|
|
||
| <ftui-colorpicker [hex]="HUEDevice6:rgb" (hex)="replace('#','') | HUEDevice6:rgb" | ||
| <ftui-colorpicker [hex]="HUEDevice20:rgb" (hex)="replace('#','') | HUEDevice20:rgb" | ||
| layout="wheel,valueSlider"></ftui-colorpicker> | ||
|
|
||
| </ftui-grid-tile> | ||
|
|
@@ -62,7 +62,7 @@ | |
| <ftui-row> | ||
|
|
||
| <ftui-column width="10%" height="70%"><span>R</span><span>G</span><span>B</span></ftui-column> | ||
| <ftui-colorpicker [hex]="HUEDevice6:rgb" (hex)="replace('#','') | HUEDevice6:rgb" | ||
| <ftui-colorpicker [hex]="HUEDevice20:rgb" (hex)="replace('#','') | HUEDevice20:rgb" | ||
| layout="redSlider, greenSlider, blueSlider"></ftui-colorpicker> | ||
|
|
||
| </ftui-row> | ||
|
|
@@ -72,20 +72,20 @@ | |
| <header>HORIZONTAL</header> | ||
|
|
||
| <ftui-colorpicker direction="horizontal" layout="hueSlider, valueSlider" | ||
| [hex]="HUEDevice6:rgb" (hex)="replace('#','') | HUEDevice6:rgb"></ftui-colorpicker> | ||
| [hex]="HUEDevice20:rgb" (hex)="replace('#','') | HUEDevice20:rgb"></ftui-colorpicker> | ||
| </ftui-grid-tile> | ||
|
|
||
|
|
||
| <ftui-grid-tile row="2" col="3" height="1" width="1"> | ||
| <header>SAT/BRI/HUE</header> | ||
|
|
||
| <ftui-colorpicker direction="horizontal" layout="hueSlider,saturationSlider,valueSlider" | ||
| [hue]="HUEDevice6:hue | divide(182.0425) | toInt() | " | ||
| [saturation]="HUEDevice6:sat | divide(2.55) | toInt()" | ||
| [brightness]="HUEDevice6:bri | divide(2.55) | toInt()" | ||
| (hue)="multiply(182.0425) | toInt() | HUEDevice6:hue" | ||
| (saturation)="multiply(2.55) | toInt() | HUEDevice6:sat" | ||
| (brightness)="multiply(2.55) | toInt() | HUEDevice6:bri"> | ||
| [hue]="HUEDevice20:hue | divide(182.0425) | toInt() | " | ||
| [saturation]="HUEDevice20:sat | divide(2.55) | toInt()" | ||
| [brightness]="HUEDevice20:bri | divide(2.55) | toInt()" | ||
| (hue)="multiply(182.0425) | toInt() | HUEDevice20:hue" | ||
| (saturation)="multiply(2.55) | toInt() | HUEDevice20:sat" | ||
| (brightness)="multiply(2.55) | toInt() | HUEDevice20:bri"> | ||
| </ftui-colorpicker> | ||
| </ftui-grid-tile> | ||
|
|
||
|
|
||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
|
|
@@ -9,7 +9,7 @@ | |
| * | ||
| * Version: 3.0.0 | ||
| * | ||
| * Copyright (c) 2015-2019 Mario Stephan <[email protected]> | ||
| * Copyright (c) 2015-2024 Mario Stephan <[email protected]> | ||
| * Under MIT License (http://www.opensource.org/licenses/mit-license.php) | ||
| * https://github.com/knowthelist/ftui | ||
| */ | ||
|
|
@@ -21,7 +21,11 @@ | |
| <link href="favicon.ico" rel="icon" type="image/x-icon" /> | ||
|
|
||
| <meta name='viewport' content='width=device-width'> | ||
|
|
||
| <style> | ||
| [data-val1="on"][data-val2="on"] { | ||
| color: var(--success-color); | ||
| } | ||
| </style> | ||
| <!-- when serving the page with other web servers, e.g. lighttpd --> | ||
| <!-- <meta name="fhemweb_url" content="http://fhem.local:8083/fhem/"> --> | ||
| <title>FTUI Example Icon</title> | ||
|
|
@@ -45,7 +49,7 @@ | |
|
|
||
| <ftui-column> | ||
| <!-- binding short--> | ||
| <ftui-icon [name]="dummy1 | map('on:lightbulb-on, off:lightbulb')" [rgb]="HUEDevice6:rgb"> | ||
| <ftui-icon [name]="dummy1 | map('on:lightbulb-on, off:lightbulb')" [rgb]="HUEDevice20:rgb"> | ||
| </ftui-icon> | ||
|
|
||
| <ftui-label [text]="dummy1"></ftui-label> | ||
|
|
@@ -187,6 +191,18 @@ | |
| <ftui-label [text]="AgroWeather:wind" unit="km/h"></ftui-label> | ||
| </ftui-grid-tile> | ||
|
|
||
| <ftui-grid-tile row="7" col="13" height="4" width="2"> | ||
| <header>attribute-binding Logic-OR</header> | ||
| <!-- color change via Style rule--> | ||
| <ftui-icon name="file" | ||
| [attr.data-val1]="local:val1" | ||
| [attr.data-val2]="local:val2"> | ||
| </ftui-icon> | ||
| <ftui-switch [(value)]="local:val1"></ftui-switch> | ||
| <ftui-switch [(value)]="local:val2"></ftui-switch> | ||
| </ftui-grid-tile> | ||
|
|
||
|
|
||
| </ftui-grid> | ||
| </body> | ||
|
|
||
|
|
||
Oops, something went wrong.