@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.
- package/.eslintrc.json +136 -30
- package/.stylelintrc.json +6 -40
- package/.vscode/launch.json +20 -5
- package/CHANGELOG.md +24 -0
- package/README.md +12 -9
- package/adapters/datatable/column.js +82 -74
- package/adapters/datatable/index.js +173 -131
- package/adapters/dom/index.js +529 -75
- package/adapters/list/index.js +25 -12
- package/adapters/search/index.js +13 -13
- package/components/appbar/_spec.scss +87 -64
- package/components/appbar/index.scss +2 -2
- package/components/banner/_spec.scss +8 -8
- package/components/banner/index.scss +2 -2
- package/components/bottomnav/_spec.scss +22 -17
- package/components/bottomnav/index.js +61 -52
- package/components/bottomnav/index.scss +2 -2
- package/components/bottomnav/item.js +44 -25
- package/components/button/README.md +14 -14
- package/components/button/_spec.scss +23 -22
- package/components/button/_theme.scss +37 -21
- package/components/button/index.eta +32 -0
- package/components/button/index.js +12 -12
- package/components/button/index.scss +2 -2
- package/components/card/_spec.scss +40 -36
- package/components/card/index.scss +2 -2
- package/components/chip/_spec.scss +7 -8
- package/components/chip/_theme.scss +31 -31
- package/components/chip/index.js +3 -2
- package/components/chip/index.scss +2 -2
- package/components/chip/item.js +1 -16
- package/components/datatable/_spec.scss +71 -85
- package/components/datatable/_theme.scss +61 -156
- package/components/datatable/cell.js +45 -0
- package/components/datatable/columnheader.js +47 -0
- package/components/datatable/index.js +279 -366
- package/components/datatable/index.scss +2 -2
- package/components/datatable/row.js +49 -0
- package/components/datatable/rowheader.js +18 -0
- package/components/dialog/_spec.scss +61 -41
- package/components/dialog/index.js +325 -297
- package/components/dialog/index.scss +2 -2
- package/components/divider/_spec.scss +8 -6
- package/components/divider/index.scss +2 -2
- package/components/elevation/_spec.scss +2 -2
- package/components/elevation/index.scss +2 -2
- package/components/fab/_spec.scss +23 -24
- package/components/fab/index.js +50 -50
- package/components/fab/index.scss +2 -2
- package/components/grid/_spec.scss +33 -31
- package/components/grid/index.scss +2 -2
- package/components/layout/_mixins.scss +5 -5
- package/components/layout/_spec.scss +206 -176
- package/components/layout/_theme.scss +14 -16
- package/components/layout/index.js +181 -153
- package/components/layout/index.scss +2 -2
- package/components/list/_spec.scss +117 -104
- package/components/list/_theme.scss +31 -34
- package/components/list/content.js +68 -52
- package/components/list/index.js +194 -61
- package/components/list/index.scss +2 -2
- package/components/list/item.js +136 -12
- package/components/list/secondary.js +46 -0
- package/components/menu/_spec.scss +32 -19
- package/components/menu/index.js +242 -229
- package/components/menu/index.scss +2 -2
- package/components/menu/item.js +95 -110
- package/components/progress/_spec.scss +35 -27
- package/components/progress/index.js +21 -0
- package/components/progress/index.scss +2 -1
- package/components/selection/_spec.scss +242 -224
- package/components/selection/_theme.scss +100 -95
- package/components/selection/index.eta +60 -0
- package/components/selection/index.js +76 -0
- package/components/selection/index.pug +15 -8
- package/components/selection/index.scss +2 -2
- package/components/selection/input.js +56 -0
- package/components/selection/radiogroup.js +47 -0
- package/components/slider/_spec.scss +10 -8
- package/components/slider/index.scss +2 -2
- package/components/snackbar/_spec.scss +22 -21
- package/components/snackbar/index.js +102 -111
- package/components/snackbar/index.scss +2 -2
- package/components/tab/_spec.scss +20 -19
- package/components/tab/content.js +41 -40
- package/components/tab/index.js +192 -99
- package/components/tab/index.scss +2 -2
- package/components/tab/item.js +38 -55
- package/components/tab/list.js +96 -72
- package/components/tab/panel.js +12 -13
- package/components/template/_theme.scss +11 -11
- package/components/textfield/_mixins.scss +52 -0
- package/components/textfield/_spec.scss +215 -266
- package/components/textfield/_theme.scss +95 -72
- package/components/textfield/index.eta +74 -0
- package/components/textfield/index.js +63 -57
- package/components/textfield/index.scss +2 -2
- package/components/tooltip/_spec.scss +27 -25
- package/components/tooltip/index.scss +2 -2
- package/components/type/_spec.scss +51 -38
- package/components/type/index.scss +2 -2
- package/core/_breakpoint.scss +75 -91
- package/core/_elevation.scss +10 -10
- package/core/_length.scss +9 -0
- package/core/_motion.scss +14 -14
- package/core/_platform.scss +9 -15
- package/core/_type.scss +33 -32
- package/core/aria/attributes.js +125 -25
- package/core/aria/button.js +23 -23
- package/core/aria/keyboard.js +93 -0
- package/core/aria/rovingtabindex.js +69 -154
- package/core/aria/tab.js +31 -28
- package/core/color/_theme.scss +240 -280
- package/core/color/index.scss +2 -2
- package/core/document/index.js +39 -0
- package/core/dom.js +12 -12
- package/core/overlay/_spec.scss +0 -3
- package/core/overlay/_theme.scss +56 -74
- package/core/overlay/index.js +49 -18
- package/core/overlay/index.scss +2 -2
- package/core/ripple/_spec.scss +22 -39
- package/core/ripple/_theme.scss +13 -13
- package/core/ripple/index.js +137 -134
- package/core/ripple/index.scss +2 -2
- package/core/theme/_config.scss +2 -0
- package/core/theme/_mixins.scss +172 -0
- package/core/theme/_palettes.scss +155 -135
- package/core/theme/_variables.scss +24 -15
- package/core/theme/index.js +50 -0
- package/core/throttler.js +1 -1
- package/core/transition/index.js +36 -20
- package/{docs-src → docs}/_flex.scss +0 -0
- package/{docs-src → docs}/_menuoptions.js +21 -34
- package/{docs-src → docs}/_mixins.pug +39 -26
- package/docs/_partials/_androidnavbar.eta +5 -0
- package/docs/_partials/_androidstatusbar.eta +13 -0
- package/docs/_partials/_appbar.eta +29 -0
- package/docs/_partials/_buttontest.eta +31 -0
- package/docs/_partials/_header.eta +149 -0
- package/docs/_partials/_navlistitem.eta +16 -0
- package/docs/_partials/_target.eta +1 -0
- package/{docs-src → docs}/_sample-utils.js +8 -6
- package/{docs-src → docs}/_storage.js +0 -0
- package/{docs-src → docs}/docs.scss +5 -2
- package/docs/index.eta +16 -0
- package/{docs-src → docs}/index.js +0 -0
- package/docs/pages/appbar.eta +114 -0
- package/{docs-src/components → docs/pages}/appbar.js +0 -0
- package/{docs-src/components → docs/pages}/appbar.pug +15 -18
- package/docs/pages/bottomnav.eta +188 -0
- package/{docs-src/components → docs/pages}/bottomnav.js +23 -24
- package/{docs-src/components → docs/pages}/bottomnav.pug +4 -4
- package/docs/pages/button.eta +124 -0
- package/{docs-src/components → docs/pages}/button.js +19 -19
- package/{docs-src/components → docs/pages}/button.pug +15 -15
- package/docs/pages/card.eta +90 -0
- package/{docs-src/components → docs/pages}/card.js +3 -3
- package/{docs-src/components → docs/pages}/card.pug +7 -7
- package/docs/pages/chip.eta +122 -0
- package/{docs-src/components → docs/pages}/chip.js +3 -6
- package/{docs-src/components → docs/pages}/chip.pug +2 -2
- package/docs/pages/color.eta +143 -0
- package/{docs-src/core → docs/pages}/color.js +95 -20
- package/docs/pages/color.pug +121 -0
- package/docs/pages/datatable.eta +323 -0
- package/{docs-src/components → docs/pages}/datatable.js +26 -13
- package/docs/pages/datatable.pug +283 -0
- package/docs/pages/dialog.eta +186 -0
- package/{docs-src/components → docs/pages}/dialog.js +26 -13
- package/{docs-src/components → docs/pages}/dialog.pug +46 -28
- package/docs/pages/dom.eta +26 -0
- package/docs/pages/dom.js +143 -0
- package/docs/pages/dom.pug +22 -0
- package/docs/pages/elevation.eta +35 -0
- package/{docs-src/components → docs/pages}/elevation.js +0 -0
- package/{docs-src/components → docs/pages}/elevation.pug +0 -0
- package/docs/pages/fab.eta +99 -0
- package/{docs-src/components → docs/pages}/fab.js +3 -3
- package/{docs-src/components → docs/pages}/fab.pug +2 -2
- package/docs/pages/grid.eta +135 -0
- package/{docs-src/components → docs/pages}/grid.js +1 -1
- package/{docs-src/components → docs/pages}/grid.pug +3 -3
- package/docs/pages/layout.eta +8 -0
- package/{docs-src/components → docs/pages}/layout.js +0 -0
- package/{docs-src/components → docs/pages}/layout.pug +0 -0
- package/docs/pages/list.eta +465 -0
- package/{docs-src/components → docs/pages}/list.js +2 -2
- package/{docs-src/components → docs/pages}/list.pug +7 -14
- package/docs/pages/menu.eta +276 -0
- package/{docs-src/components → docs/pages}/menu.js +14 -10
- package/{docs-src/components → docs/pages}/menu.pug +0 -0
- package/docs/pages/overlay.eta +69 -0
- package/docs/pages/overlay.js +4 -0
- package/{docs-src/core → docs/pages}/overlay.pug +14 -11
- package/docs/pages/progress.eta +23 -0
- package/{docs-src/components → docs/pages}/progress.js +1 -1
- package/{docs-src/components → docs/pages}/progress.pug +1 -1
- package/docs/pages/ripple.eta +27 -0
- package/docs/pages/ripple.js +4 -0
- package/{docs-src/core → docs/pages}/ripple.pug +4 -4
- package/docs/pages/search.eta +246 -0
- package/{docs-src/components → docs/pages}/search.js +59 -42
- package/{docs-src/components → docs/pages}/search.pug +50 -51
- package/docs/pages/selection.eta +111 -0
- package/docs/pages/selection.js +13 -0
- package/docs/pages/selection.pug +74 -0
- package/docs/pages/slider.eta +23 -0
- package/{docs-src/components → docs/pages}/slider.js +0 -0
- package/{docs-src/components → docs/pages}/slider.pug +0 -0
- package/docs/pages/snackbar.eta +83 -0
- package/{docs-src/components → docs/pages}/snackbar.js +3 -3
- package/{docs-src/components → docs/pages}/snackbar.pug +0 -0
- package/docs/pages/tab.eta +421 -0
- package/{docs-src/components → docs/pages}/tab.js +18 -35
- package/{docs-src/components → docs/pages}/tab.pug +4 -4
- package/docs/pages/textfield.eta +486 -0
- package/{docs-src/components → docs/pages}/textfield.js +3 -4
- package/{docs-src/components → docs/pages}/textfield.pug +87 -35
- package/docs/pages/tooltip.eta +94 -0
- package/{docs-src/components → docs/pages}/tooltip.js +0 -0
- package/{docs-src/components → docs/pages}/tooltip.pug +0 -1
- package/docs/pages/transition.eta +117 -0
- package/{docs-src/core → docs/pages}/transition.js +7 -8
- package/{docs-src/core → docs/pages}/transition.pug +0 -0
- package/docs/pages/type.eta +31 -0
- package/{docs-src/components → docs/pages}/type.js +0 -0
- package/{docs-src/components → docs/pages}/type.pug +0 -1
- package/docs/postrender.js +39 -0
- package/{docs-src → docs}/prerender.js +3 -9
- package/docs/pwa/_dialogs.eta +143 -0
- package/docs/pwa/_dialogs.pug +96 -0
- package/docs/pwa/_menus.eta +16 -0
- package/{docs-src → docs}/pwa/_menus.pug +0 -0
- package/docs/pwa/pwa-prerender.js +3 -0
- package/docs/pwa/pwa.eta +480 -0
- package/docs/pwa/pwa.js +306 -0
- package/{docs-src → docs}/pwa/pwa.pug +166 -263
- package/docs/pwa/pwa.scss +26 -0
- package/docs/spec.scss +26 -0
- package/docs/themes/_component-themes.scss +26 -0
- package/docs/themes/theme-colored-fallbacks.scss +17 -0
- package/docs/themes/theme-colored.scss +17 -0
- package/docs/themes/theme-default-fallbacks.scss +17 -0
- package/docs/themes/theme-default.scss +17 -0
- package/jsconfig.json +4 -2
- package/package.json +40 -27
- package/scripts/deploy-docs.sh +9 -0
- package/templates/index.eta +2 -0
- package/utils/function.js +3 -0
- package/webpack.config.cjs +257 -0
- package/_spec.scss +0 -27
- package/_theme.scss +0 -27
- package/components/list/expander.js +0 -142
- package/components/list/itemgroup.js +0 -22
- package/core/theme/_builder.scss +0 -116
- package/core/theme/index.scss +0 -68
- package/docs/appbar.html +0 -1
- package/docs/appbar.min.js +0 -2
- package/docs/appbar.min.js.map +0 -1
- package/docs/bottomnav.html +0 -1
- package/docs/bottomnav.min.js +0 -2
- package/docs/bottomnav.min.js.map +0 -1
- package/docs/button.html +0 -1
- package/docs/button.min.js +0 -2
- package/docs/button.min.js.map +0 -1
- package/docs/card.html +0 -1
- package/docs/card.min.js +0 -2
- package/docs/card.min.js.map +0 -1
- package/docs/chip.html +0 -1
- package/docs/chip.min.js +0 -2
- package/docs/chip.min.js.map +0 -1
- package/docs/color.html +0 -1
- package/docs/color.min.js +0 -2
- package/docs/color.min.js.map +0 -1
- package/docs/datatable.html +0 -1
- package/docs/datatable.min.js +0 -2
- package/docs/datatable.min.js.map +0 -1
- package/docs/default.common.min.js +0 -2
- package/docs/default.common.min.js.map +0 -1
- package/docs/dialog.html +0 -1
- package/docs/dialog.min.js +0 -2
- package/docs/dialog.min.js.map +0 -1
- package/docs/docs.min.css +0 -1
- package/docs/docs.min.js +0 -2
- package/docs/docs.min.js.map +0 -1
- package/docs/elevation.html +0 -1
- package/docs/elevation.min.js +0 -2
- package/docs/elevation.min.js.map +0 -1
- package/docs/fab.html +0 -1
- package/docs/fab.min.js +0 -2
- package/docs/fab.min.js.map +0 -1
- package/docs/grid.html +0 -1
- package/docs/grid.min.js +0 -2
- package/docs/grid.min.js.map +0 -1
- package/docs/index.html +0 -1
- package/docs/index.min.js +0 -2
- package/docs/index.min.js.map +0 -1
- package/docs/ink.html +0 -1
- package/docs/ink.min.js +0 -2
- package/docs/ink.min.js.map +0 -1
- package/docs/layout.html +0 -1
- package/docs/layout.min.js +0 -2
- package/docs/layout.min.js.map +0 -1
- package/docs/list.html +0 -1
- package/docs/list.min.js +0 -2
- package/docs/list.min.js.map +0 -1
- package/docs/menu.html +0 -1
- package/docs/menu.min.js +0 -2
- package/docs/menu.min.js.map +0 -1
- package/docs/overlay.html +0 -1
- package/docs/overlay.min.js +0 -2
- package/docs/overlay.min.js.map +0 -1
- package/docs/prerender.common.min.js +0 -2
- package/docs/prerender.common.min.js.map +0 -1
- package/docs/prerender.min.js +0 -2
- package/docs/prerender.min.js.map +0 -1
- package/docs/progress.html +0 -1
- package/docs/progress.min.js +0 -2
- package/docs/progress.min.js.map +0 -1
- package/docs/pwa-prerender.min.js +0 -2
- package/docs/pwa-prerender.min.js.map +0 -1
- package/docs/pwa.html +0 -11
- package/docs/pwa.min.css +0 -1
- package/docs/pwa.min.js +0 -2
- package/docs/pwa.min.js.map +0 -1
- package/docs/ripple.html +0 -1
- package/docs/ripple.min.js +0 -2
- package/docs/ripple.min.js.map +0 -1
- package/docs/search.html +0 -1
- package/docs/search.min.js +0 -2
- package/docs/search.min.js.map +0 -1
- package/docs/selection.html +0 -1
- package/docs/selection.min.js +0 -2
- package/docs/selection.min.js.map +0 -1
- package/docs/slider.html +0 -1
- package/docs/slider.min.js +0 -2
- package/docs/slider.min.js.map +0 -1
- package/docs/snackbar.html +0 -1
- package/docs/snackbar.min.js +0 -2
- package/docs/snackbar.min.js.map +0 -1
- package/docs/spec.min.css +0 -1
- package/docs/spec.min.js +0 -2
- package/docs/spec.min.js.map +0 -1
- package/docs/surface.html +0 -1
- package/docs/surface.min.js +0 -2
- package/docs/surface.min.js.map +0 -1
- package/docs/tab.html +0 -1
- package/docs/tab.min.js +0 -2
- package/docs/tab.min.js.map +0 -1
- package/docs/textfield.html +0 -2
- package/docs/textfield.min.js +0 -2
- package/docs/textfield.min.js.map +0 -1
- package/docs/theme-colored-fallbacks.min.css +0 -1
- package/docs/theme-colored-fallbacks.min.js +0 -2
- package/docs/theme-colored-fallbacks.min.js.map +0 -1
- package/docs/theme-colored.min.css +0 -1
- package/docs/theme-colored.min.js +0 -2
- package/docs/theme-colored.min.js.map +0 -1
- package/docs/theme-default-fallbacks.min.css +0 -1
- package/docs/theme-default-fallbacks.min.js +0 -2
- package/docs/theme-default-fallbacks.min.js.map +0 -1
- package/docs/theme-default.min.css +0 -1
- package/docs/theme-default.min.js +0 -2
- package/docs/theme-default.min.js.map +0 -1
- package/docs/themes-fallbacks.min.css +0 -1
- package/docs/themes-fallbacks.min.js +0 -2
- package/docs/themes-fallbacks.min.js.map +0 -1
- package/docs/themes.min.css +0 -1
- package/docs/themes.min.js +0 -2
- package/docs/themes.min.js.map +0 -1
- package/docs/tooltip.html +0 -1
- package/docs/tooltip.min.js +0 -2
- package/docs/tooltip.min.js.map +0 -1
- package/docs/transition.html +0 -1
- package/docs/transition.min.js +0 -2
- package/docs/transition.min.js.map +0 -1
- package/docs/type.html +0 -1
- package/docs/type.min.js +0 -2
- package/docs/type.min.js.map +0 -1
- package/docs-src/components/datatable.pug +0 -327
- package/docs-src/components/selection.js +0 -9
- package/docs-src/components/selection.pug +0 -77
- package/docs-src/core/color.pug +0 -201
- package/docs-src/core/overlay.js +0 -4
- package/docs-src/core/ripple.js +0 -4
- package/docs-src/index.pug +0 -9
- package/docs-src/pwa/_dialogs.pug +0 -15
- package/docs-src/pwa/pwa-prerender.js +0 -3
- package/docs-src/pwa/pwa.js +0 -182
- package/docs-src/pwa/pwa.scss +0 -25
- package/docs-src/spec.scss +0 -1
- package/docs-src/themes/theme-colored-fallbacks.scss +0 -14
- package/docs-src/themes/theme-colored.scss +0 -14
- package/docs-src/themes/theme-default-fallbacks.scss +0 -14
- package/docs-src/themes/theme-default.scss +0 -14
- package/index.js +0 -51
- package/index.scss +0 -2
- 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")
|
|
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})
|
|
23
|
-
+mdwSelection({ink:'secondary', name:'style', type:'radio', value:'grid'})
|
|
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 & 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;"></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;"></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;"></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;"></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;"></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;"></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;"></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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — -----</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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — 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;"></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"> — -----</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-
|
|
13
|
-
|
|
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-
|
|
16
|
+
ul.mdw-list
|
|
17
17
|
li.mdw-list__item
|
|
18
18
|
a.mdw-list__content Breakfast & 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('
|
|
47
|
-
+appbar('
|
|
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") 
|
|
@@ -270,15 +265,14 @@ include ../_mixins.pug
|
|
|
270
265
|
.mdw-list__text-line -----
|
|
271
266
|
span.mdw-theme(mdw-ink="medium") — -----
|
|
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") 
|
|
@@ -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") — -----
|
|
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')
|