vue-material/dist/docs/8.19299e2b.js

webpackJsonp([8,27,29],{92:function(t,o){"use strict";Object.defineProperty(o,"__esModule",{value:!0}),o.default={data:function(){return{playground:{theme:"brown"}}},methods:{setTheme:function(t){this.playground.theme=t}}},t.exports=o.default},219:function(t,o,m){o=t.exports=m(1)(),o.push([t.id,".md-bottom-bar[data-v-24874b3d]{position:absolute;right:0;bottom:0;left:0}.phone-viewport[data-v-24874b3d]{width:320px;height:150px;margin-right:16px;display:inline-block;position:relative;overflow:hidden;background-color:#ededed}",""])},307:function(t,o,m){var e,a;m(219),e=m(92);var i=m(413);a=e=e||{},"object"!=typeof e.default&&"function"!=typeof e.default||(a=e=e.default),"function"==typeof a&&(a=a.options),a.render=i.render,a.staticRenderFns=i.staticRenderFns,a._scopeId="data-v-24874b3d",t.exports=e},413:function(t,o){t.exports={render:function(){var t=this,o=t.$createElement,m=t._self._c||o;return m("page-content",{attrs:{"page-title":"Components - Bottom Bar"}},[m("docs-component",[m("div",{slot:"description"},[m("p",[t._v("Bottom navigation bars make it easy to explore and switch between top-level views in a single tap.")]),t._v(" "),m("p",[t._v("The following classes can be applied to change the color palette:")]),t._v(" "),m("ul",{staticClass:"md-body-2"},[m("li",[m("code",[t._v("md-accent")])]),t._v(" "),m("li",[m("code",[t._v("md-warn")])]),t._v(" "),m("li",[m("code",[t._v("md-transparent")])])])]),t._v(" "),m("div",{slot:"api"},[m("api-table",{attrs:{name:"md-bottom-bar"}},[m("md-table",{slot:"properties"},[m("md-table-header",[m("md-table-row",[m("md-table-head",[t._v("Name")]),t._v(" "),m("md-table-head",[t._v("Type")]),t._v(" "),m("md-table-head",[t._v("Description")])],1)],1),t._v(" "),m("md-table-body",[m("md-table-row",[m("md-table-cell",[t._v("md-shift")]),t._v(" "),m("md-table-cell",[m("code",[t._v("Boolean")])]),t._v(" "),m("md-table-cell",[t._v("Enable the shifting variant. Default "),m("code",[t._v("false")])])],1)],1)],1)],1),t._v(" "),m("api-table",{attrs:{name:"md-bottom-bar-item"}},[m("md-table",{slot:"properties"},[m("md-table-header",[m("md-table-row",[m("md-table-head",[t._v("Name")]),t._v(" "),m("md-table-head",[t._v("Type")]),t._v(" "),m("md-table-head",[t._v("Description")])],1)],1),t._v(" "),m("md-table-body",[m("md-table-row",[m("md-table-cell",[t._v("md-icon")]),t._v(" "),m("md-table-cell",[m("code",[t._v("String")])]),t._v(" "),m("md-table-cell",[t._v("Icon name on the "),m("a",{attrs:{href:"https://material.io/icons/",target:"_blank",rel:"noopener"}},[t._v("Material Icons")]),t._v(" docs.")])],1),t._v(" "),m("md-table-row",[m("md-table-cell",[t._v("md-active")]),t._v(" "),m("md-table-cell",[m("code",[t._v("Boolean")])]),t._v(" "),m("md-table-cell",[t._v("Set initial selection. Default "),m("code",[t._v("false")])])],1),t._v(" "),m("md-table-row",[m("md-table-cell",[t._v("href")]),t._v(" "),m("md-table-cell",[m("code",[t._v("String")])]),t._v(" "),m("md-table-cell",[t._v("Create a anchor on the item - In this case the generated tag will be "),m("code",[t._v("<a>")]),t._v(".")])],1)],1)],1)],1)],1),t._v(" "),m("div",{slot:"example"},[m("example-box",{attrs:{"card-title":"Default"}},[m("div",{slot:"demo"},[m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",[m("md-bottom-bar-item",{attrs:{"md-icon":"history"}},[t._v("Recents")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"favorite","md-active":""}},[t._v("Favorites")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"near_me"}},[t._v("Nearby")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{staticClass:"md-accent"},[m("md-bottom-bar-item",{attrs:{href:"#/components/bottom-bar","md-icon":"history"}},[t._v("Recents")]),t._v(" "),m("md-bottom-bar-item",{attrs:{href:"#/components/bottom-bar","md-icon":"favorite","md-active":""}},[t._v("Favorites")]),t._v(" "),m("md-bottom-bar-item",{attrs:{href:"#/components/bottom-bar","md-icon":"near_me"}},[t._v("Nearby")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{staticClass:"md-warn"},[m("md-bottom-bar-item",{attrs:{"md-icon":"history"}},[t._v("Recents")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"favorite","md-active":""}},[t._v("Favorites")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"near_me"}},[t._v("Nearby")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{staticClass:"md-transparent"},[m("md-bottom-bar-item",{attrs:{"md-icon":"history"}},[t._v("Recents")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"favorite","md-active":""}},[t._v("Favorites")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"near_me"}},[t._v("Nearby")])],1)],1)]),t._v(" "),m("div",{slot:"code"},[m("code-block",{attrs:{lang:"xml"}},[t._v('\n            <md-bottom-bar>\n              <md-bottom-bar-item md-icon="history">Recents</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="favorite" md-active>Favorites</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="near_me">Nearby</md-bottom-bar-item>\n            </md-bottom-bar>\n\n            <md-bottom-bar class="md-accent">\n              <md-bottom-bar-item md-icon="history">Recents</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="favorite" md-active>Favorites</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="near_me">Nearby</md-bottom-bar-item>\n            </md-bottom-bar>\n\n            <md-bottom-bar class="md-warn">\n              <md-bottom-bar-item md-icon="history">Recents</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="favorite" md-active>Favorites</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="near_me">Nearby</md-bottom-bar-item>\n            </md-bottom-bar>\n\n            <md-bottom-bar class="md-transparent">\n              <md-bottom-bar-item md-icon="history">Recents</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="favorite" md-active>Favorites</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="near_me">Nearby</md-bottom-bar-item>\n            </md-bottom-bar>\n          ')])],1)]),t._v(" "),m("example-box",{attrs:{"card-title":"Shifting"}},[m("div",{slot:"demo"},[m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{attrs:{"md-shift":""}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"}},[t._v("Pictures")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{staticClass:"md-accent",attrs:{"md-shift":""}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"}},[t._v("Pictures")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{staticClass:"md-warn",attrs:{"md-shift":""}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"}},[t._v("Pictures")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{staticClass:"md-transparent",attrs:{"md-shift":""}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"}},[t._v("Pictures")])],1)],1)]),t._v(" "),m("div",{slot:"code"},[m("code-block",{attrs:{lang:"xml"}},[t._v('\n            <md-bottom-bar md-shift>\n              <md-bottom-bar-item md-icon="ondemand_video">Movies</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="music_note">Music</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="books" md-active>Books</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="photo">Pictures</md-bottom-bar-item>\n            </md-bottom-bar>\n\n            <md-bottom-bar class="md-accent" md-shift>\n              <md-bottom-bar-item md-icon="ondemand_video">Movies</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="music_note">Music</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="books" md-active>Books</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="photo">Pictures</md-bottom-bar-item>\n            </md-bottom-bar>\n\n            <md-bottom-bar class="md-warn" md-shift>\n              <md-bottom-bar-item md-icon="ondemand_video">Movies</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="music_note">Music</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="books" md-active>Books</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="photo">Pictures</md-bottom-bar-item>\n            </md-bottom-bar>\n\n            <md-bottom-bar class="md-transparent" md-shift>\n              <md-bottom-bar-item md-icon="ondemand_video">Movies</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="music_note">Music</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="books" md-active>Books</md-bottom-bar-item>\n              <md-bottom-bar-item md-icon="photo">Pictures</md-bottom-bar-item>\n            </md-bottom-bar>\n          ')])],1)]),t._v(" "),m("example-box",{attrs:{"card-title":"Themes"}},[m("div",{slot:"demo"},[m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{attrs:{"md-theme":"orange"}},[m("md-bottom-bar-item",{attrs:{"md-icon":"history"}},[t._v("Recents")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"favorite","md-active":""}},[t._v("Favorites")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"near_me"}},[t._v("Nearby")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{attrs:{"md-theme":"teal"}},[m("md-bottom-bar-item",{attrs:{"md-icon":"history"}},[t._v("Recents")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"favorite","md-active":""}},[t._v("Favorites")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"near_me"}},[t._v("Nearby")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{attrs:{"md-shift":"","md-theme":"green"}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"}},[t._v("Pictures")])],1)],1),t._v(" "),m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{attrs:{"md-shift":"","md-theme":"indigo"}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"}},[t._v("Pictures")])],1)],1)]),t._v(" "),m("div",{slot:"code"},[m("code-block",{attrs:{lang:"xml"}},[t._v('\n            <div class="phone-viewport">\n              <md-bottom-bar md-theme="orange">\n                <md-bottom-bar-item md-icon="history">Recents</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="favorite" md-active>Favorites</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="near_me">Nearby</md-bottom-bar-item>\n              </md-bottom-bar>\n            </div>\n\n            <div class="phone-viewport">\n              <md-bottom-bar md-theme="teal">\n                <md-bottom-bar-item md-icon="history">Recents</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="favorite" md-active>Favorites</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="near_me">Nearby</md-bottom-bar-item>\n              </md-bottom-bar>\n            </div>\n\n            <div class="phone-viewport">\n              <md-bottom-bar md-shift md-theme="green">\n                <md-bottom-bar-item md-icon="ondemand_video">Movies</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="music_note">Music</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="books" md-active>Books</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="photo">Pictures</md-bottom-bar-item>\n              </md-bottom-bar>\n            </div>\n\n            <div class="phone-viewport">\n              <md-bottom-bar md-shift md-theme="indigo">\n                <md-bottom-bar-item md-icon="ondemand_video">Movies</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="music_note">Music</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="books" md-active>Books</md-bottom-bar-item>\n                <md-bottom-bar-item md-icon="photo">Pictures</md-bottom-bar-item>\n              </md-bottom-bar>\n            </div>\n          ')])],1)]),t._v(" "),m("example-box",{attrs:{"card-title":"Dynamic Theme Example"}},[m("div",{slot:"demo"},[m("div",{staticClass:"phone-viewport"},[m("md-bottom-bar",{attrs:{"md-shift":"","md-theme":t.playground.theme}},[m("md-bottom-bar-item",{attrs:{"md-icon":"ondemand_video"},nativeOn:{click:function(o){t.setTheme("blue")}}},[t._v("Movies")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"music_note"},nativeOn:{click:function(o){t.setTheme("teal")}}},[t._v("Music")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"books","md-active":""},nativeOn:{click:function(o){t.setTheme("brown")}}},[t._v("Books")]),t._v(" "),m("md-bottom-bar-item",{attrs:{"md-icon":"photo"},nativeOn:{click:function(o){t.setTheme("indigo")}}},[t._v("Pictures")])],1)],1)]),t._v(" "),m("div",{slot:"code"},[m("code-block",{attrs:{lang:"xml"}},[t._v('\n            <md-theme :md-name="playground.theme">\n              <md-bottom-bar md-shift>\n                <md-bottom-bar-item @click.native="setTheme(\'blue\')" md-icon="ondemand_video">Movies</md-bottom-bar-item>\n                <md-bottom-bar-item @click.native="setTheme(\'teal\')" md-icon="music_note">Music</md-bottom-bar-item>\n                <md-bottom-bar-item @click.native="setTheme(\'brown\')" md-icon="books" md-active>Books</md-bottom-bar-item>\n                <md-bottom-bar-item @click.native="setTheme(\'indigo\')" md-icon="photo">Pictures</md-bottom-bar-item>\n              </md-bottom-bar>\n            </div>\n          ')]),t._v(" "),m("code-block",{attrs:{lang:"javascript"}},[t._v("\n            export default {\n              data() {\n                return {\n                  playground: {\n                    theme: 'brown'\n                  }\n                };\n              },\n              methods: {\n                setTheme(theme) {\n                  this.playground.theme = theme;\n                }\n              }\n            };\n          ")])],1)])],1)])],1)},staticRenderFns:[]}}});