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

[mctom]

Hallo zusammen,

ich bin nun auch dabei langsam von CCU.IO auf ioBroker zu wechseln.

Als erstes möchte ich gerne in VIS ein neues Frontend aufbauen.

Wie bei CCU.IO würde ich gerne die jqui-Widgets nutzen. Hier kann ich ja verschiedene Layouts auswählen.

Wenn ich nun gerne mein eigenes Layout erstellen möchte, wo finde ich hierzu die CSS Files?

Zusätzlich gibt es noch nicht bei allen Widgest eine Vorschau. Wie kann ich unterstützen, dass auch hier Vorschau Bilder hinterlegt werden?

Gruß

Michael

[Homoran]

@mctom:

Zusätzlich gibt es noch nicht bei allen Widgest eine Vorschau. Wie kann ich unterstützen, dass auch hier Vorschau Bilder hinterlegt werden? `

ich weiß, dass Smiling Jack oder Bluefox schon mal darum gebeten hatten und auch geschrieben, wie.

Ich kann ums Verr…. diesen Post nicht mehr finden.

Gruß

Rainer

[Bluefox]

@mctom:

Hallo zusammen,

ich bin nun auch dabei langsam von CCU.IO auf ioBroker zu wechseln.

Als erstes möchte ich gerne in VIS ein neues Frontend aufbauen.

Wie bei CCU.IO würde ich gerne die jqui-Widgets nutzen. Hier kann ich ja verschiedene Layouts auswählen.

Wenn ich nun gerne mein eigenes Layout erstellen möchte, wo finde ich hierzu die CSS Files?

Zusätzlich gibt es noch nicht bei allen Widgest eine Vorschau. Wie kann ich unterstützen, dass auch hier Vorschau Bilder hinterlegt werden?

Gruß

Michael `
Gut, dass du es angesprochen hast. Ich habe gleich einen Bug gegunden.

Trotzdem kann man schon arbeiten.

Um eigene CSS zu erstellen gibt es CSS Lasche:

Dabei, wenn du "Global" auswählst, dann wird es für alle deine Projekte (Instanzen) benutzt. Wenn "Projekt", dann nur für aktueles (main) Projekt.

Mit Global kann man sogar "load screen" modifizieren.

Es gibt nur einen Bug, wenn du jQueryUI css editierst, dann werden die nur in runtime angezeigt und nicht gleich, als du editierst.

[Bluefox]

Es geht momentan mit

.ui-button {
     background: red !important;
}

Ab der nächste Version wird es mit

#visview_VIEWNAME .ui-button {
     background: red;
}

gehen.

[mctom]

Hi, Danke für dein Feedback.

2 Fragen Anmerkungen noch dazu.

1. Kann ich die Werte auch direkt in dem CSS File ändern ? Wenn ja wo finde ich das? Habe s leider nicht gefunden ?

2. Wenn ich deine Methode nutze:

.ui-button {
     background: red !important;
}

Ändern sich auch verschiedene Icons im Menü. Ich weiss nicht ob das so gewollt ist.

[Bluefox]

> Kann ich die Werte auch direkt in dem CSS File ändern ?
Nein. Das geht nicht mehr.

Du kannst aber die jQuery UI CSS überladen.

In der neuen Version 0.5.2 du kannst so Background setzten:

#visview_VIEWNAME .ui-button {
     background: red;
}

```` ![48_css.gif](/assets/uploads/files/48_css.gif) 

[Coffeelover]

Hi zusammen,

ich krame hier ein uraltes Thema aus - aber meine Frage passt genau dazu.
Ich habe über o.g. CSS Button editiert. Dies muss ich aber für jede View in CSS kopieren. Gibt es einen einfacheren Weg, dies für alle View / ausgewählte Views gemeinsam einzustellen?

VG