|
|
### 外观和感觉材料设计样式
|
|
|
|
|
|
**Inhaltsverzeichnis**
|
|
|
|
|
|
1. [Funktionsumfang](#1-funktionsumfang)
|
|
|
3. [Installation](#3-installation)
|
|
|
4. [Anleitung](#4-anleitung)
|
|
|
5. [Changelog](#5-changelog)
|
|
|
6. [Sonstiges](#6-sonstiges)
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### 1. Funktionsumfang
|
|
|
In oncloud.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:
|
|
|
|
|
|
* 应用程序栏
|
|
|
* 顶部导航（标签），底部导航，左侧和右侧导航（侧面板）
|
|
|
* 卡片和瓷砖
|
|
|
* 响应式设计（Grid, 13er/52er/156er Raster）
|
|
|
* 表，输入，标签，状态......
|
|
|
|
|
|
视频 [Demo-Film](docs/MaterialDesign4ioBroker.mp4)
|
|
|
|
|
|
|
|
|
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")
|
|
|
|
|
|
|
|
|
### 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).
|
