{"id":19401945,"url":"https://github.com/thwillert/homematic_css","last_synced_at":"2025-04-24T07:30:53.693Z","repository":{"id":126474357,"uuid":"220309987","full_name":"THWillert/HomeMatic_CSS","owner":"THWillert","description":"CSS Datei für die HomeMatic WebUI in Verbindung mit dem FireFox Addon Stylus","archived":false,"fork":false,"pushed_at":"2020-09-18T13:21:47.000Z","size":394,"stargazers_count":7,"open_issues_count":1,"forks_count":4,"subscribers_count":4,"default_branch":"master","last_synced_at":"2025-04-03T01:06:44.067Z","etag":null,"topics":["ccu","css","firefox","homematic","stylus","webui"],"latest_commit_sha":null,"homepage":null,"language":"CSS","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/THWillert.png","metadata":{"files":{"readme":"README.md","changelog":"changelog.txt","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"custom":["paypal.me/ThorstenHWillert/"]}},"created_at":"2019-11-07T19:08:59.000Z","updated_at":"2025-01-24T22:22:24.000Z","dependencies_parsed_at":"2023-06-16T22:45:29.618Z","dependency_job_id":null,"html_url":"https://github.com/THWillert/HomeMatic_CSS","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FHomeMatic_CSS","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FHomeMatic_CSS/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FHomeMatic_CSS/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/THWillert%2FHomeMatic_CSS/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/THWillert","download_url":"https://codeload.github.com/THWillert/HomeMatic_CSS/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250582833,"owners_count":21453917,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ccu","css","firefox","homematic","stylus","webui"],"created_at":"2024-11-10T11:20:45.734Z","updated_at":"2025-04-24T07:30:53.686Z","avatar_url":"https://github.com/THWillert.png","language":"CSS","funding_links":["paypal.me/ThorstenHWillert/"],"categories":[],"sub_categories":[],"readme":"# HomeMatic_CSS\n[CSS](https://de.wikipedia.org/wiki/Cascading_Style_Sheets)-Datei für die HomeMatic CCU in Verbindung mit dem FireFox Addon Stylus.\n\n## Übersicht\nEin modernes Design:\n\n![WebUI Neu](/images/WebUI_Neues_Design_1_sm.png)\n\nfür die etwas in die Jahre gekommene Oberfläche der HomeMatic WebUI:\n\n![WebUI Original](/images/WebUI_Original_sm.png)\n\n## Voraussetzungen\nDie CSS-Datei benötigt  _keine_ Installation auf der CCU.\nStattdessen wird diese über FireFox-Addon [Stylus](https://addons.mozilla.org/en-US/firefox/addon/styl-us/) eingebunden.\nDieses \"überschreibt\" die vorhandenen Style-Sheets, die von der CCU geladen werden, direkt im Browser.\n\n## Installation\nNach der Installation von Stylus wird die CCS-Datei in Stylus importiert:\n\n![Bearbeiten](/images/HomeMatic_CSS__Stylus_bearbeiten.png)\n\nund den Inhalt der CSS-Datei einfügen:\n\n![Einfuegen](/images/HomeMatic_CSS__Stylus_einfuegen.png)\n\ndanach ist eine Anpassung der IP-Adressen, auf die IP bzw. URL der CCU, in den einzelnen Code-Bereichen nötig:\n\n![IP](/images/HomeMatic_CSS__Gilt_fuer.png).\n\n\u003e Hierzu noch ein schönes Video von [Verdrahtet](https://www.verdrahtet.info) auf [YouTube](https://www.youtube.com/watch?v=nxAQbJ4O01g)\n\n### Anpassungen\nNach dem Import sieht man in Stylus mehrere Code-Bereiche:\n\n 1. Changelog, CSS-Variablen zum einfachen Anpassen und des Drucklayouts ![Variablen](/images/HomeMatic_CSS__CSS-Variablen.png)![CSS_Print](/images/HomeMatic_CSS__Print.png)\n 2.  Allgemeine Stile\n 3. die restlichen Stile\n 4. das Hintergrundbild\n \n ### Drucken\n Für einen Ausdruck werden per CSS die Kopf- und Fußzeilen der Seite ausgeblendet, sowie alles auf schwarz / weiß gesetzt.\n \n Um ein sauberes Ergebnis zu bekommen, sollten in den Druckeinstellungen von FireFox zusätzlich \"Hintergrund drucken\" deaktiviert werden:\n \n ![Druck Einstellungen](/images/HomeMatic_CSS__CSS-Variablen_print_1.png)\n \n ## Diskussion / Vorschläge\nBitte auch die Diskussion dazu im [HomeMatic-Forum](https://homematic-forum.de/forum/viewtopic.php?f=41\u0026t=46033) beachten.\n\n## ToDo\n\nDie Reihenfolge entspricht keiner Priorität.\n\n - [ ] Button \"Geräte löschen\" korrigieren\n - [ ] Anleitung vervollständigen\n - [ ] CSS-Variablen vervollständigen\n - [x] Status / Geräte-Controls überarbeiten\n - [x] Status / Geräte: Modus Auto / Manu \n - [X] Status / Gewerke\n - [X] Status / Räume\n - [ ] Status / Favoriten\n - [ ] Status / Systemprotokoll - Header\n - [ ] Direkte Verknüpfungen\n - [ ] Einstellungen - Unterpunkte Header\n - [ ] Popup - Allgemeine Geräteeinstellungen\n - [ ] Popups - Kanalauswahl / Geräteauswahl usw.\n - [ ] Geräteeinstellungen / Formular-Inputs verbergen\n - [ ] zweites Design: \"Hell\"\n\nOptional:\n - [ ] als Addon?\n - [ ] wenn es ein Addon wird: Die Geräte-Bilder durch Fotos ersetzen?\n - [ ] Auf CUx erweitern?\n\n ## Author\n Thorsten Willert\n\n [Homepage](https://www.thorsten-willert.de/software/design-fuer-homematic-webui)\n\n ## Lizenz\n Das ganze steht unter der [Apache 2.0](https://github.com/THWillert/HomeMatic_CSS/blob/master/LICENSE) Lizenz.\n.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthwillert%2Fhomematic_css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fthwillert%2Fhomematic_css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fthwillert%2Fhomematic_css/lists"}