@shortfuse/materialdesignweb 0.3.0 → 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 (398) hide show
  1. package/.eslintrc.json +136 -30
  2. package/.stylelintrc.json +6 -40
  3. package/.vscode/launch.json +20 -5
  4. package/CHANGELOG.md +24 -0
  5. package/README.md +12 -9
  6. package/adapters/datatable/column.js +82 -74
  7. package/adapters/datatable/index.js +173 -131
  8. package/adapters/dom/index.js +529 -75
  9. package/adapters/list/index.js +25 -12
  10. package/adapters/search/index.js +13 -13
  11. package/components/appbar/_spec.scss +87 -64
  12. package/components/appbar/index.scss +2 -2
  13. package/components/banner/_spec.scss +8 -8
  14. package/components/banner/index.scss +2 -2
  15. package/components/bottomnav/_spec.scss +22 -17
  16. package/components/bottomnav/index.js +61 -52
  17. package/components/bottomnav/index.scss +2 -2
  18. package/components/bottomnav/item.js +44 -25
  19. package/components/button/README.md +14 -14
  20. package/components/button/_spec.scss +23 -22
  21. package/components/button/_theme.scss +37 -21
  22. package/components/button/index.eta +32 -0
  23. package/components/button/index.js +12 -12
  24. package/components/button/index.scss +2 -2
  25. package/components/card/_spec.scss +40 -36
  26. package/components/card/index.scss +2 -2
  27. package/components/chip/_spec.scss +7 -8
  28. package/components/chip/_theme.scss +31 -31
  29. package/components/chip/index.js +3 -2
  30. package/components/chip/index.scss +2 -2
  31. package/components/chip/item.js +1 -16
  32. package/components/datatable/_spec.scss +71 -85
  33. package/components/datatable/_theme.scss +61 -156
  34. package/components/datatable/cell.js +45 -0
  35. package/components/datatable/columnheader.js +47 -0
  36. package/components/datatable/index.js +279 -366
  37. package/components/datatable/index.scss +2 -2
  38. package/components/datatable/row.js +49 -0
  39. package/components/datatable/rowheader.js +18 -0
  40. package/components/dialog/_spec.scss +61 -41
  41. package/components/dialog/index.js +325 -297
  42. package/components/dialog/index.scss +2 -2
  43. package/components/divider/_spec.scss +8 -6
  44. package/components/divider/index.scss +2 -2
  45. package/components/elevation/_spec.scss +2 -2
  46. package/components/elevation/index.scss +2 -2
  47. package/components/fab/_spec.scss +23 -24
  48. package/components/fab/index.js +50 -50
  49. package/components/fab/index.scss +2 -2
  50. package/components/grid/_spec.scss +33 -31
  51. package/components/grid/index.scss +2 -2
  52. package/components/layout/_mixins.scss +5 -5
  53. package/components/layout/_spec.scss +206 -176
  54. package/components/layout/_theme.scss +14 -16
  55. package/components/layout/index.js +181 -153
  56. package/components/layout/index.scss +2 -2
  57. package/components/list/_spec.scss +117 -104
  58. package/components/list/_theme.scss +31 -34
  59. package/components/list/content.js +68 -52
  60. package/components/list/index.js +194 -61
  61. package/components/list/index.scss +2 -2
  62. package/components/list/item.js +136 -12
  63. package/components/list/secondary.js +46 -0
  64. package/components/menu/_spec.scss +32 -19
  65. package/components/menu/index.js +242 -229
  66. package/components/menu/index.scss +2 -2
  67. package/components/menu/item.js +95 -110
  68. package/components/progress/_spec.scss +35 -27
  69. package/components/progress/index.js +21 -0
  70. package/components/progress/index.scss +2 -1
  71. package/components/selection/_spec.scss +242 -224
  72. package/components/selection/_theme.scss +100 -95
  73. package/components/selection/index.eta +60 -0
  74. package/components/selection/index.js +76 -0
  75. package/components/selection/index.pug +15 -8
  76. package/components/selection/index.scss +2 -2
  77. package/components/selection/input.js +56 -0
  78. package/components/selection/radiogroup.js +47 -0
  79. package/components/slider/_spec.scss +10 -8
  80. package/components/slider/index.scss +2 -2
  81. package/components/snackbar/_spec.scss +22 -21
  82. package/components/snackbar/index.js +102 -111
  83. package/components/snackbar/index.scss +2 -2
  84. package/components/tab/_spec.scss +20 -19
  85. package/components/tab/content.js +41 -40
  86. package/components/tab/index.js +192 -99
  87. package/components/tab/index.scss +2 -2
  88. package/components/tab/item.js +38 -55
  89. package/components/tab/list.js +96 -72
  90. package/components/tab/panel.js +12 -13
  91. package/components/template/_theme.scss +11 -11
  92. package/components/textfield/_mixins.scss +52 -0
  93. package/components/textfield/_spec.scss +215 -266
  94. package/components/textfield/_theme.scss +95 -72
  95. package/components/textfield/index.eta +74 -0
  96. package/components/textfield/index.js +63 -57
  97. package/components/textfield/index.scss +2 -2
  98. package/components/tooltip/_spec.scss +27 -25
  99. package/components/tooltip/index.scss +2 -2
  100. package/components/type/_spec.scss +51 -38
  101. package/components/type/index.scss +2 -2
  102. package/core/_breakpoint.scss +75 -91
  103. package/core/_elevation.scss +10 -10
  104. package/core/_length.scss +9 -0
  105. package/core/_motion.scss +14 -14
  106. package/core/_platform.scss +9 -15
  107. package/core/_type.scss +33 -32
  108. package/core/aria/attributes.js +125 -25
  109. package/core/aria/button.js +23 -23
  110. package/core/aria/keyboard.js +93 -0
  111. package/core/aria/rovingtabindex.js +69 -154
  112. package/core/aria/tab.js +31 -28
  113. package/core/color/_theme.scss +240 -280
  114. package/core/color/index.scss +2 -2
  115. package/core/document/index.js +39 -0
  116. package/core/dom.js +12 -12
  117. package/core/overlay/_spec.scss +0 -3
  118. package/core/overlay/_theme.scss +56 -74
  119. package/core/overlay/index.js +49 -18
  120. package/core/overlay/index.scss +2 -2
  121. package/core/ripple/_spec.scss +22 -39
  122. package/core/ripple/_theme.scss +13 -13
  123. package/core/ripple/index.js +137 -134
  124. package/core/ripple/index.scss +2 -2
  125. package/core/theme/_config.scss +2 -0
  126. package/core/theme/_mixins.scss +172 -0
  127. package/core/theme/_palettes.scss +155 -135
  128. package/core/theme/_variables.scss +24 -15
  129. package/core/theme/index.js +50 -0
  130. package/core/throttler.js +1 -1
  131. package/core/transition/index.js +36 -20
  132. package/{docs-src → docs}/_flex.scss +0 -0
  133. package/{docs-src → docs}/_menuoptions.js +21 -34
  134. package/{docs-src → docs}/_mixins.pug +39 -26
  135. package/docs/_partials/_androidnavbar.eta +5 -0
  136. package/docs/_partials/_androidstatusbar.eta +13 -0
  137. package/docs/_partials/_appbar.eta +29 -0
  138. package/docs/_partials/_buttontest.eta +31 -0
  139. package/docs/_partials/_header.eta +149 -0
  140. package/docs/_partials/_navlistitem.eta +16 -0
  141. package/docs/_partials/_target.eta +1 -0
  142. package/{docs-src → docs}/_sample-utils.js +8 -6
  143. package/{docs-src → docs}/_storage.js +0 -0
  144. package/{docs-src → docs}/docs.scss +5 -2
  145. package/docs/index.eta +16 -0
  146. package/{docs-src → docs}/index.js +0 -0
  147. package/docs/pages/appbar.eta +114 -0
  148. package/{docs-src/components → docs/pages}/appbar.js +0 -0
  149. package/{docs-src/components → docs/pages}/appbar.pug +15 -18
  150. package/docs/pages/bottomnav.eta +188 -0
  151. package/{docs-src/components → docs/pages}/bottomnav.js +23 -24
  152. package/{docs-src/components → docs/pages}/bottomnav.pug +4 -4
  153. package/docs/pages/button.eta +124 -0
  154. package/{docs-src/components → docs/pages}/button.js +19 -19
  155. package/{docs-src/components → docs/pages}/button.pug +15 -15
  156. package/docs/pages/card.eta +90 -0
  157. package/{docs-src/components → docs/pages}/card.js +3 -3
  158. package/{docs-src/components → docs/pages}/card.pug +7 -7
  159. package/docs/pages/chip.eta +122 -0
  160. package/{docs-src/components → docs/pages}/chip.js +3 -6
  161. package/{docs-src/components → docs/pages}/chip.pug +2 -2
  162. package/docs/pages/color.eta +143 -0
  163. package/{docs-src/core → docs/pages}/color.js +95 -20
  164. package/docs/pages/color.pug +121 -0
  165. package/docs/pages/datatable.eta +323 -0
  166. package/{docs-src/components → docs/pages}/datatable.js +26 -13
  167. package/docs/pages/datatable.pug +283 -0
  168. package/docs/pages/dialog.eta +186 -0
  169. package/{docs-src/components → docs/pages}/dialog.js +26 -13
  170. package/{docs-src/components → docs/pages}/dialog.pug +46 -28
  171. package/docs/pages/dom.eta +26 -0
  172. package/docs/pages/dom.js +143 -0
  173. package/docs/pages/dom.pug +22 -0
  174. package/docs/pages/elevation.eta +35 -0
  175. package/{docs-src/components → docs/pages}/elevation.js +0 -0
  176. package/{docs-src/components → docs/pages}/elevation.pug +0 -0
  177. package/docs/pages/fab.eta +99 -0
  178. package/{docs-src/components → docs/pages}/fab.js +3 -3
  179. package/{docs-src/components → docs/pages}/fab.pug +2 -2
  180. package/docs/pages/grid.eta +135 -0
  181. package/{docs-src/components → docs/pages}/grid.js +1 -1
  182. package/{docs-src/components → docs/pages}/grid.pug +3 -3
  183. package/docs/pages/layout.eta +8 -0
  184. package/{docs-src/components → docs/pages}/layout.js +0 -0
  185. package/{docs-src/components → docs/pages}/layout.pug +0 -0
  186. package/docs/pages/list.eta +465 -0
  187. package/{docs-src/components → docs/pages}/list.js +2 -2
  188. package/{docs-src/components → docs/pages}/list.pug +7 -14
  189. package/docs/pages/menu.eta +276 -0
  190. package/{docs-src/components → docs/pages}/menu.js +14 -10
  191. package/{docs-src/components → docs/pages}/menu.pug +0 -0
  192. package/docs/pages/overlay.eta +69 -0
  193. package/docs/pages/overlay.js +4 -0
  194. package/{docs-src/core → docs/pages}/overlay.pug +14 -11
  195. package/docs/pages/progress.eta +23 -0
  196. package/{docs-src/components → docs/pages}/progress.js +1 -1
  197. package/{docs-src/components → docs/pages}/progress.pug +1 -1
  198. package/docs/pages/ripple.eta +27 -0
  199. package/docs/pages/ripple.js +4 -0
  200. package/{docs-src/core → docs/pages}/ripple.pug +4 -4
  201. package/docs/pages/search.eta +246 -0
  202. package/{docs-src/components → docs/pages}/search.js +59 -42
  203. package/{docs-src/components → docs/pages}/search.pug +50 -51
  204. package/docs/pages/selection.eta +111 -0
  205. package/docs/pages/selection.js +13 -0
  206. package/docs/pages/selection.pug +74 -0
  207. package/docs/pages/slider.eta +23 -0
  208. package/{docs-src/components → docs/pages}/slider.js +0 -0
  209. package/{docs-src/components → docs/pages}/slider.pug +0 -0
  210. package/docs/pages/snackbar.eta +83 -0
  211. package/{docs-src/components → docs/pages}/snackbar.js +3 -3
  212. package/{docs-src/components → docs/pages}/snackbar.pug +0 -0
  213. package/docs/pages/tab.eta +421 -0
  214. package/{docs-src/components → docs/pages}/tab.js +18 -35
  215. package/{docs-src/components → docs/pages}/tab.pug +4 -4
  216. package/docs/pages/textfield.eta +486 -0
  217. package/{docs-src/components → docs/pages}/textfield.js +3 -4
  218. package/{docs-src/components → docs/pages}/textfield.pug +87 -35
  219. package/docs/pages/tooltip.eta +94 -0
  220. package/{docs-src/components → docs/pages}/tooltip.js +0 -0
  221. package/{docs-src/components → docs/pages}/tooltip.pug +0 -1
  222. package/docs/pages/transition.eta +117 -0
  223. package/{docs-src/core → docs/pages}/transition.js +7 -8
  224. package/{docs-src/core → docs/pages}/transition.pug +0 -0
  225. package/docs/pages/type.eta +31 -0
  226. package/{docs-src/components → docs/pages}/type.js +0 -0
  227. package/{docs-src/components → docs/pages}/type.pug +0 -1
  228. package/docs/postrender.js +39 -0
  229. package/{docs-src → docs}/prerender.js +3 -9
  230. package/docs/pwa/_dialogs.eta +143 -0
  231. package/docs/pwa/_dialogs.pug +96 -0
  232. package/docs/pwa/_menus.eta +16 -0
  233. package/{docs-src → docs}/pwa/_menus.pug +0 -0
  234. package/docs/pwa/pwa-prerender.js +3 -0
  235. package/docs/pwa/pwa.eta +480 -0
  236. package/docs/pwa/pwa.js +306 -0
  237. package/{docs-src → docs}/pwa/pwa.pug +166 -263
  238. package/docs/pwa/pwa.scss +26 -0
  239. package/docs/spec.scss +26 -0
  240. package/docs/themes/_component-themes.scss +26 -0
  241. package/docs/themes/theme-colored-fallbacks.scss +17 -0
  242. package/docs/themes/theme-colored.scss +17 -0
  243. package/docs/themes/theme-default-fallbacks.scss +17 -0
  244. package/docs/themes/theme-default.scss +17 -0
  245. package/jsconfig.json +4 -2
  246. package/package.json +40 -27
  247. package/scripts/deploy-docs.sh +9 -0
  248. package/templates/index.eta +2 -0
  249. package/utils/function.js +3 -0
  250. package/webpack.config.cjs +257 -0
  251. package/_spec.scss +0 -27
  252. package/_theme.scss +0 -27
  253. package/components/list/expander.js +0 -142
  254. package/components/list/itemgroup.js +0 -22
  255. package/core/theme/_builder.scss +0 -116
  256. package/core/theme/index.scss +0 -68
  257. package/docs/appbar.html +0 -1
  258. package/docs/appbar.min.js +0 -2
  259. package/docs/appbar.min.js.map +0 -1
  260. package/docs/bottomnav.html +0 -1
  261. package/docs/bottomnav.min.js +0 -2
  262. package/docs/bottomnav.min.js.map +0 -1
  263. package/docs/button.html +0 -1
  264. package/docs/button.min.js +0 -2
  265. package/docs/button.min.js.map +0 -1
  266. package/docs/card.html +0 -1
  267. package/docs/card.min.js +0 -2
  268. package/docs/card.min.js.map +0 -1
  269. package/docs/chip.html +0 -1
  270. package/docs/chip.min.js +0 -2
  271. package/docs/chip.min.js.map +0 -1
  272. package/docs/color.html +0 -1
  273. package/docs/color.min.js +0 -2
  274. package/docs/color.min.js.map +0 -1
  275. package/docs/datatable.html +0 -1
  276. package/docs/datatable.min.js +0 -2
  277. package/docs/datatable.min.js.map +0 -1
  278. package/docs/default.common.min.js +0 -2
  279. package/docs/default.common.min.js.map +0 -1
  280. package/docs/dialog.html +0 -1
  281. package/docs/dialog.min.js +0 -2
  282. package/docs/dialog.min.js.map +0 -1
  283. package/docs/docs.min.css +0 -1
  284. package/docs/docs.min.js +0 -2
  285. package/docs/docs.min.js.map +0 -1
  286. package/docs/elevation.html +0 -1
  287. package/docs/elevation.min.js +0 -2
  288. package/docs/elevation.min.js.map +0 -1
  289. package/docs/fab.html +0 -1
  290. package/docs/fab.min.js +0 -2
  291. package/docs/fab.min.js.map +0 -1
  292. package/docs/grid.html +0 -1
  293. package/docs/grid.min.js +0 -2
  294. package/docs/grid.min.js.map +0 -1
  295. package/docs/index.html +0 -1
  296. package/docs/index.min.js +0 -2
  297. package/docs/index.min.js.map +0 -1
  298. package/docs/ink.html +0 -1
  299. package/docs/ink.min.js +0 -2
  300. package/docs/ink.min.js.map +0 -1
  301. package/docs/layout.html +0 -1
  302. package/docs/layout.min.js +0 -2
  303. package/docs/layout.min.js.map +0 -1
  304. package/docs/list.html +0 -1
  305. package/docs/list.min.js +0 -2
  306. package/docs/list.min.js.map +0 -1
  307. package/docs/menu.html +0 -1
  308. package/docs/menu.min.js +0 -2
  309. package/docs/menu.min.js.map +0 -1
  310. package/docs/overlay.html +0 -1
  311. package/docs/overlay.min.js +0 -2
  312. package/docs/overlay.min.js.map +0 -1
  313. package/docs/prerender.common.min.js +0 -2
  314. package/docs/prerender.common.min.js.map +0 -1
  315. package/docs/prerender.min.js +0 -2
  316. package/docs/prerender.min.js.map +0 -1
  317. package/docs/progress.html +0 -1
  318. package/docs/progress.min.js +0 -2
  319. package/docs/progress.min.js.map +0 -1
  320. package/docs/pwa-prerender.min.js +0 -2
  321. package/docs/pwa-prerender.min.js.map +0 -1
  322. package/docs/pwa.html +0 -11
  323. package/docs/pwa.min.css +0 -1
  324. package/docs/pwa.min.js +0 -2
  325. package/docs/pwa.min.js.map +0 -1
  326. package/docs/ripple.html +0 -1
  327. package/docs/ripple.min.js +0 -2
  328. package/docs/ripple.min.js.map +0 -1
  329. package/docs/search.html +0 -1
  330. package/docs/search.min.js +0 -2
  331. package/docs/search.min.js.map +0 -1
  332. package/docs/selection.html +0 -1
  333. package/docs/selection.min.js +0 -2
  334. package/docs/selection.min.js.map +0 -1
  335. package/docs/slider.html +0 -1
  336. package/docs/slider.min.js +0 -2
  337. package/docs/slider.min.js.map +0 -1
  338. package/docs/snackbar.html +0 -1
  339. package/docs/snackbar.min.js +0 -2
  340. package/docs/snackbar.min.js.map +0 -1
  341. package/docs/spec.min.css +0 -1
  342. package/docs/spec.min.js +0 -2
  343. package/docs/spec.min.js.map +0 -1
  344. package/docs/surface.html +0 -1
  345. package/docs/surface.min.js +0 -2
  346. package/docs/surface.min.js.map +0 -1
  347. package/docs/tab.html +0 -1
  348. package/docs/tab.min.js +0 -2
  349. package/docs/tab.min.js.map +0 -1
  350. package/docs/textfield.html +0 -2
  351. package/docs/textfield.min.js +0 -2
  352. package/docs/textfield.min.js.map +0 -1
  353. package/docs/theme-colored-fallbacks.min.css +0 -1
  354. package/docs/theme-colored-fallbacks.min.js +0 -2
  355. package/docs/theme-colored-fallbacks.min.js.map +0 -1
  356. package/docs/theme-colored.min.css +0 -1
  357. package/docs/theme-colored.min.js +0 -2
  358. package/docs/theme-colored.min.js.map +0 -1
  359. package/docs/theme-default-fallbacks.min.css +0 -1
  360. package/docs/theme-default-fallbacks.min.js +0 -2
  361. package/docs/theme-default-fallbacks.min.js.map +0 -1
  362. package/docs/theme-default.min.css +0 -1
  363. package/docs/theme-default.min.js +0 -2
  364. package/docs/theme-default.min.js.map +0 -1
  365. package/docs/themes-fallbacks.min.css +0 -1
  366. package/docs/themes-fallbacks.min.js +0 -2
  367. package/docs/themes-fallbacks.min.js.map +0 -1
  368. package/docs/themes.min.css +0 -1
  369. package/docs/themes.min.js +0 -2
  370. package/docs/themes.min.js.map +0 -1
  371. package/docs/tooltip.html +0 -1
  372. package/docs/tooltip.min.js +0 -2
  373. package/docs/tooltip.min.js.map +0 -1
  374. package/docs/transition.html +0 -1
  375. package/docs/transition.min.js +0 -2
  376. package/docs/transition.min.js.map +0 -1
  377. package/docs/type.html +0 -1
  378. package/docs/type.min.js +0 -2
  379. package/docs/type.min.js.map +0 -1
  380. package/docs-src/components/datatable.pug +0 -327
  381. package/docs-src/components/selection.js +0 -9
  382. package/docs-src/components/selection.pug +0 -77
  383. package/docs-src/core/color.pug +0 -201
  384. package/docs-src/core/overlay.js +0 -4
  385. package/docs-src/core/ripple.js +0 -4
  386. package/docs-src/index.pug +0 -9
  387. package/docs-src/pwa/_dialogs.pug +0 -15
  388. package/docs-src/pwa/pwa-prerender.js +0 -3
  389. package/docs-src/pwa/pwa.js +0 -182
  390. package/docs-src/pwa/pwa.scss +0 -25
  391. package/docs-src/spec.scss +0 -1
  392. package/docs-src/themes/theme-colored-fallbacks.scss +0 -14
  393. package/docs-src/themes/theme-colored.scss +0 -14
  394. package/docs-src/themes/theme-default-fallbacks.scss +0 -14
  395. package/docs-src/themes/theme-default.scss +0 -14
  396. package/index.js +0 -51
  397. package/index.scss +0 -2
  398. package/webpack.config.js +0 -187
@@ -17,10 +17,10 @@ include ../_mixins.pug
17
17
  +mdwSelection({ink:'secondary', name:'columns', type:'radio', value:'8'}) 8
18
18
  +mdwSelection({ink:'secondary', name:'columns', type:'radio', value:'4'}) 4
19
19
  +mdwSelection({ink:'secondary', name:'columns', type:'radio', value:'1'}) 1
20
- .mdw-type(mdw-style="subtitle") Style
20
+ .mdw-type(mdw-style="subtitle") Display Model
21
21
  .docs-option-list
22
- +mdwSelection({ink:'secondary', name:'style', type:'radio', value:'flex', checked:true}) Flex
23
- +mdwSelection({ink:'secondary', name:'style', type:'radio', value:'grid'}) 8
22
+ +mdwSelection({ink:'secondary', name:'style', type:'radio', value:'flex', checked:true}) Flexbox
23
+ +mdwSelection({ink:'secondary', name:'style', type:'radio', value:'grid'}) Grid
24
24
  .mdw-type(mdw-style="subtitle") Options
25
25
  .docs-option-list
26
26
  +mdwSelection({ink:'secondary', name:'stretch'}) Stretch
@@ -0,0 +1,8 @@
1
+ <% var T = '../../templates/index.eta' %>
2
+ <% layout('../_partials/_header.eta', {page: 'layout'}) %>
3
+ <div style="margin:16px;">
4
+ <%~ includeFile(T, {button: { attributes: {href:"pwa.html", target:"_blank"}, text: 'Open in new window'}}) %>
5
+ </div>
6
+ <div style="margin:16px;">
7
+ <iframe width="1440" height="300" src="pwa.html" style="width:100%;height:80vh;"></iframe>
8
+ </div>
File without changes
File without changes
@@ -0,0 +1,465 @@
1
+ <% var T = '../../templates/index.eta' %>
2
+ <% layout('../_partials/_header.eta', {page: 'list'}) %>
3
+ <div class="comparison js">
4
+ <div class="render">
5
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'teal 700', dark:true }) %>
6
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'teal 500', dark:true, start: ['menu'], end: ['more_vert'], body: 'Topics' }) %>
7
+ <div class="content" style="padding-top:2px;">
8
+ <ul class="mdw-list">
9
+ <li class="mdw-list__item">
10
+ <a class="mdw-list__content">Attractions</a>
11
+ </li>
12
+ <li class="mdw-list__item" aria-expanded="true">
13
+ <a class="mdw-list__content">
14
+ <div class="mdw-list__text">Dining</div>
15
+ <div class="mdw-list__secondary mdw-theme material-icons" mdw-ink="medium">expand_more</div>
16
+ </a>
17
+ <ul class="mdw-list">
18
+ <li class="mdw-list__item">
19
+ <a class="mdw-list__content">Breakfast &amp; brunch</a>
20
+ </li>
21
+ <li class="mdw-list__item">
22
+ <a class="mdw-list__content">New American</a>
23
+ </li>
24
+ <li class="mdw-list__item">
25
+ <a class="mdw-list__content">Sushi bars</a>
26
+ </li>
27
+ </ul>
28
+ </li>
29
+ <li class="mdw-list__item">
30
+ <a class="mdw-list__content">Education</a>
31
+ </li>
32
+ <li class="mdw-list__item">
33
+ <a class="mdw-list__content">Family</a>
34
+ </li>
35
+ <li class="mdw-list__item">
36
+ <a class="mdw-list__content">Health</a>
37
+ </li>
38
+ <li class="mdw-list__item">
39
+ <a class="mdw-list__content">Office</a>
40
+ </li>
41
+ <li class="mdw-list__item">
42
+ <a class="mdw-list__content">Promotions</a>
43
+ </li>
44
+ <li class="mdw-list__item">
45
+ <a class="mdw-list__content">Radio</a>
46
+ </li>
47
+ <li class="mdw-list__item">
48
+ <a class="mdw-list__content">Recipes</a>
49
+ </li>
50
+ <li class="mdw-list__item">
51
+ <a class="mdw-list__content">Sports</a>
52
+ </li>
53
+ <li class="mdw-list__item">
54
+ <a class="mdw-list__content">Travel</a>
55
+ </li>
56
+ </ul>
57
+ </div>
58
+ <%~ includeFile('../_partials/_androidnavbar.eta') %>
59
+ </div>
60
+ </div>
61
+ <div class="comparison js">
62
+ <div class="render">
63
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'secondary 700', dark:true }) %>
64
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'secondary 500', dark:true, start: ['menu'], end: ['search', 'check_circle'], body: 'Inbox' }) %>
65
+ <div class="content">
66
+ <ul class="mdw-list" mdw-divider>
67
+ <li class="mdw-list__item">
68
+ <a class="mdw-list__content">
69
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
70
+ <div class="mdw-list__text">
71
+ <div class="mdw-list__text-line">Ali Connors</div>
72
+ <div class="mdw-list__text-line">Brunch this weekend?</div>
73
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">I'll be in your neighborhood doing errands this weekend. Do you want to meet?</div>
74
+ </div>
75
+ </a>
76
+ </li>
77
+ <li class="mdw-list__item">
78
+ <a class="mdw-list__content">
79
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
80
+ <div class="mdw-list__text">
81
+ <div class="mdw-list__text-line">me, Scott, Jennifer</div>
82
+ <div class="mdw-list__text-line">Summer BBQ</div>
83
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">Wish I could come. but I'm out of town this weekend.</div>
84
+ </div>
85
+ </a>
86
+ </li>
87
+ <li class="mdw-list__item">
88
+ <a class="mdw-list__content">
89
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
90
+ <div class="mdw-list__text">
91
+ <div class="mdw-list__text-line">Sandra Adams</div>
92
+ <div class="mdw-list__text-line">Oui oui</div>
93
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">Do you have Paris recommendations? Have you ever been?</div>
94
+ </div>
95
+ </a>
96
+ </li>
97
+ <li class="mdw-list__item">
98
+ <a class="mdw-list__content">
99
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
100
+ <div class="mdw-list__text">
101
+ <div class="mdw-list__text-line">Trevor Hansen</div>
102
+ <div class="mdw-list__text-line">Order Confirmation</div>
103
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">Thank you for your recent order from Google.</div>
104
+ </div>
105
+ </a>
106
+ </li>
107
+ <li class="mdw-list__item">
108
+ <a class="mdw-list__content">
109
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
110
+ <div class="mdw-list__text">
111
+ <div class="mdw-list__text-line">Britta Holt</div>
112
+ <div class="mdw-list__text-line">Recipe to try</div>
113
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">We should eat this: Grated Squash, Corn, and tomatillo Tacos.</div>
114
+ </div>
115
+ </a>
116
+ </li>
117
+ <li class="mdw-list__item">
118
+ <a class="mdw-list__content">
119
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
120
+ <div class="mdw-list__text">
121
+ <div class="mdw-list__text-line">David Park</div>
122
+ <div class="mdw-list__text-line">Giants game</div>
123
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">Any interest in seeing</div>
124
+ </div>
125
+ </a>
126
+ </li>
127
+ <li class="mdw-list__item">
128
+ <a class="mdw-list__content">
129
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
130
+ <div class="mdw-list__text">
131
+ <div class="mdw-list__text-line">Montauk weekend</div>
132
+ <div class="mdw-list__text-line">-----</div>
133
+ <div class="mdw-list__text-line mdw-theme" mdw-ink="medium">-----</div>
134
+ </div>
135
+ </a>
136
+ </li>
137
+ </ul>
138
+ </div>
139
+ <%~ includeFile('../_partials/_androidnavbar.eta') %>
140
+ </div>
141
+ </div>
142
+ <div class="comparison">
143
+ <div class="render">
144
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'deeppurple 700', dark:true }) %>
145
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'deeppurple 500', dark:true, start: ['menu'], end: ['search', 'more_vert'], body: 'Topics (CSS-Only)' }) %>
146
+ <div class="content" style="padding-top:2px;">
147
+ <ul class="mdw-list">
148
+ <li class="mdw-list__item">
149
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Attractions</a>
150
+ </li>
151
+ <li class="mdw-list__item">
152
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Dining</a>
153
+ </li>
154
+ <li class="mdw-list__item">
155
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Education</a>
156
+ </li>
157
+ <li class="mdw-list__item">
158
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Family</a>
159
+ </li>
160
+ <li class="mdw-list__item">
161
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Health</a>
162
+ </li>
163
+ <li class="mdw-list__item">
164
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Office</a>
165
+ </li>
166
+ <li class="mdw-list__item">
167
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Promotions</a>
168
+ </li>
169
+ <li class="mdw-list__item">
170
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Radio</a>
171
+ </li>
172
+ <li class="mdw-list__item">
173
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Recipes</a>
174
+ </li>
175
+ <li class="mdw-list__item">
176
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Sports</a>
177
+ </li>
178
+ <li class="mdw-list__item">
179
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Travel</a>
180
+ </li>
181
+ </ul>
182
+ </div>
183
+ </div>
184
+ </div>
185
+ <div class="comparison">
186
+ <div class="render">
187
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'teal 700', dark:true }) %>
188
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'teal 500', dark:true, start: ['menu'], end: ['more_vert'], body: 'Topics (CSS-Only)' }) %>
189
+ <div class="content" style="padding-top:2px;">
190
+ <ul class="mdw-list" mdw-divider>
191
+ <li class="mdw-list__item">
192
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
193
+ <div class="mdw-list__text">Attractions</div>
194
+ </a>
195
+ </li>
196
+ <li class="mdw-list__item">
197
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
198
+ <div class="mdw-list__text">Dining</div>
199
+ </a>
200
+ </li>
201
+ <li class="mdw-list__item">
202
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
203
+ <div class="mdw-list__text">Education</div>
204
+ </a>
205
+ </li>
206
+ <li class="mdw-list__item">
207
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
208
+ <div class="mdw-list__text">Family</div>
209
+ </a>
210
+ </li>
211
+ <li class="mdw-list__item">
212
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
213
+ <div class="mdw-list__text">Health</div>
214
+ </a>
215
+ </li>
216
+ <li class="mdw-list__item">
217
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
218
+ <div class="mdw-list__text">Office</div>
219
+ </a>
220
+ </li>
221
+ <li class="mdw-list__item">
222
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
223
+ <div class="mdw-list__text">Promotions</div>
224
+ </a>
225
+ </li>
226
+ <li class="mdw-list__item">
227
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
228
+ <div class="mdw-list__text">Radio</div>
229
+ </a>
230
+ </li>
231
+ <li class="mdw-list__item">
232
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
233
+ <div class="mdw-list__text">Recipes</div>
234
+ </a>
235
+ </li>
236
+ <li class="mdw-list__item">
237
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
238
+ <div class="mdw-list__text">Sports</div>
239
+ </a>
240
+ </li>
241
+ <li class="mdw-list__item">
242
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
243
+ <div class="mdw-list__text">Travel</div>
244
+ </a>
245
+ </li>
246
+ </ul>
247
+ </div>
248
+ <%~ includeFile('../_partials/_androidnavbar.eta') %>
249
+ </div>
250
+ </div>
251
+ <div class="comparison">
252
+ <div class="render">
253
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'deeppurple 700', dark:true }) %>
254
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'deeppurple 500', dark:true, start: ['menu'], end: ['search', 'more_vert'], body: 'Topics (CSS-Only)' }) %>
255
+ <div class="content" style="padding-top:2px;">
256
+ <ul class="mdw-list">
257
+ <li class="mdw-list__item">
258
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Attractions
259
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">local_activity</div>
260
+ </a>
261
+ </li>
262
+ <li class="mdw-list__item">
263
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Dining
264
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">local_dining</div>
265
+ </a>
266
+ </li>
267
+ <li class="mdw-list__item">
268
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Education
269
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">edit</div>
270
+ </a>
271
+ </li>
272
+ <li class="mdw-list__item">
273
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Family
274
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">people</div>
275
+ </a>
276
+ </li>
277
+ <li class="mdw-list__item">
278
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Health
279
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">healing</div>
280
+ </a>
281
+ </li>
282
+ <li class="mdw-list__item">
283
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Office
284
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">business</div>
285
+ </a>
286
+ </li>
287
+ <li class="mdw-list__item">
288
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Promotions
289
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">local_offer</div>
290
+ </a>
291
+ </li>
292
+ <li class="mdw-list__item">
293
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Radio
294
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">radio</div>
295
+ </a>
296
+ </li>
297
+ <li class="mdw-list__item">
298
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Recipes
299
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">book</div>
300
+ </a>
301
+ </li>
302
+ <li class="mdw-list__item">
303
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Sports
304
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">stars</div>
305
+ </a>
306
+ </li>
307
+ <li class="mdw-list__item">
308
+ <a class="mdw-list__content mdw-overlay mdw-ripple">Travel
309
+ <div class="mdw-list__icon mdw-theme material-icons" mdw-ink="medium">local_airport</div>
310
+ </a>
311
+ </li>
312
+ </ul>
313
+ </div>
314
+ </div>
315
+ </div>
316
+ <div class="comparison">
317
+ <div class="render">
318
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'cyan 700', dark:true }) %>
319
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'cyan 500', dark:true, start: ['menu'], end: ['search'], body: 'Inbox (CSS-Only)' }) %>
320
+ <div class="content">
321
+ <div class="mdw-list__subheader mdw-theme" mdw-ink="medium">Today</div>
322
+ <ul class="mdw-list" mdw-divider>
323
+ <li class="mdw-list__item">
324
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
325
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
326
+ <div class="mdw-list__text">
327
+ <div class="mdw-list__text-line">Brunch this weekend?</div>
328
+ <div class="mdw-list__text-line">Ali Connors<span class="mdw-theme" mdw-ink="medium"> &mdash; I'll be in your neighborhood doing errands this weekend. Do you want to meet?</span></div>
329
+ </div>
330
+ </a>
331
+ </li>
332
+ <li class="mdw-list__item">
333
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
334
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
335
+ <div class="mdw-list__text">
336
+ <div class="mdw-list__text-line">Summer BBQ<span> </span></span><span class="mdw-theme" mdw-ink="medium">4</span></div>
337
+ <div class="mdw-list__text-line">to Alex, Scott, Jennifer<span class="mdw-theme" mdw-ink="medium"> &mdash; Wish I could come. but I'm out of town this weekend.</span></div>
338
+ </div>
339
+ </a>
340
+ </li>
341
+ <li class="mdw-list__item">
342
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
343
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
344
+ <div class="mdw-list__text">
345
+ <div class="mdw-list__text-line">Oui oui</div>
346
+ <div class="mdw-list__text-line">Sandra Adams<span class="mdw-theme" mdw-ink="medium"> &mdash; Do you have Paris recommendations? Have you ever been?</span></div>
347
+ </div>
348
+ </a>
349
+ </li>
350
+ <li class="mdw-list__item">
351
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
352
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
353
+ <div class="mdw-list__text">
354
+ <div class="mdw-list__text-line">Birthday gift</div>
355
+ <div class="mdw-list__text-line">Trevor Hansen<span class="mdw-theme" mdw-ink="medium"> &mdash; Have any ideas about what we should get Heidi for her birthday?</span></div>
356
+ </div>
357
+ </a>
358
+ </li>
359
+ <li class="mdw-list__item">
360
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
361
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
362
+ <div class="mdw-list__text">
363
+ <div class="mdw-list__text-line">Recipe to try</div>
364
+ <div class="mdw-list__text-line">Britta Holt<span class="mdw-theme" mdw-ink="medium"> &mdash; We should eat this: Grated Squash, Corn, and tomatillo Tacos.</span></div>
365
+ </div>
366
+ </a>
367
+ </li>
368
+ <li class="mdw-list__item">
369
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
370
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
371
+ <div class="mdw-list__text">
372
+ <div class="mdw-list__text-line">Giants game</div>
373
+ <div class="mdw-list__text-line">David Park<span class="mdw-theme" mdw-ink="medium"> &mdash; Any interest in seeing</span></div>
374
+ </div>
375
+ </a>
376
+ </li>
377
+ <li class="mdw-list__item">
378
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
379
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
380
+ <div class="mdw-list__text">
381
+ <div class="mdw-list__text-line">Montauk weekend</div>
382
+ <div class="mdw-list__text-line">-----<span class="mdw-theme" mdw-ink="medium"> &mdash; -----</span></div>
383
+ </div>
384
+ </a>
385
+ </li>
386
+ </ul>
387
+ </div>
388
+ <%~ includeFile('../_partials/_androidnavbar.eta') %>
389
+ </div>
390
+ </div>
391
+ <div class="comparison">
392
+ <div class="render">
393
+ <%~ includeFile('../_partials/_androidstatusbar.eta', { surface:'deeppurple 700', dark:true }) %>
394
+ <%~ includeFile('../_partials/_appbar.eta', { surface:'deeppurple 500', dark:true, start: ['menu'], end: ['search'], body: 'Inbox (CSS-Only)' }) %>
395
+ <div class="content">
396
+ <div class="mdw-list__content mdw-list__subheader mdw-theme" mdw-ink="medium">Today</div>
397
+ <ul class="mdw-list" mdw-divider>
398
+ <li class="mdw-list__item">
399
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
400
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
401
+ <div class="mdw-list__text">
402
+ <div class="mdw-list__text-line">Brunch this weekend?</div>
403
+ <div class="mdw-list__text-block">Ali Connors<span class="mdw-theme" mdw-ink="medium"> &mdash; I'll be in your neighborhood doing errands this weekend. Do you want to meet?</span></div>
404
+ </div>
405
+ </a>
406
+ </li>
407
+ <li class="mdw-list__item">
408
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
409
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
410
+ <div class="mdw-list__text">
411
+ <div class="mdw-list__text-line">Summer BBQ<span class="mdw-theme" mdw-ink="medium"> 4</span></div>
412
+ <div class="mdw-list__text-block">to Alex, Scott, Jennifer<span class="mdw-theme" mdw-ink="medium"> &mdash; Wish I could come. but I'm out of town this weekend.</span></div>
413
+ </div>
414
+ </a>
415
+ </li>
416
+ <li class="mdw-list__item">
417
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
418
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
419
+ <div class="mdw-list__text">
420
+ <div class="mdw-list__text-line">Oui oui</div>
421
+ <div class="mdw-list__text-block">Sandra Adams<span class="mdw-theme" mdw-ink="medium"> &mdash; Do you have Paris recommendations? Have you ever been?</span></div>
422
+ </div>
423
+ </a>
424
+ </li>
425
+ <li class="mdw-list__item">
426
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
427
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
428
+ <div class="mdw-list__text">
429
+ <div class="mdw-list__text-line">Birthday gift</div>
430
+ <div class="mdw-list__text-block">Trevor Hansen<span class="mdw-theme" mdw-ink="medium"> &mdash; Have any ideas about what we should get Heidi for her birthday?</span></div>
431
+ </div>
432
+ </a>
433
+ </li>
434
+ <li class="mdw-list__item">
435
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
436
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
437
+ <div class="mdw-list__text">
438
+ <div class="mdw-list__text-line">Recipe to try</div>
439
+ <div class="mdw-list__text-block">Britta Holt<span class="mdw-theme" mdw-ink="medium"> &mdash; We should eat this: Grated Squash, Corn, and tomatillo Tacos.</span></div>
440
+ </div>
441
+ </a>
442
+ </li>
443
+ <li class="mdw-list__item">
444
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
445
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
446
+ <div class="mdw-list__text">
447
+ <div class="mdw-list__text-line">Giants game</div>
448
+ <div class="mdw-list__text-block">David Park<span class="mdw-theme" mdw-ink="medium"> &mdash; Any interest in seeing</span></div>
449
+ </div>
450
+ </a>
451
+ </li>
452
+ <li class="mdw-list__item">
453
+ <a class="mdw-list__content mdw-overlay mdw-ripple">
454
+ <div class="mdw-list__avatar material-icons" style="font-size:40px;">&#xE853;</div>
455
+ <div class="mdw-list__text">
456
+ <div class="mdw-list__text-line">Montauk weekend</div>
457
+ <div class="mdw-list__text-block">-----<span class="mdw-theme" mdw-ink="medium"> &mdash; -----</span></div>
458
+ </div>
459
+ </a>
460
+ </li>
461
+ </ul>
462
+ </div>
463
+ </div>
464
+ </div>
465
+ <script src="list.min.js"></script>
@@ -1,5 +1,5 @@
1
- import * as List from '../../components/list/index';
2
- import { iterateArrayLike } from '../../core/dom';
1
+ import * as List from '../../components/list/index.js';
2
+ import { iterateArrayLike } from '../../core/dom.js';
3
3
 
4
4
  /** @return {void} */
5
5
  function initializeMdwComponents() {
@@ -9,11 +9,11 @@ include ../_mixins.pug
9
9
  ul.mdw-list
10
10
  li.mdw-list__item
11
11
  a.mdw-list__content Attractions
12
- li.mdw-list__expander.mdw-theme(mdw-ink="teal")
13
- span.mdw-list__expander-content
12
+ li.mdw-list__item(aria-expanded="true")
13
+ a.mdw-list__content
14
14
  .mdw-list__text Dining
15
15
  .mdw-list__secondary.mdw-theme.material-icons(mdw-ink="medium") expand_more
16
- ul.mdw-list__item-group(role="group")
16
+ ul.mdw-list
17
17
  li.mdw-list__item
18
18
  a.mdw-list__content Breakfast &amp; brunch
19
19
  li.mdw-list__item
@@ -39,12 +39,11 @@ include ../_mixins.pug
39
39
  li.mdw-list__item
40
40
  a.mdw-list__content Travel
41
41
  +androidnavbar
42
- +target('https://storage.googleapis.com/material-design/publish/material_v_12/assets/0Bzhp5Z4wHba3bl8zNGVqM19TNWM/components-listcontrols-expand2.png')
43
42
 
44
43
  .comparison.js
45
44
  .render
46
- +androidstatusbar('pink 700', 'dark')
47
- +appbar('pink 500', 'dark', ['menu'], ['search', 'check_circle']) Inbox
45
+ +androidstatusbar('secondary 700', 'dark')
46
+ +appbar('secondary 500', 'dark', ['menu'], ['search', 'check_circle']) Inbox
48
47
  .content
49
48
  ul.mdw-list(mdw-divider)
50
49
  li.mdw-list__item
@@ -97,7 +96,6 @@ include ../_mixins.pug
97
96
  .mdw-list__text-line -----
98
97
  .mdw-list__text-line.mdw-theme(mdw-ink="medium") -----
99
98
  +androidnavbar
100
- +target('https://storage.googleapis.com/material-design/publish/material_v_12/assets/0B6Okdz75tqQsdFNSZ1kzeXBfR1U/components-lists-keylines-three11.png')
101
99
  .comparison
102
100
  .render
103
101
  +androidstatusbar('deeppurple 700', 'dark')
@@ -126,7 +124,6 @@ include ../_mixins.pug
126
124
  a.mdw-list__content.mdw-overlay.mdw-ripple Sports
127
125
  li.mdw-list__item
128
126
  a.mdw-list__content.mdw-overlay.mdw-ripple Travel
129
- +target('https://storage.googleapis.com/spec-host-backup/mio-design%2Fassets%2F0B54x0KDcs5U-UHcxOFd6NnQxeFE%2Fsingle-line-example-1.png')
130
127
 
131
128
  .comparison
132
129
  .render
@@ -168,7 +165,6 @@ include ../_mixins.pug
168
165
  a.mdw-list__content.mdw-overlay.mdw-ripple
169
166
  .mdw-list__text Travel
170
167
  +androidnavbar
171
- +target('https://storage.googleapis.com/material-design/publish/material_v_12/assets/0Bzhp5Z4wHba3V2tZaHMwSXZuS2s/components-lists-keylines-single3.png')
172
168
 
173
169
 
174
170
  .comparison
@@ -210,15 +206,14 @@ include ../_mixins.pug
210
206
  li.mdw-list__item
211
207
  a.mdw-list__content.mdw-overlay.mdw-ripple Travel
212
208
  .mdw-list__icon.mdw-theme.material-icons(mdw-ink="medium") local_airport
213
- +target('https://storage.googleapis.com/spec-host-backup/mio-design%2Fassets%2F0B54x0KDcs5U-a1hzNEpSb1N0RTA%2Fsingle-line-example-2.png')
214
209
 
215
210
  .comparison
216
211
  .render
217
212
  +androidstatusbar('cyan 700', 'dark')
218
213
  +appbar('cyan 500', 'dark', ['menu'], ['search']) Inbox (CSS-Only)
219
214
  .content
215
+ .mdw-list__subheader.mdw-theme(mdw-ink="medium") Today
220
216
  ul.mdw-list(mdw-divider)
221
- li.mdw-list__subheader.mdw-theme(mdw-ink="medium") Today
222
217
  li.mdw-list__item
223
218
  a.mdw-list__content.mdw-overlay.mdw-ripple
224
219
  .mdw-list__avatar.material-icons(style="font-size:40px") &#xE853;
@@ -270,15 +265,14 @@ include ../_mixins.pug
270
265
  .mdw-list__text-line -----
271
266
  span.mdw-theme(mdw-ink="medium") &mdash; -----
272
267
  +androidnavbar
273
- +target('https://storage.googleapis.com/material-design/publish/material_v_12/assets/0B6Okdz75tqQsWGQ4OWVWREpLNkU/components-lists-keylines-two8.png')
274
268
 
275
269
  .comparison
276
270
  .render
277
271
  +androidstatusbar('deeppurple 700', 'dark')
278
272
  +appbar('deeppurple 500', 'dark', ['menu'], ['search']) Inbox (CSS-Only)
279
273
  .content
274
+ .mdw-list__content.mdw-list__subheader.mdw-theme(mdw-ink="medium") Today
280
275
  ul.mdw-list(mdw-divider)
281
- li.mdw-list__subheader.mdw-theme(mdw-ink="medium") Today
282
276
  li.mdw-list__item
283
277
  a.mdw-list__content.mdw-overlay.mdw-ripple
284
278
  .mdw-list__avatar.material-icons(style="font-size:40px") &#xE853;
@@ -329,5 +323,4 @@ include ../_mixins.pug
329
323
  .mdw-list__text-line Montauk weekend
330
324
  .mdw-list__text-block -----
331
325
  span.mdw-theme(mdw-ink="medium") &mdash; -----
332
- +target('https://storage.googleapis.com/spec-host-backup/mio-design%2Fassets%2F0B54x0KDcs5U-YkJoa3JqZmZvR3c%2Fthreeline-sample-1.png')
333
326
  script(src='list.min.js')