From fe0781858d55cca9471deaa3a3a41036a2de5c87 Mon Sep 17 00:00:00 2001 From: stefan-hoehn Date: Tue, 12 Nov 2024 18:25:15 +0100 Subject: [PATCH] fix image paths in interactive background docs (#2402) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: Stefan Höhn --- ui/layout-pages-fixed.md | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/ui/layout-pages-fixed.md b/ui/layout-pages-fixed.md index 78b80b9bf6..7124d2e7ab 100644 --- a/ui/layout-pages-fixed.md +++ b/ui/layout-pages-fixed.md @@ -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. @@ -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. @@ -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. @@ -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'.