Jahresrückblick 2025 – unser neuer Blogbeitrag ist online! ✨

[Glasfaser]

@Almixx

Bitte kein Externen Link´s .

Nutze den Upload über die Wolke im Editor

EDIT .... habe leider auch keine Lupe ;)

[Almixx]

@Glasfaser muss mich erst mal zurechtfinden ;-)

[Glasfaser]

@Almixx

.

Widget

[{"tpl":"tplJquiButtonNav","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":"WGR ein ","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"class":""},"style":{"left":"283px","top":"351px","width":"171px","height":"54px","border-color":"silver","border-style":"outset","border-radius":"1px","border-width":"8px"},"widgetSet":"jqui"}]

[Almixx]

@Glasfaser dankeschön.

[Glasfaser]

@Almixx
hier mit Zustand ... wie auf deinem Bild

hier dein Datenpunkt eintragen :

Widget

[{"tpl":"tplJquiButtonNav","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","buttontext":"WGR ein ","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"class":"{wert:0_userdata.0.Test123; wert==\"true\" ? \"UiStyle\" : \" \" }"},"style":{"left":"283px","top":"351px","width":"171px","height":"54px","border-color":"silver","border-style":"outset","border-radius":"1px","border-width":"8px"},"widgetSet":"jqui"}]

CSS in Projekt eintragen

.UiStyle .ui-button {
background: green !important;
}

[Almixx]

@Glasfaser
Ich bekomme das irgendwie nicht hin... Im Reiter CSS 2 Buttons angelegt, normalen und aktiven, aber verfärben tut sich in der vis gar nichts... unter CSS Klasse habe ich "button_test" eingegeben. :confounded: :thinking_face:

.button_test
    {
        height:50px;
    	width:100px;
    	line-height:20px;
        text-align:center;
        vertical-align:middle;
    	border:silver solid 3px;
        border-radius: 5px;
    	font-size:22px;
    	background: silver;
        color:white;
    }
.button_test :active
    {
        height:50px;
    	width:100px;
    	line-height:20px;
        text-align:center;
        vertical-align:middle;
    	border:#47aaff solid 3px;
        border-radius: 5px;
    	font-size:22px;
    	background: silver;
        color:white;
    }

[Glasfaser]

@Almixx

keine Ahnung was du machen willst ..

aber setze mal dahinter

!important;

.button_test
    {
        height:50px !important;
    	width:100px !important;

[Almixx]

@Glasfaser
möchte das der Rahmen bei Betätigung des Buttons die Farbe ändert

[Glasfaser]

@Almixx

hier eintragen (Datenpunkt anpassen ) :

{wert:0_userdata.0.Test123; wert=="true" ? "green" : "silver" }

[pix]

@Almixx Denke bitte daran, das Bindings ("{}") nicht im Edit-Modus von VIS funktionieren. Also zum Testen immer die Runtime-Version laden (Playknopf oben rechts).

@Glasfaser hat dir zwei Möglichkeiten der Formatierung angeboten. Du kannst das Aussehen des Buttons über die CSS Ränder Einstellungen des Widgets einstellen. Mit Hilfe eines Bindings kann das abhängig vom Zustand des Datenpunkts "0_userdata.0.Test123" gemacht werden. Ist der Datenpunkt true, wird's grün, sonst silber.
Für die erste Lösung von @Glasfaser musst du den CSS-Code in den Reiter CSS packen und per Klasse aufrufen. Wenn das Element (hier das Widget mit dem Rand) die Klasse "UiStyle" hat, wird es - wie im CSS-Code hinterlegt - formatiert. Damit es diese Klasse bekommt, hat @Glasfaser wieder ein Binding genutzt. Wenn der Datenpunkt wahr ist, heißt die Klasse "UiStyle" und das Widget wird entsprechend formatiert. Ist er falsch, wird keine Klasse gesetzt, es passiert nix.

Das ist aber keine Reaktion auf den Klick/Touch, sonder auf den Zustand des Datenpunkts. Für Klick/touch kannst du "active" nehmen. Dann sollte eine extra CSS-Klasse (im Reiter "Generell") dauerhaft gesetzt werden. ZB. "aktiv_bei_touch". Im CSS-Reiter formatierst du dann so

.aktiv_bei_touch:active {
   border: 5px dotted red;
}
.aktiv_bei_touch {
  border: 5px solid green;
}

Wenn das Widget dann aktiv ist (geklickt oder touched), sollte es kurz die Erscheinung ändern. Das geht mit jedem Widget.

Gruß
Pix

[Almixx]

@pix @Glasfaser , vielen Dank an euch, hat jetzt endlich funktioniert, obwohl ich das gestern schonmal so probiert hatte..
Mir ist aber aufgefallen, daß sich beim jqui-ctrl-Icon die Backgroundfarbe ändern lässt, beim state Button hingegen nicht. Auch nicht mit !important möglich. Ist das so? oder muß ich noch was beachten.
Nicht verwirren lassen, experementiere mit verschiedenen Designs für Buttons :see_no_evil: :relaxed:

[Glasfaser]

@Almixx sagte in Border in 3D Optik:

die Backgroundfarbe ändern lässt , beim state Button hingegen nicht

funktioniert doch ..

[Almixx]

@Glasfaser
Ich muß noch mal nerven :see_no_evil:
Die State Buttons funktionieren nicht, nur an den Ecken sieht man ganz leicht die Farbe durchschimmern. Nimmt auch Schriftgröße etc. so nicht an...

.button_rollo
    {
        height:40px !important;
    	width:100px !important;
    	line-height: 22px !important;
        text-align:center !important;
        border-radius: 5px;
        border-style: outset;
        vertical-align:middle !important;
    	border-radius: 5px !important;
    	font-size: 20px !important;
    	background: linear-gradient(0deg, red, yellow) !important;
        color:white;
    }

Farbe hab ich übrigens mal bewusst so gesetzt :blush:

[Glasfaser]

@Almixx

Stelle mir mal die gesamte Widget wie du es oben eingestellt hast mal zur Verfügung , damit ich es überprüfen kann .
Ich denke mal das ist ein Dialog View und du hast diese Rollo Büro in einem extra View.

... oder das View , wäre natürlich auch besser .

setze es dann auch in ein Spoiler ( ist das Augensymbol )

Spoiler

hier dein View

[Glasfaser]

@Almixx sagte in Border in 3D Optik:

nimm mal das :

.button_rollo .ui-button
    {
        height:40px !important;
    	width:100px !important;
    	line-height: 22px !important;
        text-align:center !important;
        border-radius: 5px;
        border-style: outset;
        vertical-align:middle !important;
    	border-radius: 5px !important;
    	font-size: 20px !important;
    	background: linear-gradient(0deg, red, yellow) !important;
        color:white;
    }

[Almixx]

@Glasfaser probier ich später mal, bin noch auf schicht... danke

[Almixx]

@Glasfaser, hat zum Teil funktioniert. Die Hintergrundfarbe passte jetzt, dafür wurde der Button etwas kleiner. Die toggle Buttons änderten sich total in den Abmessungen. Was bewirkt dieses .ui-button?

Spoiler

{
  "settings": {
    "style": {
      "background": "",
      "background_class": ""
    },
    "theme": "dark-hive",
    "sizex": "1381",
    "sizey": "671",
    "gridSize": "",
    "useBackground": true,
    "snapType": null,
    "useAsDefault": true
  },
  "widgets": {
    "e00001": {
      "tpl": "tplMfdShutter",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Position",
        "g_fixed": true,
        "g_visibility": true,
        "g_css_font_text": false,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": false,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "asButton": false,
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "min": "0",
        "max": "100",
        "show_active": false,
        "invert_icon": false,
        "iconColor": "#ffffff",
        "iconColor0": ""
      },
      "style": {
        "left": "268px",
        "top": "110px",
        "width": "140px",
        "height": "156px",
        "z-index": "1"
      },
      "widgetSet": "jqui-mfd"
    },
    "e00002": {
      "tpl": "tplFrame",
      "data": {
        "visibility-cond": "==",
        "visibility-val": 1,
        "title": "Rollo Büro",
        "title_color": "black",
        "title_top": "5",
        "title_left": "5",
        "header_height": "30",
        "header_color": "#47aaff",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": "1",
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "visibility-groups-action": "hide",
        "name": "Rollo Büro",
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "DD.MM.YYYY hh:mm:ss",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "title_font": "",
        "gestures-swipeRight-limit": "7",
        "gestures-swiping-minimum": "-3",
        "gestures-rotateRight-limit": "0",
        "gestures-rotating-delta": "2"
      },
      "style": {
        "left": "50px",
        "top": "111px",
        "width": "351px",
        "height": "243px",
        "font-family": "Verdana, Geneva, sans-serif",
        "font-style": "normal",
        "font-variant": "normal",
        "font-weight": "bold",
        "font-size": "large",
        "z-index": "0",
        "background": "",
        "border-width": "5px",
        "border-style": "solid",
        "border-color": "#9f9d9d",
        "border-radius": "4px",
        "opacity": "",
        "background-color": "",
        "box-shadow": "4px 4px 4px rgba(4, 4, 4, 4)"
      },
      "widgetSet": "basic"
    },
    "e00003": {
      "tpl": "tplValueFloatBar",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Position",
        "visibility-cond": "==",
        "visibility-val": 1,
        "factor": "1",
        "color": "#47aaff",
        "min": "0",
        "max": "100",
        "orientation": "horizontal",
        "gestures-offsetX": 0,
        "gestures-offsetY": 0,
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "visibility-groups-action": "hide",
        "name": "",
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "comment": "",
        "reverse": false
      },
      "style": {
        "left": "77px",
        "top": "192px",
        "width": "200px",
        "height": "16px",
        "border-color": "white",
        "border-radius": "5px",
        "border-width": "1px",
        "border-style": "solid",
        "z-index": "1"
      },
      "widgetSet": "basic"
    },
    "e00004": {
      "tpl": "tplValueFloat",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Position",
        "visibility-cond": "==",
        "visibility-val": 1,
        "is_comma": false,
        "factor": "1",
        "html_append_singular": " %",
        "html_append_plural": " %",
        "is_tdp": false,
        "gestures-offsetX": 0,
        "gestures-offsetY": 0,
        "digits": "0",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "visibility-groups-action": "hide",
        "html_prepend": "Rollostand: ",
        "name": "",
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0
      },
      "style": {
        "left": "107px",
        "top": "161px",
        "width": "151px",
        "height": "21px",
        "color": "white",
        "text-align": "center",
        "font-family": "Verdana, Geneva, sans-serif",
        "font-style": "normal",
        "font-variant": "normal",
        "font-weight": "bold",
        "font-size": "small",
        "z-index": "1",
        "border-width": "1px",
        "border-style": "none",
        "border-color": "white",
        "border-radius": "0px"
      },
      "widgetSet": "basic"
    },
    "e00005": {
      "tpl": "tplValueLastchange",
      "data": {
        "oid": "hm-rpc.1.PEQ0011956.1.LEVEL",
        "visibility-cond": "==",
        "visibility-val": 1,
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "format_date": "DD.MM.YYYY um hh:mm:ss Uhr",
        "html_prepend": "<b>Letzte Einstellung: </b>",
        "visibility-groups-action": "hide",
        "name": "",
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0
      },
      "style": {
        "left": "59px",
        "top": "336px",
        "width": "341px",
        "font-style": "normal",
        "font-variant": "normal",
        "font-size": "x-small",
        "height": "9px",
        "color": "rgb(38, 179, 247)",
        "z-index": "1",
        "text-align": "center"
      },
      "widgetSet": "basic"
    },
    "e00006": {
      "tpl": "tplJquiButtonState",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Pause",
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "buttontext": "Stop",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "value": "true",
        "class": "button_rollo"
      },
      "style": {
        "left": "180px",
        "top": "231px",
        "width": "",
        "height": "",
        "z-index": "1",
        "font-family": "Verdana, Geneva, sans-serif",
        "border-width": "3px",
        "border-style": "outset",
        "border-color": "{wert:shelly.0.SHSW-25#69397C#1.Shutter.Pause; wert==\"true\" ? \"#47aaff\" : \"silver\" }",
        "border-radius": "5px"
      },
      "widgetSet": "jqui"
    },
    "e00007": {
      "tpl": "tplJquiRadioList",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Position",
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "values": "25;50;75",
        "texts": " 25%; 50%; 75%",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "class": ""
      },
      "style": {
        "left": "116px",
        "top": "289px",
        "font-family": "",
        "font-variant": "",
        "font-weight": "",
        "z-index": "1",
        "height": "",
        "width": "225px",
        "border-width": "2px",
        "border-style": "outset",
        "border-color": "silver",
        "border-radius": "5px",
        "position": ""
      },
      "widgetSet": "jqui"
    },
    "e00008": {
      "tpl": "tplJquiToogle",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Close",
        "g_fixed": true,
        "g_visibility": false,
        "g_css_font_text": true,
        "g_css_background": true,
        "g_css_shadow_padding": false,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "class": "button_rollo",
        "label": "Zu"
      },
      "style": {
        "left": "66px",
        "top": "231px",
        "width": "",
        "height": "",
        "background-color": "",
        "border-color": "{wert:shelly.0.SHSW-25#69397C#1.Shutter.Close; wert==\"true\" ? \"#47aaff\" : \"silver\" }",
        "text-align": "",
        "font-weight": "",
        "font-family": "",
        "border-width": "3px",
        "border-radius": "5px",
        "border-style": "outset",
        "z-index": "1"
      },
      "widgetSet": "jqui"
    },
    "e00009": {
      "tpl": "tplJquiToogle",
      "data": {
        "oid": "shelly.0.SHSW-25#69397C#1.Shutter.Open",
        "g_fixed": true,
        "g_visibility": true,
        "g_css_font_text": false,
        "g_css_background": false,
        "g_css_shadow_padding": false,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "class": "button_rollo",
        "label": "Auf"
      },
      "style": {
        "left": "293px",
        "top": "231px",
        "border-color": "{wert:shelly.0.SHSW-25#69397C#1.Shutter.Open; wert==\"true\" ? \"#47aaff\" : \"silver\" }",
        "border-width": "3px",
        "border-style": "outset",
        "border-radius": "5px",
        "z-index": "1"
      },
      "widgetSet": "jqui"
    },
    "e00010": {
      "tpl": "tplContainerView",
      "data": {
        "g_fixed": true,
        "g_visibility": true,
        "g_css_font_text": true,
        "g_css_background": true,
        "g_css_shadow_padding": true,
        "g_css_border": true,
        "g_gestures": false,
        "g_signals": false,
        "g_last_change": false,
        "visibility-cond": "==",
        "visibility-val": 1,
        "visibility-groups-action": "hide",
        "signals-cond-0": "==",
        "signals-val-0": true,
        "signals-icon-0": "/vis/signals/lowbattery.png",
        "signals-icon-size-0": 0,
        "signals-blink-0": false,
        "signals-horz-0": 0,
        "signals-vert-0": 0,
        "signals-hide-edit-0": false,
        "signals-cond-1": "==",
        "signals-val-1": true,
        "signals-icon-1": "/vis/signals/lowbattery.png",
        "signals-icon-size-1": 0,
        "signals-blink-1": false,
        "signals-horz-1": 0,
        "signals-vert-1": 0,
        "signals-hide-edit-1": false,
        "signals-cond-2": "==",
        "signals-val-2": true,
        "signals-icon-2": "/vis/signals/lowbattery.png",
        "signals-icon-size-2": 0,
        "signals-blink-2": false,
        "signals-horz-2": 0,
        "signals-vert-2": 0,
        "signals-hide-edit-2": false,
        "lc-type": "last-change",
        "lc-is-interval": true,
        "lc-is-moment": false,
        "lc-format": "",
        "lc-position-vert": "top",
        "lc-position-horz": "right",
        "lc-offset-vert": 0,
        "lc-offset-horz": 0,
        "lc-font-size": "12px",
        "lc-font-family": "",
        "lc-font-style": "",
        "lc-bkg-color": "",
        "lc-color": "",
        "lc-border-width": "0",
        "lc-border-style": "",
        "lc-border-color": "",
        "lc-border-radius": 10,
        "lc-zindex": 0,
        "contains_view": "Navigation",
        "views": [
          "EG",
          "Heiz_EG",
          "Heiz_OG",
          "Heiz_UG",
          "Heizung",
          "Netzwerk",
          "OG",
          "Rollos",
          "Start",
          "Tankstellen",
          "UG"
        ]
      },
      "style": {
        "left": "128px",
        "top": "-8px",
        "width": "958px",
        "height": "94px",
        "z-index": "1"
      },
      "widgetSet": "basic"
    }
  },
  "name": "Rollos",
  "filterList": []
}

[Glasfaser]

@Almixx sagte in Border in 3D Optik:

Was bewirkt dieses .ui-button

Zuweisung zu diesem Widget Typ !

[Almixx]

@Glasfaser
das heißt also ich muß es für alle widget typen seperat machen?
Weil wenn ich die anderen ebenfalls mit der Klasse zuweise stimmen die nicht mehr,s.o.
Bin noch sehr unerfahren mit CSS, versuche aber zu lernen...

[Glasfaser]

@Almixx

ausschlagebend ist

.button_rollo .ui-button

im Widget eingetragen unter CSS button_rollo ist dann nur dieses Widget gemeint .

die CSS verändert ... sagen wir mal Hintergrund grün

.button_rollo1 .ui-button

im Widget eingetragen unter CSS button_rollo1 ist dann nur dieses Widget gemeint .

Dein View funktioniert nicht , setze es in Code-Tags </>