Initial commit
17
.gitattributes
vendored
Normal file
@ -0,0 +1,17 @@
|
||||
# Auto detect text files and perform LF normalization
|
||||
* text=auto
|
||||
|
||||
# Custom for Visual Studio
|
||||
*.cs diff=csharp
|
||||
|
||||
# Standard to msysgit
|
||||
*.doc diff=astextplain
|
||||
*.DOC diff=astextplain
|
||||
*.docx diff=astextplain
|
||||
*.DOCX diff=astextplain
|
||||
*.dot diff=astextplain
|
||||
*.DOT diff=astextplain
|
||||
*.pdf diff=astextplain
|
||||
*.PDF diff=astextplain
|
||||
*.rtf diff=astextplain
|
||||
*.RTF diff=astextplain
|
49
.gitignore
vendored
Normal file
@ -0,0 +1,49 @@
|
||||
_ignore/*.*
|
||||
|
||||
# Windows image file caches
|
||||
Thumbs.db
|
||||
ehthumbs.db
|
||||
|
||||
# Folder config file
|
||||
Desktop.ini
|
||||
|
||||
# Recycle Bin used on file shares
|
||||
$RECYCLE.BIN/
|
||||
|
||||
# Windows Installer files
|
||||
*.cab
|
||||
*.msi
|
||||
*.msm
|
||||
*.msp
|
||||
|
||||
# Windows shortcuts
|
||||
*.lnk
|
||||
|
||||
# =========================
|
||||
# Operating System Files
|
||||
# =========================
|
||||
|
||||
# OSX
|
||||
# =========================
|
||||
|
||||
.DS_Store
|
||||
.AppleDouble
|
||||
.LSOverride
|
||||
|
||||
# Thumbnails
|
||||
._*
|
||||
|
||||
# Files that might appear in the root of a volume
|
||||
.DocumentRevisions-V100
|
||||
.fseventsd
|
||||
.Spotlight-V100
|
||||
.TemporaryItems
|
||||
.Trashes
|
||||
.VolumeIcon.icns
|
||||
|
||||
# Directories potentially created on remote AFP share
|
||||
.AppleDB
|
||||
.AppleDesktop
|
||||
Network Trash Folder
|
||||
Temporary Items
|
||||
.apdisk
|
BIN
_ignore/images/bar-92.png
Normal file
After Width: | Height: | Size: 24 KiB |
BIN
_ignore/images/bar.png
Normal file
After Width: | Height: | Size: 32 KiB |
BIN
_ignore/images/bar_19.png
Normal file
After Width: | Height: | Size: 22 KiB |
BIN
_ignore/images/bar_61.png
Normal file
After Width: | Height: | Size: 23 KiB |
BIN
_ignore/images/bar_md.png
Normal file
After Width: | Height: | Size: 53 KiB |
BIN
_ignore/images/barbackground.png
Normal file
After Width: | Height: | Size: 12 KiB |
BIN
_ignore/images/barcolor.png
Normal file
After Width: | Height: | Size: 7.4 KiB |
BIN
_ignore/images/blink.png
Normal file
After Width: | Height: | Size: 145 KiB |
BIN
_ignore/images/grid_0360_02.png
Normal file
After Width: | Height: | Size: 22 KiB |
BIN
_ignore/images/grid_0640_04.png
Normal file
After Width: | Height: | Size: 26 KiB |
BIN
_ignore/images/grid_0960_06.png
Normal file
After Width: | Height: | Size: 29 KiB |
BIN
_ignore/images/grid_1280_08.png
Normal file
After Width: | Height: | Size: 27 KiB |
BIN
_ignore/images/states_0.png
Normal file
After Width: | Height: | Size: 47 KiB |
BIN
_ignore/images/states_1.png
Normal file
After Width: | Height: | Size: 46 KiB |
BIN
_ignore/images/states_2.png
Normal file
After Width: | Height: | Size: 59 KiB |
BIN
_ignore/images/vis0-15-5 md.png
Normal file
After Width: | Height: | Size: 126 KiB |
44
changelog.MD
Normal file
@ -0,0 +1,44 @@
|
||||
2018-01-10 V1.8
|
||||
CSS:
|
||||
mdui-state: Anzeige von Textstati mit Vorder-/Hintergrundfarbe (basic ValueList HTML)
|
||||
dui-cols-X: Grid-System (152px) für responsive design, maximal 10 Spalten a 152 Pixel,
|
||||
Umbruch nach Screenbreite:ab 360px=2cols 480px=3cols 640px=4cols 960px=6cols 1280px=8cols 1560px=10cols
|
||||
mdui-tile bekommen dabei automatisch 4px margin
|
||||
mdui-raisedbutton, mdui-flatbutton Texte werden nun horz/vert zentriert
|
||||
der active-State der Buttons in tnav/bnav wird nun mit box-shadow statt border gezeichnet
|
||||
Script: nix
|
||||
ioBroker Projekte: MD_Demo, MD-Simple umgestellt auf 52er Raster
|
||||
Anleitung: Ergänzt um mdui-state, mdui-cols-X
|
||||
|
||||
2018-01-05 V1.7
|
||||
CSS: mdui-(color)-glow für red, yellow, blue und green hinzugefügt
|
||||
Script: Korrektur mdui-lnav/rnav. Funktionierte mit mdui-toggle nicht korrekt
|
||||
Anleitung: Ergänzt um mdui-(color)-glow
|
||||
|
||||
2017-10-11 V1.5
|
||||
CSS: mdui-table Klassen
|
||||
Script: Tabellenbehandlung
|
||||
ioBroker Projekte: MD_Demo, MD-Simple ergänzt um Tabellenbeispiel
|
||||
Anleitung: Ergänzt um Tabellenbeschreibung, optisch überarbeitet
|
||||
|
||||
2017-10-02 V1.4
|
||||
CSS: FLOT-Diagramme, mdui-table (noch in Entwicklung)
|
||||
Script: Zeitspanne für FLOT-Diagramme setzen
|
||||
ioBroker Projekte: MD_Demo, MD-Simple ergänzt um "FLOT-Diagramme"
|
||||
Anleitung: Ergänzt um "FLOT-Diagramme"
|
||||
|
||||
2017-09-24 V1.3
|
||||
CSS: "Slider transparent" hinzu
|
||||
ioBroker Projekte: MD_Demo, MD-Simple ergänzt um "Silder transparent"
|
||||
Anleitung: Ergänzt um "Select" und "Silder transparent"
|
||||
|
||||
2017-09-20 V1.2
|
||||
CSS: "Select" hinzu
|
||||
ioBroker Projekte: MD_Demo, MD-Simple ergänzt um "Select"
|
||||
|
||||
2017-09-17 V1.1
|
||||
Sidebar Menüs hinzu
|
||||
MD_Demo aktualisiert
|
||||
|
||||
2017-08-20 V0.1
|
||||
First Upload
|
BIN
docs/Anleitung_layout.odg
Normal file
BIN
docs/Anleitung_layout.png
Normal file
After Width: | Height: | Size: 98 KiB |
BIN
docs/Elbphilharmonie.jpg
Normal file
After Width: | Height: | Size: 132 KiB |
BIN
docs/Elbphilharmonie_saal.jpg
Normal file
After Width: | Height: | Size: 92 KiB |
BIN
docs/MD_1280_0720x1280_Demo_Inputs.png
Normal file
After Width: | Height: | Size: 100 KiB |
BIN
docs/MD_1280_0720x1280_WZ.png
Normal file
After Width: | Height: | Size: 80 KiB |
BIN
docs/MD_1280_1280x0720_Demo_Cards.png
Normal file
After Width: | Height: | Size: 94 KiB |
BIN
docs/MD_1280_1280x0720_Demo_Inputs.png
Normal file
After Width: | Height: | Size: 96 KiB |
BIN
docs/MD_1280_1280x0720_Demo_Labels.png
Normal file
After Width: | Height: | Size: 71 KiB |
BIN
docs/MD_1280_1280x0720_Main.png
Normal file
After Width: | Height: | Size: 80 KiB |
BIN
docs/MD_1280_1280x0720_WZ.png
Normal file
After Width: | Height: | Size: 74 KiB |
BIN
docs/MaterialDesign4ioBroker.mp4
Normal file
BIN
docs/anleitung.odt
Normal file
BIN
docs/anleitung.pdf
Normal file
BIN
docs/mdui-uebersicht.png
Normal file
After Width: | Height: | Size: 84 KiB |
BIN
ioBroker projects/MD_Demo.zip
Normal file
BIN
ioBroker projects/MD_Simple.zip
Normal file
20
license.md
Normal file
@ -0,0 +1,20 @@
|
||||
### The MIT License (MIT)
|
||||
|
||||
Copyright (c) 2017ff Uhula
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
||||
|
||||
### Deutsche Übersetzung
|
||||
|
||||
Copyright (c) 2017ff Uhula
|
||||
|
||||
Hiermit wird unentgeltlich jeder Person, die eine Kopie der Software und der zugehörigen Dokumentationen (die "Software") erhält, die Erlaubnis erteilt, sie uneingeschränkt zu nutzen, inklusive und ohne Ausnahme mit dem Recht, sie zu verwenden, zu kopieren, zu verändern, zusammenzufügen, zu veröffentlichen, zu verbreiten, zu unterlizenzieren und/oder zu verkaufen, und Personen, denen diese Software überlassen wird, diese Rechte zu verschaffen, unter den folgenden Bedingungen:
|
||||
|
||||
Der obige Urheberrechtsvermerk und dieser Erlaubnisvermerk sind in allen Kopien oder Teilkopien der Software beizulegen.
|
||||
|
||||
DIE SOFTWARE WIRD OHNE JEDE AUSDRÜCKLICHE ODER IMPLIZIERTE GARANTIE BEREITGESTELLT, EINSCHLIEẞLICH DER GARANTIE ZUR BENUTZUNG FÜR DEN VORGESEHENEN ODER EINEM BESTIMMTEN ZWECK SOWIE JEGLICHER RECHTSVERLETZUNG, JEDOCH NICHT DARAUF BESCHRÄNKT. IN KEINEM FALL SIND DIE AUTOREN ODER COPYRIGHTINHABER FÜR JEGLICHEN SCHADEN ODER SONSTIGE ANSPRÜCHE HAFTBAR ZU MACHEN, OB INFOLGE DER ERFÜLLUNG EINES VERTRAGES, EINES DELIKTES ODER ANDERS IM ZUSAMMENHANG MIT DER SOFTWARE ODER SONSTIGER VERWENDUNG DER SOFTWARE ENTSTANDEN.
|
61
readme.MD
Normal file
@ -0,0 +1,61 @@
|
||||
### CSS Skin für ioBroker im Material Design Stil
|
||||
|
||||
**Inhaltsverzeichnis**
|
||||
|
||||
1. [Funktionsumfang](#1-funktionsumfang)
|
||||
2. [Systemanforderungen](#2-systemanforderungen)
|
||||
3. [Installation](#3-installation)
|
||||
4. [Anleitung](#4-anleitung)
|
||||
5. [Changelog](#5-changelog)
|
||||
6. [Sonstiges](#6-sonstiges)
|
||||
|
||||
|
||||
![Beispiel 1280x0720 Main](docs/MD_1280_1280x0720_Main.png?raw=true "Beispiel 1280x0720 Main")
|
||||
|
||||
|
||||
### 1. Funktionsumfang
|
||||
In ioBroker.vis gestaltete Views können mit diesen CCS Anweisungen so dargestellt werden, dass sie ähnlich dem Look & Feel des Material Design Styles von Google funktionieren. Dazu gehören:
|
||||
* Application bar
|
||||
* Top-Navigation (Tabs), Bottom-Navigation, Left- und Right-Navigation (Sidepanels)
|
||||
* Cards und Tiles
|
||||
* Responsive Design (Grid, 13er/52er/156er Raster)
|
||||
* Tables, inputs, labels, states ...
|
||||
|
||||
Siehe auch Video: [Demo-Film](docs/MaterialDesign4ioBroker.mp4) (zum Ansehen herunterladen)
|
||||
|
||||
|
||||
Beispiele: 1280 x 0720
|
||||
* [Beispiel 1280x0720 Main](docs/MD_1280_1280x0720_Main.png?raw=true "Beispiel 1280x0720 Main")
|
||||
* [Beispiel 1280x0720 Wohnzimmer](docs/MD_1280_1280x0720_WZ.png?raw=true "Beispiel 1280x0720 Wohnzimmer")
|
||||
* [Beispiel 1280x0720 Demo Cards](docs/MD_1280_1280x0720_Demo_Cards.png?raw=true "Beispiel 1280x0720 Demo Cards")
|
||||
* [Beispiel 1280x0720 Demo Labels](docs/MD_1280_1280x0720_Demo_Labels.png?raw=true "Beispiel 1280x0720 Demo Labels")
|
||||
* [Beispiel 1280x0720 Demo Inputs](docs/MD_1280_1280x0720_Demo_Inputs.png?raw=true "Beispiel 1280x0720 Demo Inputs")
|
||||
|
||||
Beispiele: 0720 x 1280
|
||||
* [Beispiel 0720x1280 Wohnzimmer](docs/MD_1280_0720x1280_WZ.png?raw=true "Beispiel 0720x1280 Wohnzimmer")
|
||||
* [Beispiel 0720x1280 Demo Inputs](docs/MD_1280_0720x1280_Demo_Inputs.png?raw=true "Beispiel 0720x1280 Demo Inputs")
|
||||
|
||||
|
||||
### 2. Systemanforderungen
|
||||
* ioBroker.vis
|
||||
|
||||
|
||||
### 3. Installation
|
||||
Keine. Die CSS Anweisungen müssen lediglich in einem ioBroker.vis Projekt unter "CSS / Projekt" eingefügt werden, die paar Zeilen Script unter "Skript". Beides am besten aus dem [Demo-Projekt]("ioBroker projects/MD_Demo.zip") entnehmen.
|
||||
|
||||
|
||||
### 4. Anleitung
|
||||
|
||||
Siehe Dokument [Anleitung](docs/anleitung.pdf)
|
||||
|
||||
Beispiel-Projekte befinden sich im Ordner "ioBroker projects", einmal ein [Demo-Projekt]("ioBroker projects/MD_Demo.zip"), welches den Umfang zeigt und einmal ein [Simple-Projekt]("ioBroker projects/MD_Simple.zip"), welches als Basis für eigene vis-Projekte verwendet werden kann. Beide Projekte (ZIP-Dateien) lassen sich in ioBroker.vis importieren.
|
||||
|
||||
### 5. Changelog
|
||||
V1.8 10.01.2018
|
||||
Siehe [ChangeLog](./changelog.md).
|
||||
|
||||
|
||||
### 6. Sonstiges
|
||||
|
||||
|
||||
:copyright:2017ff Uhula, see [MIT license](./license.md).
|
BIN
video/bargraph.gif
Normal file
After Width: | Height: | Size: 207 KiB |
BIN
video/bargraph.mp4
Normal file
BIN
video/flash.gif
Normal file
After Width: | Height: | Size: 854 KiB |
BIN
video/flash.mp4
Normal file
BIN
video/flot_timespan.gif
Normal file
After Width: | Height: | Size: 403 KiB |
BIN
video/flot_timespan.mp4
Normal file
BIN
video/image_scale.gif
Normal file
After Width: | Height: | Size: 2.2 MiB |
BIN
video/image_scale.mp4
Normal file
BIN
video/sidebar_menu.gif
Normal file
After Width: | Height: | Size: 181 KiB |
BIN
video/sidebar_menu.mp4
Normal file
BIN
video/tabelle.gif
Normal file
After Width: | Height: | Size: 1.9 MiB |