@shortfuse/materialdesignweb 0.4.0 → 0.5.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 (184) hide show
  1. package/.browserslistrc +2 -1
  2. package/.eslintrc.json +59 -8
  3. package/.stylelintrc.json +94 -49
  4. package/CHANGELOG.md +12 -0
  5. package/README.md +1 -3
  6. package/adapters/datatable/column.js +27 -54
  7. package/adapters/datatable/index.js +69 -81
  8. package/adapters/dom/index.js +32 -47
  9. package/adapters/search/index.js +107 -133
  10. package/components/appbar/_spec.scss +77 -137
  11. package/components/banner/_spec.scss +28 -63
  12. package/components/bottomnav/_spec.scss +46 -54
  13. package/components/bottomnav/index.js +15 -20
  14. package/components/bottomnav/item.js +4 -5
  15. package/components/button/README.md +1 -1
  16. package/components/button/_spec.scss +43 -42
  17. package/components/button/_theme.scss +27 -50
  18. package/components/card/_spec.scss +61 -69
  19. package/components/chip/_spec.scss +21 -44
  20. package/components/chip/_theme.scss +79 -151
  21. package/components/chip/index.js +6 -4
  22. package/components/datatable/_spec.scss +36 -99
  23. package/components/datatable/_theme.scss +98 -124
  24. package/components/datatable/cell.js +1 -2
  25. package/components/datatable/columnheader.js +1 -2
  26. package/components/datatable/index.js +33 -47
  27. package/components/datatable/row.js +4 -5
  28. package/components/dialog/_spec.scss +53 -63
  29. package/components/dialog/_theme.scss +7 -0
  30. package/components/dialog/index.js +62 -88
  31. package/components/divider/_spec.scss +6 -8
  32. package/components/elevation/_spec.scss +1 -1
  33. package/components/fab/_spec.scss +30 -42
  34. package/components/fab/index.js +4 -8
  35. package/components/grid/_spec.scss +68 -211
  36. package/components/layout/_mixins.scss +0 -22
  37. package/components/layout/_spec.scss +267 -363
  38. package/components/layout/_theme.scss +10 -35
  39. package/components/layout/index.js +40 -50
  40. package/components/list/_spec.scss +57 -91
  41. package/components/list/_theme.scss +75 -84
  42. package/components/list/content.js +9 -13
  43. package/components/list/index.js +34 -38
  44. package/components/list/item.js +8 -11
  45. package/components/list/secondary.js +8 -9
  46. package/components/menu/_spec.scss +134 -167
  47. package/components/menu/index.js +45 -61
  48. package/components/menu/item.js +11 -19
  49. package/components/progress/_spec.scss +43 -34
  50. package/components/selection/_spec.scss +123 -133
  51. package/components/selection/_theme.scss +88 -120
  52. package/components/selection/index.js +9 -15
  53. package/components/selection/input.js +3 -5
  54. package/components/selection/radiogroup.js +8 -15
  55. package/components/slider/_spec.scss +23 -28
  56. package/components/snackbar/_spec.scss +17 -62
  57. package/components/snackbar/index.js +15 -21
  58. package/components/tab/_spec.scss +35 -50
  59. package/components/tab/content.js +33 -28
  60. package/components/tab/index.js +30 -33
  61. package/components/tab/item.js +4 -5
  62. package/components/tab/list.js +22 -36
  63. package/components/textfield/README.md +2 -2
  64. package/components/textfield/_spec.scss +241 -287
  65. package/components/textfield/_theme.scss +197 -232
  66. package/components/textfield/index.js +8 -16
  67. package/components/tooltip/_spec.scss +23 -26
  68. package/components/type/_spec.scss +19 -16
  69. package/core/_breakpoint.scss +33 -33
  70. package/core/_elevation.scss +40 -0
  71. package/core/_length.scss +0 -1
  72. package/core/_platform.scss +0 -22
  73. package/core/_type.scss +7 -6
  74. package/core/aria/button.js +4 -5
  75. package/core/aria/keyboard.js +1 -2
  76. package/core/aria/rovingtabindex.js +14 -17
  77. package/core/aria/tab.js +1 -2
  78. package/core/dom.js +18 -109
  79. package/core/overlay/_spec.scss +5 -8
  80. package/core/overlay/_theme.scss +126 -150
  81. package/core/overlay/index.js +19 -32
  82. package/core/ripple/_spec.scss +16 -17
  83. package/core/ripple/_theme.scss +13 -33
  84. package/core/ripple/index.js +36 -44
  85. package/core/theme/_aliases.scss +15 -0
  86. package/core/theme/_config.scss +8 -2
  87. package/core/theme/_functions.scss +22 -0
  88. package/core/theme/_palettes.scss +0 -1
  89. package/core/{color → theme}/_spec.scss +0 -0
  90. package/core/theme/_theme.scss +268 -0
  91. package/core/theme/index.scss +4 -0
  92. package/core/transition/index.js +73 -76
  93. package/docs/_flex.scss +7 -1
  94. package/docs/_menuoptions.js +2 -2
  95. package/docs/_partials/_appbar.eta +12 -14
  96. package/docs/_partials/_header.eta +41 -44
  97. package/docs/_sample-utils.js +15 -20
  98. package/docs/docs.scss +123 -87
  99. package/docs/framework.scss +26 -0
  100. package/docs/index.eta +2 -6
  101. package/docs/index.js +7 -0
  102. package/docs/pages/appbar.eta +22 -28
  103. package/docs/pages/bottomnav.js +17 -14
  104. package/docs/pages/button.js +10 -10
  105. package/docs/pages/card.js +20 -22
  106. package/docs/pages/chip.js +11 -13
  107. package/docs/pages/color.js +35 -36
  108. package/docs/pages/datatable.js +11 -15
  109. package/docs/pages/dialog.eta +9 -11
  110. package/docs/pages/dialog.js +6 -9
  111. package/docs/pages/dom.js +6 -9
  112. package/docs/pages/elevation.eta +10 -10
  113. package/docs/pages/fab.js +2 -3
  114. package/docs/pages/grid.js +5 -5
  115. package/docs/pages/list.js +1 -2
  116. package/docs/pages/menu.eta +17 -19
  117. package/docs/pages/menu.js +7 -11
  118. package/docs/pages/overlay.js +1 -2
  119. package/docs/pages/progress.eta +2 -2
  120. package/docs/pages/progress.js +1 -1
  121. package/docs/pages/ripple.js +1 -2
  122. package/docs/pages/search.eta +20 -24
  123. package/docs/pages/search.js +24 -41
  124. package/docs/pages/selection.eta +2 -6
  125. package/docs/pages/selection.js +3 -4
  126. package/docs/pages/snackbar.js +3 -4
  127. package/docs/pages/tab.eta +61 -75
  128. package/docs/pages/tab.js +16 -15
  129. package/docs/pages/textfield.eta +9 -8
  130. package/docs/pages/textfield.js +26 -23
  131. package/docs/pages/tooltip.eta +10 -12
  132. package/docs/pages/transition.js +5 -7
  133. package/docs/postrender.js +7 -5
  134. package/docs/pwa/pwa.eta +14 -16
  135. package/docs/pwa/pwa.js +19 -27
  136. package/docs/pwa/pwa.scss +12 -7
  137. package/docs/themes/theme-colored.scss +9 -11
  138. package/docs/themes/theme-default.scss +0 -14
  139. package/index.scss +27 -0
  140. package/jsconfig.json +7 -3
  141. package/package.json +26 -15
  142. package/tsconfig.json +16 -0
  143. package/{webpack.config.cjs → webpack.config.js} +105 -58
  144. package/components/template/_theme.scss +0 -27
  145. package/components/textfield/_mixins.scss +0 -52
  146. package/core/color/_theme.scss +0 -390
  147. package/core/color/index.scss +0 -2
  148. package/core/theme/_mixins.scss +0 -172
  149. package/core/theme/_variables.scss +0 -24
  150. package/docs/_mixins.pug +0 -155
  151. package/docs/pages/appbar.pug +0 -78
  152. package/docs/pages/bottomnav.pug +0 -137
  153. package/docs/pages/button.pug +0 -121
  154. package/docs/pages/card.pug +0 -74
  155. package/docs/pages/chip.pug +0 -91
  156. package/docs/pages/color.pug +0 -121
  157. package/docs/pages/datatable.pug +0 -283
  158. package/docs/pages/dialog.pug +0 -132
  159. package/docs/pages/dom.pug +0 -22
  160. package/docs/pages/elevation.pug +0 -25
  161. package/docs/pages/fab.pug +0 -66
  162. package/docs/pages/grid.pug +0 -95
  163. package/docs/pages/layout.pug +0 -7
  164. package/docs/pages/list.pug +0 -326
  165. package/docs/pages/menu.pug +0 -205
  166. package/docs/pages/overlay.pug +0 -55
  167. package/docs/pages/progress.pug +0 -16
  168. package/docs/pages/ripple.pug +0 -21
  169. package/docs/pages/search.pug +0 -165
  170. package/docs/pages/selection.pug +0 -74
  171. package/docs/pages/slider.pug +0 -17
  172. package/docs/pages/snackbar.pug +0 -60
  173. package/docs/pages/tab.pug +0 -304
  174. package/docs/pages/textfield.pug +0 -360
  175. package/docs/pages/tooltip.pug +0 -78
  176. package/docs/pages/transition.pug +0 -76
  177. package/docs/pages/type.pug +0 -29
  178. package/docs/pwa/_dialogs.pug +0 -96
  179. package/docs/pwa/_menus.pug +0 -11
  180. package/docs/pwa/pwa.pug +0 -325
  181. package/docs/spec.scss +0 -26
  182. package/docs/themes/_component-themes.scss +0 -26
  183. package/docs/themes/theme-colored-fallbacks.scss +0 -17
  184. package/docs/themes/theme-default-fallbacks.scss +0 -17
package/docs/pages/tab.pug DELETED
@@ -1,304 +0,0 @@
1
- include ../_mixins.pug
2
-
3
- +header("tab")
4
- .mdw-grid(mdw-margin-top mdw-margin-bottom mdw-stretch).docs-tab
5
- .mdw-grid__item(mdw-colspan="100%")
6
- h5.mdw-type(mdw-baseline-next="36") Tabs make it easy to explore and switch between different views.
7
- p.mdw-type Tabs enable content organization at a high level, such as switching between views, data sets, or functional aspects of an app.
8
- .mdw-grid__item(mdw-colspan="8")
9
- .mdw-grid__content
10
- .component-sample
11
- .component-sample__container
12
- .mdw-tab
13
- .mdw-tab__list
14
- .mdw-tab__item.mdw-theme.mdw-overlay(mdw-ink="secondary A200" mdw-overlay-default="medium" aria-selected="true")
15
- .mdw-tab__icon.material-icons looks_one
16
- .mdw-tab__label Tab Item One
17
- .mdw-tab__item.mdw-theme.mdw-overlay(mdw-ink="secondary A200" mdw-overlay-default="medium" aria-selected="false")
18
- .mdw-tab__icon.material-icons looks_two
19
- .mdw-tab__label Tab Item Two
20
- .mdw-tab__item.mdw-theme.mdw-overlay(mdw-ink="secondary A200" mdw-overlay-default="medium" aria-selected="false")
21
- .mdw-tab__icon.material-icons looks_3
22
- .mdw-tab__label Tab Item Three
23
- .mdw-tab__indicator.mdw-theme(mdw-ink="secondary A200")
24
- .mdw-tab__content.mdw-theme(mdw-surface="gray 800" mdw-dark)
25
- .mdw-tab__panel
26
- div(style="min-height:200px;padding:20px")
27
- p Sample Content One
28
- +mdwButton({ borderInk:true }) Unfocusable when inactive
29
- p HTML Ordered List with (#) representing DOM position
30
- ol
31
- li.mdw-tabs__panel__active-hide (1) Layer hidden when active (peek only)
32
- li.mdw-tabs__panel__active-remove (2) Layer removed when active (peek only)
33
- li (3) Always visible
34
- li.mdw-tabs__panel__inactive-hide (4) Layer hidden when inactive (active only)
35
- li.mdw-tabs__panel__inactive-remove (5) Layer removed when inactive (active only)
36
- li (6) Always visible
37
- .mdw-tab__panel
38
- div(style="min-height:200px;padding:20px")
39
- p Sample Content Two
40
- +mdwButton({ borderInk:true }) Unfocusable when inactive
41
- p HTML Ordered List with (#) representing DOM position
42
- ol
43
- li.mdw-tabs__panel__active-hide (1) Layer hidden when active (peek only)
44
- li.mdw-tabs__panel__active-remove (2) Layer removed when active (peek only)
45
- li (3) Always visible
46
- li.mdw-tabs__panel__inactive-hide (4) Layer hidden when inactive (active only)
47
- li.mdw-tabs__panel__inactive-remove (5) Layer removed when inactive (active only)
48
- li (6) Always visible
49
- .mdw-tab__panel
50
- div(style="min-height:200px;padding:20px")
51
- p Sample Content Three
52
- +mdwButton({ borderInk:true }) Unfocusable when inactive
53
- p HTML Ordered List with (#) representing DOM position
54
- ol
55
- li.mdw-tabs__panel__active-hide (1) Layer hidden when active (peek only)
56
- li.mdw-tabs__panel__active-remove (2) Layer removed when active (peek only)
57
- li (3) Always visible
58
- li.mdw-tabs__panel__inactive-hide (4) Layer hidden when inactive (active only)
59
- li.mdw-tabs__panel__inactive-remove (5) Layer removed when inactive (active only)
60
- li (6) Always visible
61
- .mdw-grid__item(mdw-colspan="4")
62
- .mdw-type(mdw-style="subtitle") Javascript
63
- .docs-option-list
64
- +mdwSelection({ink:'secondary', name:'javascript', type:'radio', value:'required', checked:true}) Required
65
- +mdwSelection({ink:'secondary', name:'javascript', type:'radio', value:'optional', disabled:true}) Optional
66
- +mdwSelection({ink:'secondary', name:'javascript', type:'radio', value:'none', disabled:true}) None
67
- .mdw-type(mdw-style="subtitle") Ink
68
- .docs-option-list
69
- +mdwSelection({ink:'secondary', name:'ink', type:'radio', value:'default'}) Default
70
- +mdwSelection({ink:'secondary', name:'ink', type:'radio', value:'primary A400'}) Primary A400
71
- +mdwSelection({ink:'secondary', name:'ink', type:'radio', value:'secondary A200', checked:true}) Secondary A200
72
- +mdwSelection({ink:'secondary', name:'ink', type:'radio', value:'warn'}) Warn
73
- +mdwSelection({ink:'secondary', name:'ink', type:'radio', value:'purple A400'}) Purple A400
74
- .mdw-type(mdw-style="subtitle") Surface
75
- .docs-option-list
76
- +mdwSelection({ink:'secondary', name:'surface', type:'radio', value:'none', checked:true}) None
77
- +mdwSelection({ink:'secondary', name:'surface', type:'radio', value:'primary dark'}) Primary (Dark)
78
- +mdwSelection({ink:'secondary', name:'surface', type:'radio', value:'secondary 100 dark'}) Secondary 100 (Dark)
79
- +mdwSelection({ink:'secondary', name:'surface', type:'radio', value:'warn 200 light'}) Warn 200 (Light)
80
- +mdwSelection({ink:'secondary', name:'surface', type:'radio', value:'dark 700 dark'}) Green 700 (Dark)
81
- .mdw-type(mdw-style="subtitle") Scrollable
82
- .docs-option-list
83
- +mdwSelection({ink:'secondary', name:'content-scrollable', checked:true}) Content
84
- +mdwSelection({ink:'secondary', name:'tabs-scrollable'}) Tabs
85
- .mdw-grid__item(mdw-colspan="100%" style="max-height:0")
86
- .mdw-grid__item(mdw-colspan="8")
87
- h6.mdw-type HTML Code
88
- .mdw-card.mdw-theme.component-code.component-html(mdw-surface="card" mdw-border-ink)
89
- +mdwButton({ icon:true, ink:'secondary' })#usePug(aria-pressed="false" mdw-overlay-off="activated") PUG
90
- .mdw-grid__item(mdw-colspan="4")
91
- h6.mdw-type Javascript Code
92
- .mdw-card.mdw-theme.component-code.component-js(mdw-surface="card" mdw-border-ink)
93
- .mdw-grid__item(mdw-colspan="100%")
94
- h6.mdw-type Samples
95
- .mdw-grid__item.display-flex(mdw-colspan="4").clipped-300
96
- .render-fill
97
- .mdw-tab
98
- .mdw-tab__list.mdw-theme(mdw-surface="cyan 500" mdw-dark)
99
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
100
- .mdw-tab__label Item One
101
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
102
- .mdw-tab__label Item Two
103
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
104
- .mdw-tab__label Item Three
105
- .mdw-tab__indicator.mdw-theme(mdw-ink="yellow A400")
106
- .mdw-tab__content
107
- .mdw-tab__panel Item One
108
- .mdw-tab__panel Item Two
109
- .mdw-tab__panel Item Three
110
-
111
- .mdw-grid__item.display-flex(mdw-colspan="4").clipped-300
112
- .render-fill
113
- +androidstatusbar('cyan 700', 'dark')
114
- .mdw-appbar.mdw-theme(mdw-surface="cyan 500" mdw-dark mdw-prominent)
115
- .mdw-appbar__action
116
- .mdw-appbar__start
117
- +mdwButton({ icon:true }).material-icons menu
118
- .mdw-appbar__title Page title
119
- .mdw-appbar__end
120
- +mdwButton({ icon:true }).material-icons search
121
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
122
- .mdw-tab
123
- .mdw-tab__list
124
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
125
- .mdw-tab__label Item One
126
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
127
- .mdw-tab__label Item Two
128
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
129
- .mdw-tab__label Item Three
130
- .mdw-tab__indicator.mdw-theme(mdw-ink="yellow A400")
131
- .content
132
-
133
- .mdw-grid__item.display-flex(mdw-colspan="4").clipped-300
134
- .render-fill
135
- +androidstatusbar('cyan 700', 'dark')
136
- .mdw-tab
137
- .mdw-tab__list-wrapper.mdw-appbar.mdw-theme(mdw-surface="cyan 500" mdw-dark)
138
- .mdw-appbar__action
139
- .mdw-appbar__start
140
- +mdwButton({ icon:true }).material-icons menu
141
- .mdw-appbar__title Page title
142
- .mdw-appbar__end
143
- +mdwButton({ icon:true }).material-icons search
144
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
145
- .mdw-tab__list
146
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
147
- .mdw-tab__label Item One
148
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
149
- .mdw-tab__label Item Two
150
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
151
- .mdw-tab__label Item Three
152
- .mdw-tab__indicator.mdw-theme(mdw-ink="yellow A400")
153
- .mdw-tab__content
154
- .mdw-tab__panel Item One
155
- .mdw-tab__panel Item Two
156
- .mdw-tab__panel Item Three
157
-
158
- .mdw-grid__item.display-flex(mdw-colspan="4").clipped-300
159
- .render-fill
160
- +androidstatusbar('background 600', 'dark')
161
- .mdw-tab
162
- .mdw-tab__list-wrapper.mdw-appbar
163
- .mdw-appbar__action
164
- .mdw-appbar__start
165
- +mdwButton({ icon:true }).material-icons menu
166
- .mdw-appbar__title Page title
167
- .mdw-appbar__end
168
- +mdwButton({ icon:true }).material-icons search
169
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
170
- .mdw-tab__list
171
- .mdw-tab__item.mdw-theme(mdw-ink="cyan A700" mdw-overlay-default="medium")
172
- .mdw-tab__label Item One
173
- .mdw-tab__item.mdw-theme(mdw-ink="cyan A700" mdw-overlay-default="medium")
174
- .mdw-tab__label Item Two
175
- .mdw-tab__item.mdw-theme(mdw-ink="cyan A700" mdw-overlay-default="medium")
176
- .mdw-tab__label Item Three
177
- .mdw-tab__indicator.mdw-theme(mdw-ink="cyan A700")
178
- .mdw-tab__content
179
- .mdw-tab__panel Item One
180
- .mdw-tab__panel Item Two
181
- .mdw-tab__panel Item Three
182
-
183
- .mdw-grid__item.display-flex(mdw-colspan="4").clipped-300
184
- .render-fill
185
- +androidstatusbar('cyan 700', 'dark')
186
- .mdw-appbar.mdw-theme(mdw-surface="cyan 500" mdw-dark)
187
- .mdw-appbar__action
188
- .mdw-appbar__start
189
- +mdwButton({ icon:true }).material-icons menu
190
- .mdw-appbar__title Page title
191
- .mdw-appbar__end
192
- +mdwButton({ icon:true }).material-icons search
193
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
194
- .mdw-tab
195
- .mdw-tab__list
196
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
197
- .mdw-tab__icon.material-icons phone
198
- .mdw-tab__label Recents
199
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
200
- .mdw-tab__icon.material-icons favorite
201
- .mdw-tab__label Favorites
202
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
203
- .mdw-tab__icon.material-icons person_pin
204
- .mdw-tab__label Nearby
205
- .mdw-tab__indicator.mdw-theme(mdw-ink="yellow A400")
206
- .content
207
-
208
- .mdw-grid__item.display-flex(mdw-colspan="4").clipped-300
209
- .render-fill
210
- +androidstatusbar('background 600', 'dark')
211
- .mdw-appbar
212
- .mdw-appbar__action
213
- .mdw-appbar__start
214
- +mdwButton({ icon:true }).material-icons menu
215
- .mdw-appbar__title Page title
216
- .mdw-appbar__end
217
- +mdwButton({ icon:true }).material-icons search
218
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
219
- .mdw-tab
220
- .mdw-tab__list
221
- .mdw-tab__item.mdw-theme(mdw-ink="cyan A700" mdw-overlay-default="medium")
222
- .mdw-tab__icon.material-icons phone
223
- .mdw-tab__item.mdw-theme(mdw-ink="cyan A700" mdw-overlay-default="medium")
224
- .mdw-tab__icon.material-icons favorite
225
- .mdw-tab__item.mdw-theme(mdw-ink="cyan A700" mdw-overlay-default="medium")
226
- .mdw-tab__icon.material-icons person_pin
227
- .mdw-tab__indicator.mdw-theme(mdw-ink="cyan A700")
228
- .content
229
- .mdw-grid__item.display-flex(mdw-colspan="100%")
230
- .display-flex(flex-column style="width:100%;padding:24px;box-sizing:border-box")
231
- +androidstatusbar('cyan 700', 'dark')
232
- .mdw-tab
233
- .mdw-tab__list-wrapper.mdw-appbar.mdw-theme(mdw-surface="cyan 500" mdw-dark)
234
- .mdw-appbar__action
235
- .mdw-appbar__start
236
- +mdwButton({ icon:true }).material-icons menu
237
- .mdw-appbar__title Clustered
238
- .mdw-appbar__end
239
- +mdwButton({ icon:true }).material-icons search
240
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
241
- .mdw-tab__list(style="align-self:center")
242
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
243
- .mdw-tab__icon.material-icons phone
244
- .mdw-tab__label Recents
245
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
246
- .mdw-tab__icon.material-icons favorite
247
- .mdw-tab__label Favorites
248
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
249
- .mdw-tab__icon.material-icons person_pin
250
- .mdw-tab__label Nearby
251
- .mdw-tab__indicator.mdw-theme(mdw-ink="yellow A400")
252
- .mdw-tab__content
253
- .mdw-tab__panel Recents
254
- .mdw-tab__panel Favorites
255
- .mdw-tab__panel Nearby
256
-
257
- .mdw-grid__item(mdw-colspan="100%")
258
- .mdw-grid__content.js
259
- +androidstatusbar('cyan 700', 'dark')
260
- .mdw-tab
261
- .mdw-appbar.mdw-theme(mdw-surface="cyan 500" mdw-dark)
262
- .mdw-appbar__action
263
- .mdw-appbar__start
264
- +mdwButton({ icon:true }).material-icons menu
265
- .mdw-appbar__title Scrollable
266
- .mdw-appbar__end
267
- +mdwButton({ icon:true }).material-icons search
268
- +mdwButton({ icon:true }).material-icons(mdw-more-button) more_vert
269
- .mdw-tab__list(mdw-scrollable)
270
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
271
- .mdw-tab__icon.material-icons phone
272
- .mdw-tab__label Recents
273
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
274
- .mdw-tab__icon.material-icons favorite
275
- .mdw-tab__label My Oversized Favorites Tab
276
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
277
- .mdw-tab__icon.material-icons person_pin
278
- .mdw-tab__label Nearby
279
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
280
- .mdw-tab__icon.material-icons edit
281
- .mdw-tab__label Edit
282
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
283
- .mdw-tab__icon.material-icons clear
284
- .mdw-tab__label Clear
285
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
286
- .mdw-tab__icon.material-icons search
287
- .mdw-tab__label Search
288
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
289
- .mdw-tab__icon.material-icons restore
290
- .mdw-tab__label Restore
291
- .mdw-tab__item.mdw-theme(mdw-ink="yellow A400" mdw-overlay-default="medium")
292
- .mdw-tab__icon.material-icons stars
293
- .mdw-tab__label Stars
294
- .mdw-tab__indicator.mdw-theme(mdw-ink="yellow A400")
295
- .mdw-tab__content
296
- .mdw-tab__panel 1
297
- .mdw-tab__panel 2
298
- .mdw-tab__panel 3
299
- .mdw-tab__panel 4
300
- .mdw-tab__panel 5
301
- .mdw-tab__panel 6
302
- .mdw-tab__panel 7
303
- .mdw-tab__panel 8
304
- script(src='tab.min.js')