├── fonts
├── Roboto-Medium-webfont.eot
├── Roboto-Medium-webfont.svg
├── Roboto-Medium-webfont.ttf
├── Roboto-Medium-webfont.woff
├── Roboto-Regular-webfont.eot
├── Roboto-Regular-webfont.svg
├── Roboto-Regular-webfont.ttf
├── Roboto-Regular-webfont.woff
├── font-license.txt
├── fontawesome-webfont.eot
├── fontawesome-webfont.svg
├── fontawesome-webfont.ttf
├── fontawesome-webfont.woff
└── fontawesome-webfont.woff2
├── package.json
├── readme.md
└── skins
├── debug
├── material.css
└── material.less
└── material.css
/fonts/Roboto-Medium-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/Roboto-Medium-webfont.eot
--------------------------------------------------------------------------------
/fonts/Roboto-Medium-webfont.svg:
--------------------------------------------------------------------------------
1 |
2 |
3 |
--------------------------------------------------------------------------------
/fonts/Roboto-Medium-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/Roboto-Medium-webfont.ttf
--------------------------------------------------------------------------------
/fonts/Roboto-Medium-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/Roboto-Medium-webfont.woff
--------------------------------------------------------------------------------
/fonts/Roboto-Regular-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/Roboto-Regular-webfont.eot
--------------------------------------------------------------------------------
/fonts/Roboto-Regular-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/Roboto-Regular-webfont.ttf
--------------------------------------------------------------------------------
/fonts/Roboto-Regular-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/Roboto-Regular-webfont.woff
--------------------------------------------------------------------------------
/fonts/font-license.txt:
--------------------------------------------------------------------------------
1 | ## Font Awesome
2 |
3 | Copyright (C) 2012 by Dave Gandy
4 |
5 | Author: Dave Gandy
6 | License: SIL (http://scripts.sil.org/OFL)
7 | Homepage: http://fortawesome.github.com/Font-Awesome/
8 |
9 |
--------------------------------------------------------------------------------
/fonts/fontawesome-webfont.eot:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/fontawesome-webfont.eot
--------------------------------------------------------------------------------
/fonts/fontawesome-webfont.ttf:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/fontawesome-webfont.ttf
--------------------------------------------------------------------------------
/fonts/fontawesome-webfont.woff:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/fontawesome-webfont.woff
--------------------------------------------------------------------------------
/fonts/fontawesome-webfont.woff2:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webix-hub/material-design-skin/a5ee0cb834bb493b3b9dc778390edc950685d053/fonts/fontawesome-webfont.woff2
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "webix-skin-material",
3 | "version": "5.2.1",
4 | "description": "Material skin for Webix UI",
5 | "main": "index.js",
6 | "scripts": {
7 | "test": "echo \"Error: no test specified\" && exit 1"
8 | },
9 | "repository": {
10 | "type": "git",
11 | "url": "git+https://github.com/webix-hub/material-design-skin.git"
12 | },
13 | "keywords": [
14 | "webix",
15 | "material",
16 | "design",
17 | "skin"
18 | ],
19 | "author": "Maksim Kozhukh",
20 | "license": "MIT",
21 | "bugs": {
22 | "url": "https://github.com/webix-hub/material-design-skin/issues"
23 | },
24 | "homepage": "https://github.com/webix-hub/material-design-skin#readme"
25 | }
26 |
--------------------------------------------------------------------------------
/readme.md:
--------------------------------------------------------------------------------
1 | Material Design skin for Webix UI
2 | =================================
3 |
4 | [](https://gitter.im/webix-hub/webix)
5 |
6 |
7 | Live demo - http://webix.com/demos/material/admin-app/index.html#!/app/forms
8 |
9 | Skin will work with Webix 2.3 - 5.4.
10 |
11 | From Webix 6.0 you can use a [built-in Material skin](https://docs.webix.com/desktop__material_skin.html), which is the default styling of the library.
12 |
13 |
14 | How to use
15 | -----------
16 |
17 | - copy files into `codebase` folder of Webix UI package
18 | - use skin file on page as any other skin
19 |
20 | ```html
21 |
22 |
23 |
24 |
25 |
26 |
27 | webix.ready(function(){
28 | //some webix related UI here
29 | });
30 |
31 |
32 | ```
33 |
34 | Shared CSS classes
35 | ------------------
36 |
37 | Example - http://webix.com/demos/material/admin-app/index.html#!/app/typography
38 |
39 | ### Text and Background
40 |
41 | - text_primary
42 | - text_info
43 | - text_success
44 | - text_warning
45 | - text_danger
46 | - text_muted
47 |
48 | ```js
49 | webix.ui({
50 | rows:[{
51 | template:"Some text",
52 | css:"text_info"
53 | },{
54 | template:"Some background",
55 | css:"bg_danger"
56 | })
57 | ```
58 |
59 | ### Buttons
60 |
61 | - button_primary
62 | - button_info
63 | - button_success
64 | - button_warning
65 | - button_danger
66 | - button_transparent
67 | - button_raised
68 |
69 | ```js
70 | webix.ui({
71 | view:"button",
72 | css:"button_success button_raised"
73 | })
74 | ```
75 |
76 |
77 | ### Icons
78 |
79 | - solid_icon
80 | - action_icon
81 | - danger_icon
82 |
83 | ```js
84 | webix.ui({
85 | view:"icon",
86 | icon:"users",
87 | css:"solid_icon"
88 | });
89 | ```
90 |
91 |
92 | ### Panels
93 |
94 | - bg_clean
95 | - bg_panel
96 | - bg_panel_raised
97 |
98 | ```js
99 | webix.ui({
100 | rows:[
101 | { template:"A" },
102 | { template:"B", css:"bg_panel"},
103 | { template:"C" }
104 | ]
105 | })
106 | ```
107 |
108 | Material layout
109 | ------------------
110 |
111 | Skin adds one more type of layout.
112 |
113 | ```js
114 | webix.ui({
115 | type:"material",
116 | rows:[
117 | { template:"A" },
118 | { template:"B" },
119 | { template:"C" }
120 | ]
121 | })
122 | ```
123 |
124 | This type of layout shows all content elements as material panels.
125 |
126 |
127 | License
128 | ---------
129 |
130 | Code is released under the MIT License:
131 |
132 | Copyright (c) 2015
133 |
134 | 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:
135 |
136 | The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
137 |
138 | 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.
139 |
--------------------------------------------------------------------------------