Skip to content

Commit

Permalink
fix image paths in interactive background docs (#2402)
Browse files Browse the repository at this point in the history
Signed-off-by: Stefan Höhn <mail@stefanhoehn.com>
  • Loading branch information
stefan-hoehn authored Nov 12, 2024
1 parent b0dea49 commit fe07818
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions ui/layout-pages-fixed.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ The user interface tries to help you to determine the CSS resolution by showing

### Fixed Grid Layouts

To define your screen size open the ![configure-grid.png](images%2Fconfigure-grid.png) menu and click **Configure Grid Layout**.
To define your screen size open the ![configure-grid.png](images/configure-grid.png) menu and click **Configure Grid Layout**.

The layout editor shows a gray surface as the _virtual screen area_, which represents your defined screen.
You can now place widgets on that screen by clicking the **Add Widget** button.
Expand Down Expand Up @@ -84,7 +84,7 @@ Defaults to false.

### Fixed Canvas Layouts

To define your screen size open the canvas menu ![configure-canvas.png](images%2Fconfigure-canvas.png) and click **Configure Canvas Layout**.
To define your screen size open the canvas menu ![configure-canvas.png](images/configure-canvas.png) and click **Configure Canvas Layout**.

The layout editor shows a gray surface as the _virtual screen area_, which represents your defined screen.
You can now place widgets on that screen by clicking the **Add Widget** button.
Expand Down Expand Up @@ -271,7 +271,7 @@ A good example is the following bulb.
The left image shows the bulb in the OFF state and the right image shows the bulb in the ON state.
In this case we do apply a color based on the state but enable / disable a proxy element in that group that makes up the bulb object.
![interactive-bulb-off.png](images%2Finteractive-bulb-off.png) ![interactive-bulb-on.png](images%2Finteractive-bulb-on.png)
![interactive-bulb-off.png](images/interactive-bulb-off.png) ![interactive-bulb-on.png](images/interactive-bulb-on.png)
The way this can be achieved by indication a proxy element, an element that is part of that group.
Similarly like the main element is marked with an `openhab` attribute, the proxy element is marked with a special attribte, the `flash` attribute.
Expand Down Expand Up @@ -342,7 +342,7 @@ They can be added to SVG text file in the same way it is added to HTML files.
Here is a simple example that works with the above astronaut to create a fading in/out animation:
![interactive-style.png](images%2Finteractive-style.png)
![interactive-style.png](images/interactive-style.png)
The above setting for _Set Style Class based on ON_ will apply the class `animate` to the element with the id 'astro_animate'.
Expand Down

0 comments on commit fe07818

Please sign in to comment.