@shortfuse/materialdesignweb 0.0.9 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (392) hide show
  1. package/.browserslistrc +3 -0
  2. package/.eslintrc.json +146 -27
  3. package/.stylelintrc.json +598 -2
  4. package/.vscode/launch.json +20 -5
  5. package/.vscode/settings.json +3 -0
  6. package/.vscode/tasks.json +19 -10
  7. package/CHANGELOG.md +24 -0
  8. package/README.md +84 -2
  9. package/adapters/datatable/column.js +203 -0
  10. package/adapters/datatable/index.js +972 -0
  11. package/adapters/dom/index.js +601 -0
  12. package/adapters/list/index.js +69 -0
  13. package/adapters/search/index.js +521 -0
  14. package/components/appbar/_spec.scss +225 -0
  15. package/components/appbar/_theme.scss +0 -0
  16. package/components/appbar/index.scss +2 -0
  17. package/components/banner/_spec.scss +118 -0
  18. package/components/banner/_theme.scss +0 -0
  19. package/components/banner/index.scss +2 -0
  20. package/components/bottomnav/README.md +85 -0
  21. package/components/bottomnav/_spec.scss +157 -0
  22. package/components/bottomnav/_theme.scss +0 -0
  23. package/components/bottomnav/index.js +122 -0
  24. package/components/bottomnav/index.scss +2 -0
  25. package/components/bottomnav/item.js +89 -0
  26. package/components/{core/button → button}/README.md +16 -22
  27. package/components/button/_spec.scss +161 -0
  28. package/components/button/_theme.scss +65 -0
  29. package/components/button/index.eta +32 -0
  30. package/components/button/index.js +43 -0
  31. package/components/button/index.pug +18 -0
  32. package/components/button/index.scss +2 -0
  33. package/components/card/_spec.scss +249 -0
  34. package/components/card/_theme.scss +0 -0
  35. package/components/card/index.scss +2 -0
  36. package/components/chip/_spec.scss +134 -0
  37. package/components/chip/_theme.scss +177 -0
  38. package/components/chip/index.js +21 -0
  39. package/components/chip/index.scss +2 -0
  40. package/components/chip/item.js +20 -0
  41. package/components/datatable/_spec.scss +288 -0
  42. package/components/datatable/_theme.scss +154 -0
  43. package/components/datatable/cell.js +45 -0
  44. package/components/datatable/columnheader.js +47 -0
  45. package/components/datatable/index.js +388 -0
  46. package/components/datatable/index.scss +2 -0
  47. package/components/datatable/row.js +49 -0
  48. package/components/datatable/rowheader.js +18 -0
  49. package/components/dialog/_spec.scss +213 -0
  50. package/components/dialog/_theme.scss +0 -0
  51. package/components/dialog/index.js +627 -0
  52. package/components/dialog/index.scss +2 -0
  53. package/components/divider/_spec.scss +13 -0
  54. package/components/divider/_theme.scss +0 -0
  55. package/components/divider/index.scss +2 -0
  56. package/components/elevation/_spec.scss +9 -0
  57. package/components/elevation/_theme.scss +0 -0
  58. package/components/elevation/index.scss +2 -0
  59. package/components/fab/_spec.scss +222 -0
  60. package/components/fab/_theme.scss +0 -0
  61. package/components/fab/index.js +103 -0
  62. package/components/fab/index.scss +2 -0
  63. package/components/grid/_spec.scss +312 -0
  64. package/components/grid/_theme.scss +0 -0
  65. package/components/grid/index.scss +2 -0
  66. package/components/layout/_mixins.scss +33 -0
  67. package/components/layout/_spec.scss +1012 -0
  68. package/components/layout/_theme.scss +44 -0
  69. package/components/layout/index.js +464 -0
  70. package/components/layout/index.scss +2 -0
  71. package/components/list/_spec.scss +397 -0
  72. package/components/list/_theme.scss +111 -0
  73. package/components/list/content.js +110 -0
  74. package/components/list/index.js +260 -0
  75. package/components/list/index.scss +2 -0
  76. package/components/list/item.js +170 -0
  77. package/components/list/secondary.js +46 -0
  78. package/components/menu/_spec.scss +362 -0
  79. package/components/menu/_theme.scss +0 -0
  80. package/components/menu/index.js +721 -0
  81. package/components/menu/index.scss +2 -0
  82. package/components/menu/item.js +239 -0
  83. package/components/{core/progress/style.scss → progress/_spec.scss} +36 -25
  84. package/components/progress/_theme.scss +0 -0
  85. package/components/progress/index.js +36 -0
  86. package/components/progress/index.scss +2 -0
  87. package/components/selection/_spec.scss +386 -0
  88. package/components/selection/_theme.scss +166 -0
  89. package/components/selection/index.eta +60 -0
  90. package/components/selection/index.js +76 -0
  91. package/components/selection/index.pug +30 -0
  92. package/components/selection/index.scss +2 -0
  93. package/components/selection/input.js +56 -0
  94. package/components/selection/radiogroup.js +47 -0
  95. package/components/slider/_spec.scss +64 -0
  96. package/components/slider/_theme.scss +0 -0
  97. package/components/slider/index.scss +2 -0
  98. package/components/snackbar/_spec.scss +195 -0
  99. package/components/snackbar/_theme.scss +0 -0
  100. package/components/snackbar/index.js +344 -0
  101. package/components/snackbar/index.scss +2 -0
  102. package/components/tab/_spec.scss +235 -0
  103. package/components/tab/_theme.scss +0 -0
  104. package/components/tab/content.js +205 -0
  105. package/components/tab/index.js +260 -0
  106. package/components/tab/index.scss +2 -0
  107. package/components/tab/item.js +89 -0
  108. package/components/tab/list.js +210 -0
  109. package/components/tab/panel.js +54 -0
  110. package/components/template/_theme.scss +27 -0
  111. package/components/{core/textfield → textfield}/README.md +70 -50
  112. package/components/textfield/_mixins.scss +52 -0
  113. package/components/textfield/_spec.scss +809 -0
  114. package/components/textfield/_theme.scss +299 -0
  115. package/components/textfield/index.eta +74 -0
  116. package/components/textfield/index.js +168 -0
  117. package/components/textfield/index.pug +30 -0
  118. package/components/textfield/index.scss +2 -0
  119. package/components/tooltip/_spec.scss +188 -0
  120. package/components/tooltip/_theme.scss +0 -0
  121. package/components/tooltip/index.scss +2 -0
  122. package/components/type/_spec.scss +224 -0
  123. package/components/type/_theme.scss +0 -0
  124. package/components/type/index.scss +2 -0
  125. package/core/_breakpoint.scss +189 -0
  126. package/core/_elevation.scss +38 -0
  127. package/core/_length.scss +9 -0
  128. package/core/_motion.scss +31 -0
  129. package/core/_platform.scss +34 -0
  130. package/core/_type.scss +127 -0
  131. package/core/aria/attributes.js +141 -0
  132. package/core/aria/button.js +50 -0
  133. package/core/aria/keyboard.js +93 -0
  134. package/core/aria/rovingtabindex.js +178 -0
  135. package/core/aria/tab.js +60 -0
  136. package/core/color/_spec.scss +0 -0
  137. package/core/color/_theme.scss +390 -0
  138. package/core/color/index.scss +2 -0
  139. package/core/document/index.js +39 -0
  140. package/core/dom.js +271 -0
  141. package/core/overlay/_spec.scss +31 -0
  142. package/core/overlay/_theme.scss +171 -0
  143. package/core/overlay/index.js +108 -0
  144. package/core/overlay/index.scss +2 -0
  145. package/core/ripple/_spec.scss +197 -0
  146. package/core/ripple/_theme.scss +40 -0
  147. package/core/ripple/index.js +294 -0
  148. package/core/ripple/index.scss +2 -0
  149. package/core/theme/_config.scss +2 -0
  150. package/core/theme/_mixins.scss +172 -0
  151. package/{components/theming/palettes.scss → core/theme/_palettes.scss} +173 -150
  152. package/core/theme/_variables.scss +24 -0
  153. package/core/theme/index.js +50 -0
  154. package/core/throttler.js +42 -0
  155. package/core/transition/index.js +468 -0
  156. package/docs/_flex.scss +22 -0
  157. package/docs/_menuoptions.js +183 -0
  158. package/docs/_mixins.pug +155 -0
  159. package/docs/_partials/_androidnavbar.eta +5 -0
  160. package/docs/_partials/_androidstatusbar.eta +13 -0
  161. package/docs/_partials/_appbar.eta +29 -0
  162. package/docs/_partials/_buttontest.eta +31 -0
  163. package/docs/_partials/_header.eta +149 -0
  164. package/docs/_partials/_navlistitem.eta +16 -0
  165. package/docs/_partials/_target.eta +1 -0
  166. package/docs/_sample-utils.js +93 -0
  167. package/docs/_storage.js +33 -0
  168. package/docs/docs.scss +295 -0
  169. package/docs/index.eta +16 -0
  170. package/docs/index.js +0 -0
  171. package/docs/pages/appbar.eta +114 -0
  172. package/docs/pages/appbar.js +0 -0
  173. package/docs/pages/appbar.pug +78 -0
  174. package/docs/pages/bottomnav.eta +188 -0
  175. package/docs/pages/bottomnav.js +115 -0
  176. package/docs/pages/bottomnav.pug +137 -0
  177. package/docs/pages/button.eta +124 -0
  178. package/docs/pages/button.js +224 -0
  179. package/docs/pages/button.pug +121 -0
  180. package/docs/pages/card.eta +90 -0
  181. package/docs/pages/card.js +177 -0
  182. package/docs/pages/card.pug +74 -0
  183. package/docs/pages/chip.eta +122 -0
  184. package/docs/pages/chip.js +82 -0
  185. package/docs/pages/chip.pug +91 -0
  186. package/docs/pages/color.eta +143 -0
  187. package/docs/pages/color.js +262 -0
  188. package/docs/pages/color.pug +121 -0
  189. package/docs/pages/datatable.eta +323 -0
  190. package/docs/pages/datatable.js +164 -0
  191. package/docs/pages/datatable.pug +283 -0
  192. package/docs/pages/dialog.eta +186 -0
  193. package/docs/pages/dialog.js +177 -0
  194. package/docs/pages/dialog.pug +132 -0
  195. package/docs/pages/dom.eta +26 -0
  196. package/docs/pages/dom.js +143 -0
  197. package/docs/pages/dom.pug +22 -0
  198. package/docs/pages/elevation.eta +35 -0
  199. package/docs/pages/elevation.js +0 -0
  200. package/docs/pages/elevation.pug +25 -0
  201. package/docs/pages/fab.eta +99 -0
  202. package/docs/pages/fab.js +44 -0
  203. package/docs/pages/fab.pug +66 -0
  204. package/docs/pages/grid.eta +135 -0
  205. package/docs/pages/grid.js +128 -0
  206. package/docs/pages/grid.pug +95 -0
  207. package/docs/pages/layout.eta +8 -0
  208. package/docs/pages/layout.js +0 -0
  209. package/docs/pages/layout.pug +7 -0
  210. package/docs/pages/list.eta +465 -0
  211. package/docs/pages/list.js +9 -0
  212. package/docs/pages/list.pug +326 -0
  213. package/docs/pages/menu.eta +276 -0
  214. package/docs/pages/menu.js +217 -0
  215. package/docs/pages/menu.pug +205 -0
  216. package/docs/pages/overlay.eta +69 -0
  217. package/docs/pages/overlay.js +4 -0
  218. package/docs/pages/overlay.pug +55 -0
  219. package/docs/pages/progress.eta +23 -0
  220. package/docs/pages/progress.js +12 -0
  221. package/docs/pages/progress.pug +16 -0
  222. package/docs/pages/ripple.eta +27 -0
  223. package/docs/pages/ripple.js +4 -0
  224. package/docs/pages/ripple.pug +21 -0
  225. package/docs/pages/search.eta +246 -0
  226. package/docs/pages/search.js +243 -0
  227. package/docs/pages/search.pug +165 -0
  228. package/docs/pages/selection.eta +111 -0
  229. package/docs/pages/selection.js +13 -0
  230. package/docs/pages/selection.pug +74 -0
  231. package/docs/pages/slider.eta +23 -0
  232. package/docs/pages/slider.js +0 -0
  233. package/docs/pages/slider.pug +17 -0
  234. package/docs/pages/snackbar.eta +83 -0
  235. package/docs/pages/snackbar.js +158 -0
  236. package/docs/pages/snackbar.pug +60 -0
  237. package/docs/pages/tab.eta +421 -0
  238. package/docs/pages/tab.js +151 -0
  239. package/docs/pages/tab.pug +304 -0
  240. package/docs/pages/textfield.eta +486 -0
  241. package/docs/pages/textfield.js +254 -0
  242. package/docs/pages/textfield.pug +360 -0
  243. package/docs/pages/tooltip.eta +94 -0
  244. package/docs/pages/tooltip.js +0 -0
  245. package/docs/pages/tooltip.pug +78 -0
  246. package/docs/pages/transition.eta +117 -0
  247. package/docs/pages/transition.js +54 -0
  248. package/docs/pages/transition.pug +76 -0
  249. package/docs/pages/type.eta +31 -0
  250. package/docs/pages/type.js +0 -0
  251. package/docs/pages/type.pug +29 -0
  252. package/docs/postrender.js +39 -0
  253. package/docs/prerender.js +16 -0
  254. package/docs/pwa/_dialogs.eta +143 -0
  255. package/docs/pwa/_dialogs.pug +96 -0
  256. package/docs/pwa/_menus.eta +16 -0
  257. package/docs/pwa/_menus.pug +11 -0
  258. package/docs/pwa/pwa-prerender.js +3 -0
  259. package/docs/pwa/pwa.eta +480 -0
  260. package/docs/pwa/pwa.js +306 -0
  261. package/docs/pwa/pwa.pug +325 -0
  262. package/docs/pwa/pwa.scss +26 -0
  263. package/docs/spec.scss +26 -0
  264. package/docs/themes/_component-themes.scss +26 -0
  265. package/docs/themes/theme-colored-fallbacks.scss +17 -0
  266. package/docs/themes/theme-colored.scss +17 -0
  267. package/docs/themes/theme-default-fallbacks.scss +17 -0
  268. package/docs/themes/theme-default.scss +17 -0
  269. package/jsconfig.json +4 -2
  270. package/package.json +43 -28
  271. package/scripts/deploy-docs.sh +9 -0
  272. package/templates/index.eta +2 -0
  273. package/templates/index.pug +3 -0
  274. package/utils/function.js +3 -0
  275. package/webpack.config.cjs +257 -0
  276. package/components/_index.scss +0 -4
  277. package/components/all-components.scss +0 -14
  278. package/components/common/functions.scss +0 -173
  279. package/components/common/mixins.scss +0 -107
  280. package/components/common/motion.scss +0 -36
  281. package/components/common/ripple.scss +0 -92
  282. package/components/common/variables.scss +0 -48
  283. package/components/complex/dialog/style.scss +0 -159
  284. package/components/complex/dialog/theming.scss +0 -29
  285. package/components/complex/navdrawer/style.scss +0 -477
  286. package/components/complex/navdrawer/theming.scss +0 -58
  287. package/components/complex/search/index.js +0 -492
  288. package/components/core/bottomnav/README.md +0 -85
  289. package/components/core/bottomnav/index.js +0 -140
  290. package/components/core/bottomnav/style.scss +0 -173
  291. package/components/core/bottomnav/theming.scss +0 -42
  292. package/components/core/button/index.js +0 -52
  293. package/components/core/button/style.scss +0 -283
  294. package/components/core/button/theming.scss +0 -131
  295. package/components/core/list/index.js +0 -94
  296. package/components/core/list/style.scss +0 -269
  297. package/components/core/list/theming.scss +0 -74
  298. package/components/core/menu/index.js +0 -127
  299. package/components/core/menu/style.scss +0 -239
  300. package/components/core/menu/theming.scss +0 -55
  301. package/components/core/progress/index.js +0 -33
  302. package/components/core/selection/style.scss +0 -249
  303. package/components/core/selection/theming.scss +0 -49
  304. package/components/core/switch/style.scss +0 -3
  305. package/components/core/tab/index.js +0 -174
  306. package/components/core/tab/style.scss +0 -202
  307. package/components/core/tab/theming.scss +0 -43
  308. package/components/core/textfield/index.js +0 -169
  309. package/components/core/textfield/style.scss +0 -672
  310. package/components/core/textfield/theming.scss +0 -262
  311. package/components/core/toolbar/style.scss +0 -109
  312. package/components/core/toolbar/theming.scss +0 -28
  313. package/components/core/tooltip/style.scss +0 -127
  314. package/components/core/type/style.scss +0 -133
  315. package/components/core/type/theming.scss +0 -25
  316. package/components/index.js +0 -24
  317. package/components/template/theming.scss +0 -31
  318. package/components/theming/theming.scss +0 -504
  319. package/docs/bottomnav.html +0 -171
  320. package/docs/bottomnav.min.js +0 -383
  321. package/docs/button.html +0 -322
  322. package/docs/button.min.js +0 -251
  323. package/docs/components.min.css +0 -1
  324. package/docs/components.min.js +0 -83
  325. package/docs/dialog.html +0 -103
  326. package/docs/dialog.min.js +0 -160
  327. package/docs/docs.min.css +0 -1
  328. package/docs/docs.min.js +0 -83
  329. package/docs/index.html +0 -55
  330. package/docs/index.min.js +0 -83
  331. package/docs/list.html +0 -442
  332. package/docs/list.min.js +0 -312
  333. package/docs/menu.html +0 -185
  334. package/docs/menu.min.js +0 -370
  335. package/docs/navdrawer.html +0 -199
  336. package/docs/navdrawer.min.js +0 -244
  337. package/docs/progress.html +0 -75
  338. package/docs/progress.min.js +0 -162
  339. package/docs/search.html +0 -230
  340. package/docs/search.min.js +0 -1202
  341. package/docs/selection.html +0 -188
  342. package/docs/selection.min.js +0 -160
  343. package/docs/src/complex/dialog.js +0 -3
  344. package/docs/src/complex/dialog.pug +0 -44
  345. package/docs/src/complex/navdrawer.js +0 -82
  346. package/docs/src/complex/navdrawer.pug +0 -109
  347. package/docs/src/complex/search.js +0 -207
  348. package/docs/src/complex/search.pug +0 -143
  349. package/docs/src/components.scss +0 -1
  350. package/docs/src/core/bottomnav.js +0 -22
  351. package/docs/src/core/bottomnav.pug +0 -93
  352. package/docs/src/core/button.js +0 -16
  353. package/docs/src/core/button.pug +0 -73
  354. package/docs/src/core/list.js +0 -21
  355. package/docs/src/core/list.pug +0 -246
  356. package/docs/src/core/menu.js +0 -33
  357. package/docs/src/core/menu.pug +0 -108
  358. package/docs/src/core/progress.js +0 -11
  359. package/docs/src/core/progress.pug +0 -17
  360. package/docs/src/core/selection.js +0 -4
  361. package/docs/src/core/selection.pug +0 -92
  362. package/docs/src/core/tab.js +0 -21
  363. package/docs/src/core/tab.pug +0 -180
  364. package/docs/src/core/textfield.js +0 -15
  365. package/docs/src/core/textfield.pug +0 -274
  366. package/docs/src/core/toolbar.js +0 -4
  367. package/docs/src/core/toolbar.pug +0 -79
  368. package/docs/src/core/tooltip.js +0 -4
  369. package/docs/src/core/tooltip.pug +0 -76
  370. package/docs/src/core/type.js +0 -4
  371. package/docs/src/core/type.pug +0 -36
  372. package/docs/src/docs.scss +0 -200
  373. package/docs/src/index.pug +0 -5
  374. package/docs/src/mixins.pug +0 -72
  375. package/docs/src/targetHandler.js +0 -50
  376. package/docs/src/theming.ie11.scss +0 -35
  377. package/docs/src/theming.scss +0 -36
  378. package/docs/tab.html +0 -301
  379. package/docs/tab.min.js +0 -397
  380. package/docs/textfield.html +0 -476
  381. package/docs/textfield.min.js +0 -381
  382. package/docs/theming.ie11.min.css +0 -1
  383. package/docs/theming.ie11.min.js +0 -83
  384. package/docs/theming.min.css +0 -1
  385. package/docs/theming.min.js +0 -83
  386. package/docs/toolbar.html +0 -213
  387. package/docs/toolbar.min.js +0 -160
  388. package/docs/tooltip.html +0 -138
  389. package/docs/tooltip.min.js +0 -160
  390. package/docs/type.html +0 -94
  391. package/docs/type.min.js +0 -160
  392. package/webpack.config.js +0 -176
package/docs/selection.html DELETED
@@ -1,188 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <title>Material Design Web</title>
5
- <meta charset="utf-8">
6
- <meta content="IE=edge" http-equiv="X-UA-Compatible">
7
- <meta content="" name="description">
8
- <meta content="width=device-width initial-scale=1" name="viewport">
9
- <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
10
- <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:300,400,500,700">
11
- <link rel="stylesheet" href="docs.min.css">
12
- <link rel="stylesheet" href="components.min.css">
13
- <link rel="stylesheet" href="theming.min.css">
14
- <link rel="stylesheet" href="theming.ie11.min.css" media="screen and (-ms-high-contrast: active), (-ms-high-contrast: none)">
15
- </head>
16
- <body mdw-theme-fill="white light">
17
- <div class="mdw-navdrawer" id="docs-navdrawer" mdw-theme-fill="background-100 light" mdw-floating="card"><a class="mdw-navdrawer__scrim" href="#"></a>
18
- <div class="mdw-navdrawer__toolbar">
19
- <div class="mdw-toolbar" mdw-theme-fill="accent-500 dark">
20
- <div class="mdw-toolbar__action">
21
- <div class="mdw-toolbar__start">
22
- <div class="mdw-tooltip__wrapper"><a class="mdw-button material-icons" mdw-icon href="#docs-navdrawer">menu</a>
23
- <div class="mdw-tooltip">Menu</div>
24
- </div>
25
- </div>
26
- <div class="mdw-toolbar__title">selection</div>
27
- </div>
28
- </div>
29
- </div>
30
- <div class="mdw-navdrawer__drawer">
31
- <div class="mdw-list"><a class="mdw-list__item" href="index.html" mdw-theme-color="primary">
32
- <div class="mdw-list__text">Home</div></a>
33
- <div class="mdw-list__subheader">Core</div><a class="mdw-list__item" href="bottomnav.html" mdw-theme-color="primary">
34
- <div class="mdw-list__text">bottomnav</div></a><a class="mdw-list__item" href="button.html" mdw-theme-color="primary">
35
- <div class="mdw-list__text">button</div></a><a class="mdw-list__item" href="list.html" mdw-theme-color="primary">
36
- <div class="mdw-list__text">list</div></a><a class="mdw-list__item" href="menu.html" mdw-theme-color="primary">
37
- <div class="mdw-list__text">menu</div></a><a class="mdw-list__item" href="progress.html" mdw-theme-color="primary">
38
- <div class="mdw-list__text">progress</div></a><a class="mdw-list__item" selected href="selection.html" mdw-theme-color="primary">
39
- <div class="mdw-list__text">selection</div></a><a class="mdw-list__item" href="tab.html" mdw-theme-color="primary">
40
- <div class="mdw-list__text">tab</div></a><a class="mdw-list__item" href="textfield.html" mdw-theme-color="primary">
41
- <div class="mdw-list__text">textfield</div></a><a class="mdw-list__item" href="toolbar.html" mdw-theme-color="primary">
42
- <div class="mdw-list__text">toolbar</div></a><a class="mdw-list__item" href="type.html" mdw-theme-color="primary">
43
- <div class="mdw-list__text">type</div></a>
44
- <div class="mdw-list__subheader">Complex</div><a class="mdw-list__item" href="dialog.html" mdw-theme-color="accent">
45
- <div class="mdw-list__text">dialog</div></a><a class="mdw-list__item" href="navdrawer.html" mdw-theme-color="accent">
46
- <div class="mdw-list__text">navdrawer</div></a><a class="mdw-list__item" href="search.html" mdw-theme-color="accent">
47
- <div class="mdw-list__text">search</div></a>
48
- </div>
49
- </div>
50
- <div class="mdw-navdrawer__content">
51
- <div id="horizontalLine"></div>
52
- <div id="verticalLineLeft"></div>
53
- <div id="verticalLineRight"></div>
54
- <div class="comparison mdw-theme-selection">
55
- <div class="render">
56
- <div class="androidstatusbar" mdw-theme-fill="accent-700 dark">
57
- <div>12:30</div><i class="material-icons" style="letter-spacing:2px;">&#xE1BA;&#xE1C8;&#xE1A4;</i>
58
- </div>
59
- <div class="mdw-toolbar" mdw-theme-fill="accent-500 dark">
60
- <div class="mdw-toolbar__action">
61
- <div class="mdw-toolbar__title">Title</div>
62
- </div>
63
- </div>
64
- <div class="content" mdw-theme-fill="background-50 light" style="padding-top:7px;">
65
- <ul class="mdw-list">
66
- <li class="mdw-list__subheader">Switch</li>
67
- <li class="mdw-list__item">
68
- <div class="mdw-list__text">Android Switch On</div>
69
- <div class="mdw-list__secondary">
70
- <label class="mdw-switch">
71
- <input type="checkbox">
72
- <div class="mdw-switch__icon"></div>
73
- </label>
74
- </div>
75
- </li>
76
- <li class="mdw-list__item">
77
- <div class="mdw-list__text">Android Switch Off</div>
78
- <div class="mdw-list__secondary">
79
- <label class="mdw-switch">
80
- <input class="mdw-switch__input" type="checkbox">
81
- <div class="mdw-switch__icon"></div>
82
- </label>
83
- </div>
84
- </li>
85
- </ul>
86
- <ul class="mdw-list">
87
- <li class="mdw-list__subheader">Single check</li>
88
- <label class="mdw-list__item" mdw-ripple>
89
- <div class="mdw-ripple">
90
- <div class="mdw-ripple__inner"></div>
91
- </div>
92
- <div class="mdw-list__text">Option 1</div>
93
- <div class="mdw-list__secondary">
94
- <div class="mdw-selection" mdw-theme-color="accent-700">
95
- <input class="mdw-selection__input" type="radio" name="selectiontest" checked>
96
- <div class="mdw-selection__icon"></div>
97
- </div>
98
- </div>
99
- </label>
100
- <label class="mdw-list__item" mdw-ripple>
101
- <div class="mdw-ripple">
102
- <div class="mdw-ripple__inner"></div>
103
- </div>
104
- <div class="mdw-list__text">Option 2</div>
105
- <div class="mdw-list__secondary">
106
- <div class="mdw-selection" mdw-theme-color="primary-700">
107
- <input class="mdw-selection__input" type="radio" name="selectiontest">
108
- <div class="mdw-selection__icon"></div>
109
- </div>
110
- </div>
111
- </label>
112
- </ul>
113
- <ul class="mdw-list">
114
- <li class="mdw-list__subheader">Multiple check</li>
115
- <label class="mdw-list__item" mdw-ripple>
116
- <div class="mdw-ripple">
117
- <div class="mdw-ripple__inner"></div>
118
- </div>
119
- <div class="mdw-list__text">Option 1</div>
120
- <div class="mdw-list__secondary">
121
- <div class="mdw-selection" mdw-theme-color="accent-A400">
122
- <input class="mdw-selection__input" type="checkbox" checked>
123
- <div class="mdw-selection__icon"></div>
124
- </div>
125
- </div>
126
- </label>
127
- <label class="mdw-list__item" mdw-ripple>
128
- <div class="mdw-ripple">
129
- <div class="mdw-ripple__inner"></div>
130
- </div>
131
- <div class="mdw-list__text">Option 2</div>
132
- <div class="mdw-list__secondary">
133
- <div class="mdw-selection" mdw-theme-color="primary-700">
134
- <input class="mdw-selection__input" type="checkbox" checked>
135
- <div class="mdw-selection__icon"></div>
136
- </div>
137
- </div>
138
- </label>
139
- <label class="mdw-list__item" mdw-ripple>
140
- <div class="mdw-ripple">
141
- <div class="mdw-ripple__inner"></div>
142
- </div>
143
- <div class="mdw-list__text">Option 3</div>
144
- <div class="mdw-list__secondary">
145
- <div class="mdw-selection" mdw-theme-color="warn">
146
- <input class="mdw-selection__input" type="checkbox">
147
- <div class="mdw-selection__icon"></div>
148
- </div>
149
- </div>
150
- </label>
151
- </ul>
152
- </div>
153
- </div>
154
- <div class="target" style="background-image: url(https://storage.googleapis.com/material-design/publish/material_v_12/assets/0B57Y8yNEHsZPQXRHTEpLc0JXVnM/material-design.platform-adaptation-control-1.png);"></div>
155
- </div>
156
- <div class="comparison mdw-theme-selection">
157
- <div class="render">
158
- <div class="androidstatusbar" mdw-theme-fill="accent-700 dark">
159
- <div>12:30</div><i class="material-icons" style="letter-spacing:2px;">&#xE1BA;&#xE1C8;&#xE1A4;</i>
160
- </div>
161
- <div class="mdw-toolbar" mdw-theme-fill="accent-500 dark">
162
- <div class="mdw-toolbar__action">
163
- <div class="mdw-toolbar__title">Title</div>
164
- </div>
165
- </div>
166
- <div class="content" mdw-theme-fill="background-50 light">
167
- <div class="display-flex" style="padding:16px;">
168
- <label class="mdw-selection" mdw-theme-color="primary-700">
169
- <div class="mdw-selection__label">Prefixed</div>
170
- <input class="mdw-selection__input" type="checkbox" checked>
171
- <div class="mdw-selection__icon"></div>
172
- </label>
173
- </div>
174
- <div class="display-flex" style="padding:16px;">
175
- <label class="mdw-selection" mdw-theme-color="accent-A700">
176
- <input class="mdw-selection__input" type="checkbox" checked>
177
- <div class="mdw-selection__icon"></div>
178
- <div class="mdw-selection__label">Suffixed</div>
179
- </label>
180
- </div>
181
- </div>
182
- </div>
183
- </div>
184
- </div>
185
- </div>
186
- <script src="selection.min.js"></script>
187
- </body>
188
- </html>
package/docs/selection.min.js DELETED
@@ -1,160 +0,0 @@
1
- /******/ (function(modules) { // webpackBootstrap
2
- /******/ // The module cache
3
- /******/ var installedModules = {};
4
- /******/
5
- /******/ // The require function
6
- /******/ function __webpack_require__(moduleId) {
7
- /******/
8
- /******/ // Check if module is in cache
9
- /******/ if(installedModules[moduleId]) {
10
- /******/ return installedModules[moduleId].exports;
11
- /******/ }
12
- /******/ // Create a new module (and put it into the cache)
13
- /******/ var module = installedModules[moduleId] = {
14
- /******/ i: moduleId,
15
- /******/ l: false,
16
- /******/ exports: {}
17
- /******/ };
18
- /******/
19
- /******/ // Execute the module function
20
- /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
21
- /******/
22
- /******/ // Flag the module as loaded
23
- /******/ module.l = true;
24
- /******/
25
- /******/ // Return the exports of the module
26
- /******/ return module.exports;
27
- /******/ }
28
- /******/
29
- /******/
30
- /******/ // expose the modules object (__webpack_modules__)
31
- /******/ __webpack_require__.m = modules;
32
- /******/
33
- /******/ // expose the module cache
34
- /******/ __webpack_require__.c = installedModules;
35
- /******/
36
- /******/ // define getter function for harmony exports
37
- /******/ __webpack_require__.d = function(exports, name, getter) {
38
- /******/ if(!__webpack_require__.o(exports, name)) {
39
- /******/ Object.defineProperty(exports, name, {
40
- /******/ configurable: false,
41
- /******/ enumerable: true,
42
- /******/ get: getter
43
- /******/ });
44
- /******/ }
45
- /******/ };
46
- /******/
47
- /******/ // getDefaultExport function for compatibility with non-harmony modules
48
- /******/ __webpack_require__.n = function(module) {
49
- /******/ var getter = module && module.__esModule ?
50
- /******/ function getDefault() { return module['default']; } :
51
- /******/ function getModuleExports() { return module; };
52
- /******/ __webpack_require__.d(getter, 'a', getter);
53
- /******/ return getter;
54
- /******/ };
55
- /******/
56
- /******/ // Object.prototype.hasOwnProperty.call
57
- /******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
58
- /******/
59
- /******/ // __webpack_public_path__
60
- /******/ __webpack_require__.p = "";
61
- /******/
62
- /******/ // Load entry module and return exports
63
- /******/ return __webpack_require__(__webpack_require__.s = 32);
64
- /******/ })
65
- /************************************************************************/
66
- /******/ ({
67
-
68
- /***/ 0:
69
- /***/ (function(module, exports, __webpack_require__) {
70
-
71
- "use strict";
72
-
73
-
74
- Object.defineProperty(exports, "__esModule", {
75
- value: true
76
- });
77
- var crosshairs = {};
78
- var vOffset = 0;
79
- var hOffset = 0;
80
-
81
- Object.defineProperty(crosshairs, 'vOffset', {
82
- enumerable: true,
83
- configurable: false,
84
- get: function get() {
85
- return vOffset;
86
- },
87
- set: function set(val) {
88
- vOffset = val;
89
- document.getElementById('verticalLineLeft').style.left = val + 'px';
90
- document.getElementById('verticalLineRight').style.left = val + 'px';
91
- }
92
- });
93
-
94
- Object.defineProperty(crosshairs, 'hOffset', {
95
- enumerable: true,
96
- configurable: false,
97
- get: function get() {
98
- return hOffset;
99
- },
100
- set: function set(val) {
101
- hOffset = val;
102
- document.getElementById('horizontalLine').style.top = val + 'px';
103
- }
104
- });
105
-
106
- /**
107
- * @param {MouseEvent} event
108
- * @return {void}
109
- */
110
- function onTemplateImageClick(event) {
111
- document.getElementById('horizontalLine').style.top = event.clientY + 'px';
112
- document.getElementById('verticalLineLeft').style.left = event.layerX + 'px';
113
- document.getElementById('verticalLineRight').style.left = event.clientX + 'px';
114
- }
115
-
116
- /** @return {void} */
117
- function setupImageTargets() {
118
- var targets = document.getElementsByClassName('target');
119
- for (var i = 0; i < targets.length; i += 1) {
120
- targets[i].addEventListener('click', onTemplateImageClick);
121
- }
122
- }
123
-
124
- exports.default = setupImageTargets;
125
-
126
- /***/ }),
127
-
128
- /***/ 32:
129
- /***/ (function(module, exports, __webpack_require__) {
130
-
131
- __webpack_require__(33);
132
- module.exports = __webpack_require__(34);
133
-
134
-
135
- /***/ }),
136
-
137
- /***/ 33:
138
- /***/ (function(module, exports, __webpack_require__) {
139
-
140
- "use strict";
141
-
142
-
143
- var _targetHandler = __webpack_require__(0);
144
-
145
- var _targetHandler2 = _interopRequireDefault(_targetHandler);
146
-
147
- function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
148
-
149
- (0, _targetHandler2.default)();
150
-
151
- /***/ }),
152
-
153
- /***/ 34:
154
- /***/ (function(module, exports) {
155
-
156
- // removed by extract-text-webpack-plugin
157
-
158
- /***/ })
159
-
160
- /******/ });
package/docs/src/complex/dialog.js DELETED
@@ -1,3 +0,0 @@
1
- import setupImageTargets from '../targetHandler';
2
-
3
- setupImageTargets();
package/docs/src/complex/dialog.pug DELETED
@@ -1,44 +0,0 @@
1
- include ../mixins.pug
2
-
3
- +header()
4
- +navdrawer("dialog")
5
- #horizontalLine
6
- #verticalLineLeft
7
- #verticalLineRight
8
- .comparison
9
- .render
10
- div.display-flex.flex-1(mdw-theme-fill="background-50 light" flex-column style="position:relative")
11
- +androidstatusbar('primary-700 dark')
12
- .mdw-toolbar(mdw-theme-fill="primary-500 dark")
13
- .mdw-toolbar__action
14
- .mdw-toolbar__start
15
- .mdw-tooltip__wrapper
16
- .mdw-button(mdw-icon).material-icons menu
17
- .mdw-tooltip Menu
18
- .mdw-toolbar__end
19
- .mdw-tooltip__wrapper
20
- .mdw-button(mdw-icon mdw-more-button).material-icons more_vert
21
- .mdw-tooltip Options
22
- .content(style="padding:16px 8px;")
23
- a.mdw-button(mdw-theme-fill="primary dark" mdw-raised href="#confirmdialog-titled") Titled
24
- a.mdw-button(mdw-theme-fill="primary dark" mdw-raised href="#confirmdialog-text") Text
25
- .mdw-dialog#confirmdialog-titled
26
- a.mdw-dialog__close(href="#")
27
- .mdw-dialog__popup
28
- .mdw-dialog__content
29
- .mdw-dialog__title Use Google's location service?
30
- .mdw-dialog__body Let Google help apps determine location. This means sending anonymous location data to Google, even when no apps are running.
31
- .mdw-dialog__button-area
32
- a.mdw-button(mdw-theme-color="accent" href="#") Disagree
33
- a.mdw-button(mdw-theme-color="accent" href="#") Agree
34
- .mdw-dialog#confirmdialog-text
35
- a.mdw-dialog__close(href="#")
36
- .mdw-dialog__popup
37
- .mdw-dialog__content
38
- .mdw-dialog__body Discard draft?
39
- .mdw-dialog__button-area
40
- a.mdw-button(mdw-theme-color="accent" href="#") Cancel
41
- a.mdw-button(mdw-theme-color="accent" href="#") Discard
42
- +androidnavbar
43
- +target('https://storage.googleapis.com/material-design/publish/material_v_12/assets/0Bzhp5Z4wHba3ejNQaWYtOGdiUXM/components-dialogs-content1.png')
44
- script(src='dialog.min.js')
package/docs/src/complex/navdrawer.js DELETED
@@ -1,82 +0,0 @@
1
- import setupImageTargets from '../targetHandler';
2
-
3
- /** @return {void} */
4
- function configureNavDrawer() {
5
- const navElement = document.querySelector('#navdrawer');
6
- /**
7
- * @param {Event} event
8
- * @return {void}
9
- */
10
- function onSelected(event) {
11
- switch (event.target.value) {
12
- case 'temporary':
13
- navElement.removeAttribute('mdw-clipped');
14
- navElement.removeAttribute('mdw-floating');
15
- navElement.setAttribute('mdw-temporary', '');
16
- return;
17
- case 'clipped':
18
- navElement.setAttribute('mdw-clipped', '');
19
- navElement.removeAttribute('mdw-floating');
20
- navElement.removeAttribute('mdw-temporary');
21
- return;
22
- case 'floating':
23
- navElement.removeAttribute('mdw-clipped');
24
- navElement.setAttribute('mdw-floating', '');
25
- navElement.removeAttribute('mdw-temporary');
26
- return;
27
- case 'floatingcard':
28
- navElement.removeAttribute('mdw-clipped');
29
- navElement.setAttribute('mdw-floating', 'card');
30
- navElement.removeAttribute('mdw-temporary');
31
- return;
32
- default:
33
- case 'fullheight':
34
- navElement.removeAttribute('mdw-clipped');
35
- navElement.removeAttribute('mdw-floating');
36
- navElement.removeAttribute('mdw-temporary');
37
- }
38
- }
39
- const radioElements = document.querySelectorAll('input[name="mdw-navdrawer__style"]');
40
- for (let i = 0; i < radioElements.length; i += 1) {
41
- const element = radioElements[i];
42
- element.addEventListener('change', onSelected);
43
- }
44
- document.querySelector('input[name="mdw-navdrawer__mini"]').addEventListener('change', (event) => {
45
- if (event.target.checked) {
46
- navElement.setAttribute('mdw-mini', '');
47
- } else {
48
- navElement.removeAttribute('mdw-mini');
49
- }
50
- });
51
- const navdrawerDrawer = document.querySelector('#navdrawer .mdw-navdrawer__drawer');
52
- const navdrawerDrawerListItems = navdrawerDrawer.getElementsByClassName('mdw-list__item');
53
-
54
- /**
55
- * @param {NodeListOf<Element>} items
56
- * @return {Element}
57
- */
58
- function getSelectedListItem(items) {
59
- for (let i = 0; i < items.length; i += 1) {
60
- if (items[i].hasAttribute('selected')) {
61
- return items[i];
62
- }
63
- }
64
- return null;
65
- }
66
- for (let i = 0; i < navdrawerDrawerListItems.length; i += 1) {
67
- const item = navdrawerDrawerListItems[i];
68
- item.addEventListener('click', () => {
69
- if (item.hasAttribute('selected')) {
70
- return;
71
- }
72
- const currentlySelected = getSelectedListItem(navdrawerDrawerListItems);
73
- if (currentlySelected) {
74
- currentlySelected.removeAttribute('selected');
75
- }
76
- item.setAttribute('selected', '');
77
- });
78
- }
79
- }
80
-
81
- configureNavDrawer();
82
- setupImageTargets();
package/docs/src/complex/navdrawer.pug DELETED
@@ -1,109 +0,0 @@
1
- include ../mixins.pug
2
-
3
- +header()
4
- +navdrawer("navdrawer")
5
- #horizontalLine
6
- #verticalLineLeft
7
- #verticalLineRight
8
- .comparison
9
- .render(style="min-width:640px")
10
- .mdw-navdrawer#navdrawer(mdw-theme-fill="background-100 light")
11
- a.mdw-navdrawer__scrim(href="#")
12
- .mdw-navdrawer__toolbar
13
- +androidstatusbar('accent-700 dark')
14
- .mdw-toolbar(mdw-theme-fill="accent-500 dark")
15
- .mdw-toolbar__action
16
- .mdw-toolbar__start
17
- .mdw-tooltip__wrapper
18
- a.mdw-button(mdw-icon href="#navdrawer").material-icons menu
19
- .mdw-tooltip Menu
20
- .mdw-toolbar__title Nav Test
21
- .mdw-toolbar__end
22
- .mdw-tooltip__wrapper
23
- .mdw-button(mdw-icon mdw-more-button).material-icons more_vert
24
- .mdw-tooltip Options
25
- .mdw-navdrawer__drawer
26
- .mdw-navdrawer__account
27
- .mdw-navdrawer__image
28
- img(src="http://yesassets.okdk.co.uk/minititle/cache/minititle-5344-q90-h900-ml99-rz3-b75.jpg")
29
- .mdw-navdrawer__avatars
30
- .mdw-navdrawer__avatars-current
31
- .mdw-button(mdw-image)
32
- img(src="https://i.imgur.com/4YkReKZ.png")
33
- .mdw-navdrawer__avatars-others
34
- .mdw-button(mdw-image)
35
- img(src="https://i.imgur.com/4YkReKZ.png")
36
- .mdw-button(mdw-image)
37
- img(src="https://i.imgur.com/4YkReKZ.png")
38
- .mdw-button.mdw-navdrawer__subtitle
39
- .mdw-navdrawer__name Johnathan Lee
40
- .mdw-navdrawer__email heyfromjonathan@gmail.com
41
- a.mdw-navdrawer__close.mdw-button(mdw-icon href="#").material-icons chevron_left
42
- .mdw-list
43
- .mdw-list__item(selected mdw-theme-color="accent-A400 light")
44
- .mdw-list__icon
45
- .material-icons move_to_inbox
46
- .mdw-list__text Inbox
47
- .mdw-list__item(mdw-theme-color="primary-500 dark")
48
- .mdw-list__icon
49
- .material-icons star
50
- .mdw-list__text Starred
51
- .mdw-list__item(mdw-theme-color="warn-500 dark")
52
- .mdw-list__icon
53
- .material-icons send
54
- .mdw-list__text Sent
55
- .mdw-list__item
56
- .mdw-list__icon
57
- .material-icons drafts
58
- .mdw-list__text Drafts
59
- .mdw-list__divider
60
- .mdw-list
61
- .mdw-list__subheader Subheader
62
- .mdw-list__item
63
- .mdw-list__icon
64
- .material-icons mail
65
- .mdw-list__text All mail
66
- .mdw-list__item
67
- .mdw-list__icon
68
- .material-icons delete
69
- .mdw-list__text Trash
70
- .mdw-list__item
71
- .mdw-list__icon
72
- .material-icons report
73
- .mdw-list__text Spam
74
- .mdw-navdrawer__content(style="padding:16px 8px;")
75
- div
76
- span Desktop options
77
- div.display-flex(style="padding:16px")
78
- label.mdw-selection(mdw-theme-color="accent-A700 dark")
79
- input.mdw-selection__input(type="radio" checked name="mdw-navdrawer__style" value="fullheight")
80
- .mdw-selection__icon
81
- .mdw-selection__label Full Height (default)
82
- div.display-flex(style="padding:16px")
83
- label.mdw-selection(mdw-theme-color="accent-A700 dark")
84
- input.mdw-selection__input(type="radio" name="mdw-navdrawer__style" value="temporary")
85
- .mdw-selection__icon
86
- .mdw-selection__label Temporary
87
- div.display-flex(style="padding:16px")
88
- label.mdw-selection(mdw-theme-color="accent-A700 dark")
89
- input.mdw-selection__input(type="radio" name="mdw-navdrawer__style" value="clipped")
90
- .mdw-selection__icon
91
- .mdw-selection__label Clipped
92
- div.display-flex(style="padding:16px")
93
- label.mdw-selection(mdw-theme-color="accent-A700 dark")
94
- input.mdw-selection__input(type="radio" name="mdw-navdrawer__style" value="floating")
95
- .mdw-selection__icon
96
- .mdw-selection__label Floating
97
- div.display-flex(style="padding:16px")
98
- label.mdw-selection(mdw-theme-color="accent-A700 dark")
99
- input.mdw-selection__input(type="radio" name="mdw-navdrawer__style" value="floatingcard")
100
- .mdw-selection__icon
101
- .mdw-selection__label Floating Card
102
- div.display-flex(style="padding:16px")
103
- label.mdw-selection(mdw-theme-color="accent-A700 dark")
104
- input.mdw-selection__input(type="checkbox" name="mdw-navdrawer__mini")
105
- .mdw-selection__icon
106
- .mdw-selection__label Mini
107
- +androidnavbar
108
- +target('https://storage.googleapis.com/material-design/publish/material_v_12/assets/0Bzhp5Z4wHba3eXV2RE1fQ0QtQzQ/patterns-navdrawer-metrics3.png')
109
- script(src='navdrawer.min.js')