vue-material/dist/docs/26.ce0a9d8d.js

webpackJsonp([26,27,29],{313:function(e,t,o){var a,n,s=o(425);n=a=a||{},"object"!=typeof a.default&&"function"!=typeof a.default||(n=a=a.default),"function"==typeof n&&(n=n.options),n.render=s.render,n.staticRenderFns=s.staticRenderFns,e.exports=a},425:function(e,t){e.exports={render:function(){var e=this,t=e.$createElement,o=e._self._c||t;return o("page-content",{attrs:{"page-title":"Components - Icon"}},[o("docs-component",[o("div",{slot:"description"},[o("p",[e._v("A system icon, or UI icon, symbolizes a command, file, device, or directory. System icons are also used to represent common actions like trash, print, and save.")]),e._v(" "),o("p",[e._v("You can see the full list of icons on the "),o("a",{attrs:{href:"https://material.io/icons/",target:"_blank",rel:"noopener"}},[e._v("Material Icons")]),e._v(" website. Replace the spaces in the icon name by underscores (for example, "),o("code",[e._v("arrow back")]),e._v(" becomes "),o("code",[e._v("arrow_back")]),e._v(")")]),e._v(" "),o("p",[e._v("The following classes can be applied to change the color palette:")]),e._v(" "),o("ul",{staticClass:"md-body-2"},[o("li",[o("code",[e._v("md-primary")])]),e._v(" "),o("li",[o("code",[e._v("md-accent")])]),e._v(" "),o("li",[o("code",[e._v("md-warn")])])])]),e._v(" "),o("div",{slot:"api"},[o("api-table",{attrs:{name:"md-icon"}},[o("p",[e._v("No options available")])])],1),e._v(" "),o("div",{slot:"example"},[o("example-box",{attrs:{"card-title":"Default"}},[o("div",{slot:"demo"},[o("md-icon",[e._v("home")]),e._v(" "),o("md-icon",{staticClass:"md-primary"},[e._v("menu")]),e._v(" "),o("md-icon",{staticClass:"md-accent"},[e._v("people")]),e._v(" "),o("md-icon",{staticClass:"md-warn"},[e._v("access_time")])],1),e._v(" "),o("div",{slot:"code"},[o("code-block",{attrs:{lang:"xml"}},[e._v('\n            <md-icon>home</md-icon>\n            <md-icon class="md-primary">menu</md-icon>\n            <md-icon class="md-accent">people</md-icon>\n            <md-icon class="md-warn">access_time</md-icon>\n          ')])],1)]),e._v(" "),o("example-box",{attrs:{"card-title":"Themes"}},[o("div",{slot:"demo"},[o("md-icon",{staticClass:"md-primary",attrs:{"md-theme":"light-blue"}},[e._v("home")]),e._v(" "),o("md-icon",{staticClass:"md-primary",attrs:{"md-theme":"green"}},[e._v("menu")]),e._v(" "),o("md-icon",{staticClass:"md-primary",attrs:{"md-theme":"brown"}},[e._v("people")]),e._v(" "),o("md-icon",{staticClass:"md-primary",attrs:{"md-theme":"orange"}},[e._v("access_time")])],1),e._v(" "),o("div",{slot:"code"},[o("code-block",{attrs:{lang:"xml"}},[e._v('\n            <md-icon md-theme="light-blue" class="md-primary">home</md-icon>\n            <md-icon md-theme="green" class="md-primary">menu</md-icon>\n            <md-icon md-theme="brown" class="md-primary">people</md-icon>\n            <md-icon md-theme="orange" class="md-primary">access_time</md-icon>\n          ')])],1)])],1)])],1)},staticRenderFns:[]}}});