Autor Thema: progress - Farbe vom Label  (Gelesen 1072 mal)

Offline Det20

  • Sr. Member
  • ****
  • Beiträge: 566
progress - Farbe vom Label
« am: 27 November 2017, 08:54:03 »
Hallo,

eine kurze Frage, ich komme leider nicht so recht weiter. Kann ich die Farbe vom Label innerhalb vom progress Widget ändern? Aktuell ist die grau, passt aber nicht zu meinem Hintergrundbild.

Offline setstate

  • Hero Member
  • *****
  • Beiträge: 3942
  • FHEM TabletUI
    • FHEM Tablet UI
Antw:progress - Farbe vom Label
« Antwort #1 am: 27 November 2017, 16:38:30 »
Hast du schon data-on-color probiert?

Offline Det20

  • Sr. Member
  • ****
  • Beiträge: 566
Antw:progress - Farbe vom Label
« Antwort #2 am: 27 November 2017, 16:48:38 »
Ja, bei mir tut sich da nix.

Offline setstate

  • Hero Member
  • *****
  • Beiträge: 3942
  • FHEM TabletUI
    • FHEM Tablet UI
Antw:progress - Farbe vom Label
« Antwort #3 am: 27 November 2017, 18:23:32 »
Mmmm, nach 2 Minuten habe ich auch gemerkt, dass das nur den Ring ändert.

Man muss in seiner css/fhem-tablet-ui-user.css das per CSS vorgeben.

.progress.value {
 color: #8bd !important;
}

Offline Det20

  • Sr. Member
  • ****
  • Beiträge: 566
Antw:progress - Farbe vom Label
« Antwort #4 am: 28 November 2017, 10:39:50 »
Klappt super, das habe ich gesucht. Vielen Dank!

Offline dt2510

  • Sr. Member
  • ****
  • Beiträge: 606
Antw:progress - Farbe vom Label
« Antwort #5 am: 18 Oktober 2019, 10:48:02 »
Die Farbe von Ring und das Label hab' ich schon mit eigenen Farbangaben per css ändern können  - das Label wie oben beschrieben und den Kreis per data-off-background-color mit eigener Farbangabe im css.

Was mir leider nicht gelingt ist den Fortschrittsbalken selbst per css-Farbe einzufärben. In meinem css ist die Farbe folgendermaßen definiert (wie etliche andere auch)
.progress_valve {color:#FFA500;} /* Orange */
Folgende Ergebnisse liefert die Angabe von data-on-color

- data-on-color="orange" (#FFA500) -> orangener Balken (#FFA500)
- data-on-color="progress_valve" (#FFA500) -> schwarzer Balken (#000000)
- ohne Angabe von data-on-color -> Balken in der Standardfarbe (#AA6900)

Da ich abhängig von der Tageszeit unterschiedliche Farben (Tag/Nacht Modus) nutzen möchte, muss ich natürlich auch ALLE Farben, die ich in FTUI verwende in der css.Datei definieren und auch in meinem HTML angeben. Leider finde ich für den Balken bisher noch keine Lösung ...

Hinweis: ich habe die Datei fhem-tablet-ui.css NICHT in meiner index.html eingebunden, sondern verwende ausschließlich eigene Positions-, Größen- und Farbangaben. Daher greift auch die umdefinition von .orange in der fhem-tablet-ui.css hier nicht, sondern liefert das gleiche Ergebnis wie "Orange".
« Letzte Änderung: 18 Oktober 2019, 10:53:29 von dt2510 »

Offline dt2510

  • Sr. Member
  • ****
  • Beiträge: 606
Antw:progress - Farbe vom Label
« Antwort #6 am: 21 Oktober 2019, 10:06:09 »
ich hab' mal zwei Screenshots angehängt ... den 1. mit meiner eigenen Farbangabe "progress_valve" (gleicher Farbwert wie "Orange"), den 2. mit der Farbangabe "Orange". Ich hab' die Javascript Files und tabletui css-Files schon durchsucht aber kann absolut nix finden ...

Offline yersinia

  • Full Member
  • ***
  • Beiträge: 299
    • Cyanide & Happiness
Antw:progress - Farbe vom Label
« Antwort #7 am: 21 Oktober 2019, 11:44:34 »
Sicher, dass es so funktioniert? Im progress widget code steht dazu zB folgendes:
[23]     elem.initData('on-color', ftui.getClassColor(elem) || ftui.getStyle('.' + me.widgetname + '.on', 'color') || '#aa6900');Ich verstehe das so (möglicherweise falsch): wenn data-on-color gesetzt ist, prüfe
1. ob die CSS Farbe existiert und übernimm' diese; wenn nicht dann prüfe
2. ob es einen Style Definition für .progress.on gibt und übernimm' diese; wenn nicht dann
3. belege die Farbe #aa6900 vor

Anstelle von
.progress_valve {color:#FFA500;} /* Orange */müsste doch dann
.progress.on {color:#FFA500;} /* Orange */die Farben definieren, oder?

Vorausgesetzt, ich interpretiere den Code korrekt.
viele Grüße, yersinia
----
FHEM 5.9 on RPi 3B with Raspian Stretch (perl 5.24.1) | FTUI
nanoCUL@a-culfw-> 2x868 (1x ser2net), 1x433 | ESPEasy
VCCU->7xHM-CC-RT-DN, 5xHM-LC-Bl1PBU-FM, 14xHM-SEC-SCo, 1xHM-PB-2-WM55, 1xHM-LC-Sw1PBU-FM, 1xHM-ES-PMSw1-Pl

Offline dt2510

  • Sr. Member
  • ****
  • Beiträge: 606
Antw:progress - Farbe vom Label
« Antwort #8 am: 21 Oktober 2019, 11:48:23 »
Das war es tatsächlich  :o

Ich weiß gar nicht, was ich alles ausprobiert habe ... danke !!!