HomeMatic_CSS

CSS-Datei für die HomeMatic CCU in Verbindung mit dem FireFox Addon Stylus.

Übersicht

Ein modernes Design:

für die etwas in die Jahre gekommene Oberfläche der HomeMatic WebUI:

Voraussetzungen

Die CSS-Datei benötigt keine Installation auf der CCU. Stattdessen wird diese über FireFox-Addon Stylus eingebunden. Dieses "überschreibt" die vorhandenen Style-Sheets, die von der CCU geladen werden, direkt im Browser.

Installation

Nach der Installation von Stylus wird die CCS-Datei in Stylus importiert:

und den Inhalt der CSS-Datei einfügen:

danach ist eine Anpassung der IP-Adressen, auf die IP bzw. URL der CCU, in den einzelnen Code-Bereichen nötig:

.

Hierzu noch ein schönes Video von Verdrahtet auf YouTube

Anpassungen

Nach dem Import sieht man in Stylus mehrere Code-Bereiche:

1. Changelog, CSS-Variablen zum einfachen Anpassen und des Drucklayouts
2. Allgemeine Stile
3. die restlichen Stile

4. das Hintergrundbild

   Drucken

   Für einen Ausdruck werden per CSS die Kopf- und Fußzeilen der Seite ausgeblendet, sowie alles auf schwarz / weiß gesetzt.

   Um ein sauberes Ergebnis zu bekommen, sollten in den Druckeinstellungen von FireFox zusätzlich "Hintergrund drucken" deaktiviert werden:

   

   Diskussion / Vorschläge

   Bitte auch die Diskussion dazu im HomeMatic-Forum beachten.

ToDo

Die Reihenfolge entspricht keiner Priorität.

• [ ] Button "Geräte löschen" korrigieren
• [ ] Anleitung vervollständigen
• [ ] CSS-Variablen vervollständigen
• [x] Status / Geräte-Controls überarbeiten
• [x] Status / Geräte: Modus Auto / Manu
• [X] Status / Gewerke
• [X] Status / Räume
• [ ] Status / Favoriten
• [ ] Status / Systemprotokoll - Header
• [ ] Direkte Verknüpfungen
• [ ] Einstellungen - Unterpunkte Header
• [ ] Popup - Allgemeine Geräteeinstellungen
• [ ] Popups - Kanalauswahl / Geräteauswahl usw.
• [ ] Geräteeinstellungen / Formular-Inputs verbergen
• [ ] zweites Design: "Hell"

Optional:

• [ ] als Addon?
• [ ] wenn es ein Addon wird: Die Geräte-Bilder durch Fotos ersetzen?

• [ ] Auf CUx erweitern?

  Author

  Thorsten Willert

  Homepage

  Lizenz

  Das ganze steht unter der Apache 2.0 Lizenz. .