<![CDATA[Hilfe bei Widget benötigt]]>Hallo zusammen,

ich überarbeite gerade meine Instanz-Übesicht in der VIS und möchte gerne aus aktuell zwei Widgets pro Instanz ein Widget machen:

IST:
9699ff61-79d5-45e2-bf79-601eabff0da2-grafik.png

Jetzt habe ich ein paar Probleme
e207bb2f-7ce1-4bdf-b853-67ae7a1794d4-grafik.png

  1. Leider bekomme ich es nicht hin, dass der Text unter dem Icon angezeigt wird
  2. Ich bekommen den graußen Hintergrund nicht weg
  3. Mit dem Icon soll die Instant aktiviert / deaktiviert werden. Funktionieert leider auch nicht

So sehen die DPs für das Widget aus:
14e47b7d-81e4-4ad4-b9b3-d1d770f68078-grafik.png

Hier noch der Export vom Widget

]]>https://forum.iobroker.net/topic/61699/hilfe-bei-widget-benötigtRSS for NodeFri, 03 Apr 2026 18:45:14 GMTWed, 04 Jan 2023 12:29:01 GMT60<![CDATA[Reply to Hilfe bei Widget benötigt on Thu, 05 Jan 2023 05:26:29 GMT]]>@djmarc75 funktoniert bei mir irgendwie nicht so ganz

2b246aff-b02f-4d1c-a737-2eab63afe69a-grafik.png

5dbb316c-db1e-4151-aa1c-1c7f6847fb81-grafik.png

feab6f45-8e96-4482-9ceb-13058cd93396-grafik.png

Ich hab mir mal irgendwo das Material Design von Uhula per CSS importert, deswegen ist bei mit im CSS Reiter sehl viel enthalten.

CSS:
css.txt

Skripte
css.txt

Da ich von CSS keine Ahnung habe, weiß ich nicht, was genau da nicht passt.

]]>https://forum.iobroker.net/post/922414https://forum.iobroker.net/post/922414Thu, 05 Jan 2023 05:26:29 GMT<![CDATA[Reply to Hilfe bei Widget benötigt on Wed, 04 Jan 2023 14:44:44 GMT]]>@kuddel sagte in Hilfe bei Widget benötigt:

Bleibt also nur noch das Zentrieren des Namens

Ohne CSS wird das nicht easy gehen:

.mitte2{
        float: right;
        display: flex;

    align-items: center; /* vertikal*/

    justify-content: center; /* horizontal */
    text-align: center;
    vertical-align: central;
    font-size: 40px;
    font-weight: bold;
    font-family: RobotoCondensed-Light;
    color:white;
    text-shadow: rgba(0, 0, 0, 0.9) 3px 3px 4px;
}

grad mal eins geschrieben und folgendes Ergebnis:

Screenshot 2023-01-04 153817.png

Widget hab ich da auf dem Bild nicht angepasst sondern nur das CSS "mitte2" (sorry für den einfallslosen Namen) oben im Widget unter CSS-Klasse eingetragen.

Screenshot 2023-01-04 154011.png

Edit:

für die CSS eigentlich nur folgendes interessant:

.mitte2{
        float: right;
        display: flex;

    align-items: center; /* vertikal*/

    justify-content: center; /* horizontal */
    text-align: center;
    vertical-align: central;
}
]]>https://forum.iobroker.net/post/921929https://forum.iobroker.net/post/921929Wed, 04 Jan 2023 14:44:44 GMT<![CDATA[Reply to Hilfe bei Widget benötigt on Wed, 04 Jan 2023 14:28:49 GMT]]>@homoran sagte in Hilfe bei Widget benötigt:

text - align - center

nicht bei dem Widget

09bc0c66-7064-428d-8d31-d0a4a73c334f-image.png

]]>https://forum.iobroker.net/post/921923https://forum.iobroker.net/post/921923Wed, 04 Jan 2023 14:28:49 GMT<![CDATA[Reply to Hilfe bei Widget benötigt on Wed, 04 Jan 2023 14:01:20 GMT]]>@kuddel sagte in Hilfe bei Widget benötigt:

Zentrieren geht ja leider nicht

wieso nicht?
text - align - center

]]>https://forum.iobroker.net/post/921912https://forum.iobroker.net/post/921912Wed, 04 Jan 2023 14:01:20 GMT<![CDATA[Reply to Hilfe bei Widget benötigt on Wed, 04 Jan 2023 12:53:32 GMT]]>@negalein danke dir für die schneller Antwort.

Mit dem "Offset links" kann ma den Text zwar verschieben, aber je nach Länge des Instanz-Names muss da ja ein anderer Wert rein.

Zentrieren geht ja leider nicht

EDIT: Da schalten der Instanz über das Widget funzt jetzt auch. Habe mich beim DP vertippt.

Bleibt also nur noch das Zentrieren des Namens

]]>https://forum.iobroker.net/post/921872https://forum.iobroker.net/post/921872Wed, 04 Jan 2023 12:53:32 GMT<![CDATA[Reply to Hilfe bei Widget benötigt on Wed, 04 Jan 2023 12:47:51 GMT]]>@kuddel sagte in Hilfe bei Widget benötigt:

Leider bekomme ich es nicht hin, dass der Text unter dem Icon angezeigt wird

58dbbbcb-f0be-45a5-93ca-4512cf74ab9d-image.png
ca20ed48-f2f1-4e0b-9bc9-28fb4d4ebe68-image.png

Ich bekommen den graußen Hintergrund nicht weg

a5325fb0-cf80-407c-8755-f250c80d634d-image.png

]]>https://forum.iobroker.net/post/921870https://forum.iobroker.net/post/921870Wed, 04 Jan 2023 12:47:51 GMT