Neuer Style: f18

[rudolfkoenig]

Ich habe ein Style eingecheckt, der ein bisschen Hilfe von JavaScript bekommt.
Der Skript wird neuerdings automatisch geladen, wenn eine Datei mit dem Style-Namen existiert.
Ich habe versucht damit ein paar Features zu impementieren wie:
- Menu/Logo und einzelne Blöcke sind optional ausblendbar
- Erkennung von Touchscreen/Smallscreen, d.h. die gleiche FHEMWEB-Instanz soll auf allen Endgeraeten bedienbar sein.
- personalisierte Farben.

Ich habe zwar Kreuz und Quer getestet, bin aber sicher, dass ich nicht alle Varianten bedacht habe, und noch Fehler vorhanden sind. Fehlermeldungen sind mir zusammen mit einem Patch am liebsten. Folgende Probleme kenne ich:
- im commandref werden die Farben nicht angewendet
- wenn das Laden laenger dauert (z.Bsp. wg. Plots), und man nicht die default-Farben verwendet, dann ist ein Flackern zu sehen.

[cwagner]

Vielen Dank Rudolf für diese wertvolle Ergänzung/Option.

Christian

[Hauswart]

Soll dies in Zukunft eventuell mal der neue Default Style sein?

Optisch gibt es an ein paar Stellen sicherlich noch etwas zu optimieren.

[rudolfkoenig]

Soll dies in Zukunft eventuell mal der neue Default Style sein?

Das ist mein plan, dauert es aber noch.

Optisch gibt es an ein paar Stellen sicherlich noch etwas zu optimieren.

Wie immer: ich nehme gerne patches.

[roedert]

kleinen Bug gefunden - einen Patch kann ich allerdings nicht liefern:

Bei einigen Links wechselt der Mauszeiger nicht zum Link-typischen "Finger" wenn man mit der Maus drüberfährt - zB bei "modify <devicename>" wenn man die DEF eines devices ändert oder beim "attr" links neben dem Attribut-Select-Feld in den device-Eigenschaften

Ist jetzt nicht weiter tragisch, aber man denkt immer das wäre gar klein Link zum klicken....

[marvin78]

Liegt vermutlich daran, dass das keine Links sondern Buttons sind.

[roedert]

ahh, stimmt ... die Buttons sind tatsächlich so "umgestylt" dass sie optisch mit einem Link identisch sind

[karl0123]

Der Button "Execute command" der Raw definition verschwindet im neuen Style. Er ist kurz zu sehen und wird dann per display:none versteckt. Vermutlich passiert das ggf. auch bei anderen Buttons. Ich habe schon in die f18.js geschaut, die Ursache aber nicht ausmachen können. Es handelt sich, nicht wie bei anderen Buttons in FHEMWEB um ein button-Tag und nicht um ein input[type=submit]-Tag.

[Amenophis86]

Gefällt mir gut bisher, besonders, dass man sich seine Farben selbst einstellen kann. Würde noch eine Funktion "Auf Werkseinstellung zurücksetzen" einfügen bei der Farbauswahl.

Edit:
Nehme alles zurück, gibt default - light - dark. Habe ich nicht gesehen.

Edit2:
Welche Funktion ich gut finde und quasi bereits vorhanden nur bis dato von Hand eingegeben werden muss, ist die History der Commandbar: https://forum.fhem.de/index.php/topic,68945.0.html denke dies ist es auch Wert als Standard eingebaut zu werden. Vielleicht kann man das mit dem neuen Style verbinden.

[rudolfkoenig]

 

Der Button "Execute command" der Raw definition verschwindet im neuen Style.

Kann ich nicht nachvollziehen, habs mit Chrome und Firefox probiert. Brauche mehr details, evtl. screenshot oder Beispiel-fhem.cfg zum Nachstellen. Passiert das auch mit fhem.cfg.demo?

Bei einigen Links wechselt der Mauszeiger nicht zum Link-typischen "Finger" wenn man mit der Maus drüberfährt

Danke, gefixt.

ist die History der Commandbar

Verstehe den Sinn nicht.Sobald ich was im maininput eintippe, kriege ich vom Browser eine Liste der letzten Befehle, ganz ohne plugin.
 

[Amenophis86]

Danke, gefixt.Verstehe den Sinn nicht.Sobald ich was im maininput eintippe, kriege ich vom Browser eine Liste der letzten Befehle, ganz ohne plugin.

Du meinst den Vorschlag der letzten Eingaben. Habe ich bei Chrome deaktiviert, weil er das nicht für jedes Formular machen soll. Bei FHEM hingegen würde ich es gerne haben. Finde die Funktion auch gut, weil sie Geräte übergreifend ist. Ist aber kein muss, man kann sie ja von Hand nach installieren. Ist mir nur gerade so eingefallen beim testen des neuen Style.

[karl0123]

Kann ich nicht nachvollziehen, habs mit Chrome und Firefox probiert. Brauche mehr details, evtl. screenshot oder Beispiel-fhem.cfg zum Nachstellen.

Ich weiß nicht, wie ich das mit einer Config nachstellen soll!? Es hat nichts mit der Config zu tun. Die Config führt wohl nicht dazu, dass display:none in einem HTML-Element erscheint. Ich habe nichts ab style f18 geändert, sodass die Attribute des FHEMWEB Devices dem Standard entsprechen.

Ein Screenshot ist im Anhang. Hier der Quellcode nach dem Seitenaufbau:

Code: [Auswählen]

<button style="display: none;">Execute commands</button>
Wie gesagt, der Button erscheint kurz und wird dann versteckt. Das mag mit Codemirror zusammenhängen aber im Standardstyle oder auch im darkstyle passiert das nicht.

Noch etwas: Bei gesetztem lonpollSVG wird beim Aktualisierung der Standard-Style für den Plot verwendet (siehe Anhang 2).

[rudolfkoenig]

Wg. Raw definition: bist du sicher, dass du da was geaendert hast? Bei ungeaenderten Inhalt wird der Knopf absichtlich versteckt, mit display:none.
Wg. Plots: danke fuer den Hinweis, ist mir auch aufgefallen, dass die manchmal falsch sind, ist mir aber bisher keine Ursache eingefallen. Werde es spaeter anschauen.

[Invers]

Ich finde das echt cool!
Einzige Bitte um Anpassung wäre, dass der Platz für das Logo frei bleibt, damit ich die Uhr weiterhin anzeigen kann. Diese nutzt ja den Platz des Logos.
Auch die Eingabezeile oben ist links zu weit am Rand.

Ansonsten: Tolle Sache, danke.

[cwagner]

Beim Einsatz von readingsGroups sind die Spalten arg knapp. Mit Hilfe von marvin78 kann ich einen Patch vorstellen, der im f18style.css angehängt werden könnte:
}
.wide td {
  padding:6px;
}

Wie es aussieht (vorher/nachher) zeigen die beiden Screenshots.

Christian