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

[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 </>

[Almixx]

@Glasfaser , View funktioniert nicht, hier mal das komplette Widget

[{"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"},{"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"},{"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"},{"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"},{"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"},{"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":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","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_rollo2"},"style":{"left":"180px","top":"231px","width":"98","height":"40","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"},{"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"},{"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_rollo1","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"},{"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_rollo1","label":"Auf"},"style":{"left":"292px","top":"232px","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"}]

[Almixx]

@Glasfaser

{
  "settings": {
    "style": {
      "background": "",
      "background_class": ""
    },
    "theme": "dark-hive",
    "sizex": "1381",
    "sizey": "671",
    "gridSize": "",
    "useBackground": true,
    "snapType": null,
    "useAsDefault": true,
    "class": ""
  },
  "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": 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",
        "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": "98px",
        "height": "40px",
        "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": "292px",
        "top": "232px",
        "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

Dein Widget sehen so bei mir aus .
.

Lösche die defekten und füge neue hinzu

[Almixx]

@Glasfaser
bringt nichts. sobald das .ui-button setze, verändern sich diese toggle button, ohne Eintrag funktioniert es.
Nur der state button reagiert zumindest bei der background Farbe
Ist das denn so kompliziert? :confused:

[Glasfaser]

@Almixx

Button zu und auf bekommen CSS UiStyle

Button Stop bekommen CSS UiStyle1

damit du siehst was ich meine ... nimm mal das

.UiStyle {
 background: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important;
}

.UiStyle1 .ui-button {
 background: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important;
}

[Almixx]

@Glasfaser
das habe ich auch so gemacht. Funktioniert aber nur eingeschränkt. Border funktioniert, Background Farbverlauf auch, aber Größe und Textposition nicht. Nur der toggle Button von jqui lässt sich problemlos umgestalten, state und nav dagegen nicht, bzw. nur eingeschränkt.
Habe folgende CSS Einträge:

.UiStyle1 .ui-button
    {
        height: 40px !important;
    	width: 100px !important;
    	text-align: center !important;
        vertical-align: middle !important;
    	font-size: 22px !important;
    	background: #383838 !important;
        background: -webkit-linear-gradient(bottom, #383838, #A4A5A5) !important;
        background: -moz-linear-gradient(bottom, #383838, #A4A5A5) !important;
        background: linear-gradient(to top, #383838, #A4A5A5) !important;
    }

in der Vis kommt folgendes raus:

Die Ecken sind noch rund, der Farbverlauf passt nicht wegen der Größe und der Text ist nicht mittig..