mirror of
https://github.com/Hopiu/vue-material.git
synced 2026-03-16 22:10:27 +00:00
1 line
No EOL
14 KiB
JavaScript
1 line
No EOL
14 KiB
JavaScript
webpackJsonp([11,34],{466:function(t,d,n){n(599);var m=n(0)(n(498),n(565),"data-v-57e41aff",null);t.exports=m.exports},498:function(t,d,n){"use strict";Object.defineProperty(d,"__esModule",{value:!0}),d.default={data:function(){return{buttonDisabled:!0}},methods:{disablePrimaryButton:function(){this.buttonDisabled=!this.buttonDisabled}}},t.exports=d.default},531:function(t,d,n){d=t.exports=n(4)(),d.push([t.i,".disabled-button[data-v-57e41aff]{margin-left:8px}.fab-holder[data-v-57e41aff]{height:300px}",""])},565:function(t,d){t.exports={render:function(){var t=this,d=t.$createElement,n=t._self._c||d;return n("page-content",{attrs:{"page-title":"Components - Button"}},[n("docs-component",[n("div",{slot:"description"},[n("p",[t._v("Buttons communicate the action that will occur when the user touches them.")]),t._v(" "),n("p",[t._v("The following classes can be applied to change the color palette:")]),t._v(" "),n("ul",{staticClass:"md-body-2"},[n("li",[n("code",[t._v("md-primary")])]),t._v(" "),n("li",[n("code",[t._v("md-accent")])]),t._v(" "),n("li",[n("code",[t._v("md-warn")])])])]),t._v(" "),n("div",{slot:"api"},[n("api-table",{attrs:{name:"md-button"}},[n("md-table",{slot:"properties"},[n("md-table-header",[n("md-table-row",[n("md-table-head",[t._v("Name")]),t._v(" "),n("md-table-head",[t._v("Type")]),t._v(" "),n("md-table-head",[t._v("Description")])],1)],1),t._v(" "),n("md-table-body",[n("md-table-row",[n("md-table-cell",[t._v("disabled")]),t._v(" "),n("md-table-cell",[n("code",[t._v("Boolean")])]),t._v(" "),n("md-table-cell",[t._v("Disable the button and prevent his actions. Default "),n("code",[t._v("false")])])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("type")]),t._v(" "),n("md-table-cell",[n("code",[t._v("String")])]),t._v(" "),n("md-table-cell",[t._v("Apply a type to button - Doesn't apply for links.")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("href")]),t._v(" "),n("md-table-cell",[n("code",[t._v("String")])]),t._v(" "),n("md-table-cell",[t._v("Create a anchor on the button - In this case the generated tag will be "),n("code",[t._v("<a>")]),t._v(".")])],1)],1)],1),t._v(" "),n("md-table",{slot:"classes"},[n("md-table-header",[n("md-table-row",[n("md-table-head",[t._v("Name")]),t._v(" "),n("md-table-head",[t._v("Description")])],1)],1),t._v(" "),n("md-table-body",[n("md-table-row",[n("md-table-cell",[t._v("md-raised")]),t._v(" "),n("md-table-cell",[t._v("Raised button")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-icon-button")]),t._v(" "),n("md-table-cell",[t._v("Create rounded buttons - Need a <md-icon> inside")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-dense")]),t._v(" "),n("md-table-cell",[t._v("Small dense buttons")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab")]),t._v(" "),n("md-table-cell",[t._v("Create an Floating Action Button")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-mini")]),t._v(" "),n("md-table-cell",[t._v("Small md-fab")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab-top-left")]),t._v(" "),n("md-table-cell",[t._v("Position the md-fab absolutely on the top left of his parent")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab-top-center")]),t._v(" "),n("md-table-cell",[t._v("Position the md-fab absolutely on the top center of his parent")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab-top-right")]),t._v(" "),n("md-table-cell",[t._v("Position the md-fab absolutely on the top right of his parent")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab-bottom-left")]),t._v(" "),n("md-table-cell",[t._v("Position the md-fab absolutely on the bottom left of his parent")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab-bottom-center")]),t._v(" "),n("md-table-cell",[t._v("Position the md-fab absolutely on the bottom center of his parent")])],1),t._v(" "),n("md-table-row",[n("md-table-cell",[t._v("md-fab-bottom-right")]),t._v(" "),n("md-table-cell",[t._v("Position the md-fab absolutely on the bottom right of his parent")])],1)],1)],1)],1)],1),t._v(" "),n("div",{slot:"example"},[n("example-box",{attrs:{"card-title":"Flat"}},[n("div",{slot:"demo"},[n("md-button",[t._v("Default")]),t._v(" "),n("md-button",{staticClass:"md-primary"},[t._v("Primary")]),t._v(" "),n("md-button",{staticClass:"md-accent"},[t._v("Accent")]),t._v(" "),n("md-button",{staticClass:"md-warn"},[t._v("Warn")]),t._v(" "),n("md-button",{staticClass:"md-primary",attrs:{disabled:""}},[t._v("Disabled")]),t._v(" "),n("md-button",{staticClass:"md-dense"},[t._v("Dense")])],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <md-button>Default</md-button>\n <md-button class="md-primary">Primary</md-button>\n <md-button class="md-accent">Accent</md-button>\n <md-button class="md-warn">Warn</md-button>\n <md-button class="md-primary" disabled>Disabled</md-button>\n <md-button class="md-dense">Dense</md-button>\n ')])],1)]),t._v(" "),n("example-box",{attrs:{"card-title":"Raised"}},[n("div",{slot:"demo"},[n("md-button",{staticClass:"md-raised"},[t._v("Default")]),t._v(" "),n("md-button",{staticClass:"md-raised md-primary"},[t._v("Primary")]),t._v(" "),n("md-button",{staticClass:"md-raised md-accent"},[t._v("Accent")]),t._v(" "),n("md-button",{staticClass:"md-raised md-warn"},[t._v("Warn")]),t._v(" "),n("md-button",{staticClass:"md-raised md-primary",attrs:{disabled:""}},[t._v("Disabled")]),t._v(" "),n("md-button",{staticClass:"md-raised md-dense"},[t._v("Dense")])],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <md-button class="md-raised">Default</md-button>\n <md-button class="md-raised md-primary">Primary</md-button>\n <md-button class="md-raised md-accent">Accent</md-button>\n <md-button class="md-raised md-warn">Warn</md-button>\n <md-button class="md-raised md-primary" disabled>Disabled</md-button>\n <md-button class="md-raised md-dense">Dense</md-button>\n ')])],1)]),t._v(" "),n("example-box",{attrs:{"card-title":"Button vs Link vs Router Link"}},[n("div",{slot:"demo"},[n("md-button",{staticClass:"md-raised md-primary"},[t._v("Button")]),t._v(" "),n("md-button",{staticClass:"md-raised md-primary",attrs:{href:"#/components/button"}},[t._v("Link")]),t._v(" "),n("router-link",{staticClass:"md-raised md-primary",attrs:{tag:"md-button",to:"/components/button"}},[t._v("Router Link")])],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <md-button class="md-raised md-primary">Button</md-button>\n <md-button href="#/components/button" class="md-raised md-primary">Link</md-button>\n <router-link tag="md-button" to="/components/button" class="md-raised md-primary">Router Link</router-link>\n ')])],1)]),t._v(" "),n("example-box",{attrs:{"card-title":"Icons - Flat"}},[n("div",{slot:"demo"},[n("md-button",{staticClass:"md-icon-button"},[n("md-icon",[t._v("more_vert")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-primary"},[n("md-icon",[t._v("more_vert")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-accent"},[n("md-icon",[t._v("more_vert")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-warn"},[n("md-icon",[t._v("more_vert")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button",attrs:{disabled:""}},[n("md-icon",[t._v("more_vert")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-dense"},[n("md-icon",[t._v("more_vert")])],1)],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <md-button class="md-icon-button">\n <md-icon>more_vert</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-primary">\n <md-icon>more_vert</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-accent">\n <md-icon>more_vert</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-warn">\n <md-icon>more_vert</md-icon>\n </md-button>\n\n <md-button class="md-icon-button" disabled>\n <md-icon>more_vert</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-dense">\n <md-icon>more_vert</md-icon>\n </md-button>\n ')])],1)]),t._v(" "),n("example-box",{attrs:{"card-title":"Icons - Raised"}},[n("div",{slot:"demo"},[n("md-button",{staticClass:"md-icon-button md-raised"},[n("md-icon",[t._v("add")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-raised md-primary"},[n("md-icon",[t._v("add")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-raised md-accent"},[n("md-icon",[t._v("add")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-raised md-warn"},[n("md-icon",[t._v("add")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-raised",attrs:{disabled:""}},[n("md-icon",[t._v("add")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-raised md-dense"},[n("md-icon",[t._v("add")])],1)],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <md-button class="md-icon-button md-raised">\n <md-icon>add</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-raised md-primary">\n <md-icon>add</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-raised md-accent">\n <md-icon>add</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-raised md-warn">\n <md-icon>add</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-raised" disabled>\n <md-icon>add</md-icon>\n </md-button>\n\n <md-button class="md-icon-button md-raised md-dense">\n <md-icon>add</md-icon>\n </md-button>\n ')])],1)]),t._v(" "),n("example-box",{attrs:{"card-title":"Floating Action Button"}},[n("div",{staticClass:"fab-holder",slot:"demo"},[n("div",[n("md-button",{staticClass:"md-fab"},[n("md-icon",[t._v("edit")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-primary"},[n("md-icon",[t._v("email")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-warn"},[n("md-icon",[t._v("save")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-clean"},[n("md-icon",[t._v("dialpad")])],1),t._v(" "),n("md-button",{staticClass:"md-fab",attrs:{disabled:""}},[n("md-icon",[t._v("message")])],1)],1),t._v(" "),n("div",[n("md-button",{staticClass:"md-fab md-mini"},[n("md-icon",[t._v("edit")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-primary md-mini"},[n("md-icon",[t._v("email")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-warn md-mini"},[n("md-icon",[t._v("save")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-clean md-mini"},[n("md-icon",[t._v("dialpad")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-mini",attrs:{disabled:""}},[n("md-icon",[t._v("message")])],1)],1),t._v(" "),n("md-button",{staticClass:"md-fab md-fab-bottom-left"},[n("md-icon",[t._v("save")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-primary md-fab-bottom-center"},[n("md-icon",[t._v("dialpad")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-fab-bottom-right"},[n("md-icon",[t._v("add")])],1)],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <div>\n <md-button class="md-fab">\n <md-icon>edit</md-icon>\n </md-button>\n\n <md-button class="md-fab md-primary">\n <md-icon>email</md-icon>\n </md-button>\n\n <md-button class="md-fab md-warn">\n <md-icon>save</md-icon>\n </md-button>\n\n <md-button class="md-fab md-clean">\n <md-icon>dialpad</md-icon>\n </md-button>\n\n <md-button class="md-fab" disabled>\n <md-icon>message</md-icon>\n </md-button>\n </div>\n\n <div>\n <md-button class="md-fab md-mini">\n <md-icon>edit</md-icon>\n </md-button>\n\n <md-button class="md-fab md-primary md-mini">\n <md-icon>email</md-icon>\n </md-button>\n\n <md-button class="md-fab md-warn md-mini">\n <md-icon>save</md-icon>\n </md-button>\n\n <md-button class="md-fab md-clean md-mini">\n <md-icon>dialpad</md-icon>\n </md-button>\n\n <md-button class="md-fab md-mini" disabled>\n <md-icon>message</md-icon>\n </md-button>\n </div>\n\n <md-button class="md-fab md-fab-bottom-left">\n <md-icon>save</md-icon>\n </md-button>\n\n <md-button class="md-fab md-primary md-fab-bottom-center">\n <md-icon>dialpad</md-icon>\n </md-button>\n\n <md-button class="md-fab md-fab-bottom-right">\n <md-icon>add</md-icon>\n </md-button>\n ')])],1)]),t._v(" "),n("example-box",{attrs:{"card-title":"Themes"}},[n("div",{slot:"demo"},[n("md-button",{staticClass:"md-primary",attrs:{"md-theme":"indigo"}},[t._v("Indigo")]),t._v(" "),n("md-button",{staticClass:"md-raised md-primary",attrs:{"md-theme":"teal"}},[t._v("Teal")]),t._v(" "),n("md-button",{staticClass:"md-icon-button md-primary",attrs:{"md-theme":"orange"}},[n("md-icon",[t._v("add")])],1),t._v(" "),n("md-button",{staticClass:"md-icon-button md-raised md-primary",attrs:{"md-theme":"green"}},[n("md-icon",[t._v("message")])],1),t._v(" "),n("md-button",{staticClass:"md-fab md-primary",attrs:{"md-theme":"brown"}},[n("md-icon",[t._v("dialpad")])],1)],1),t._v(" "),n("div",{slot:"code"},[n("code-block",{attrs:{lang:"xml"}},[t._v('\n <md-button md-theme="indigo" class="md-primary">Indigo</md-button>\n\n <md-button md-theme="teal" class="md-raised md-primary">Teal</md-button>\n\n <md-button md-theme="orange" class="md-icon-button md-primary">\n <md-icon>add</md-icon>\n </md-button>\n\n <md-button md-theme="green" class="md-icon-button md-raised md-primary">\n <md-icon>message</md-icon>\n </md-button>\n\n <md-button md-theme="brown" class="md-fab md-primary">\n <md-icon>dialpad</md-icon>\n </md-button>\n ')])],1)])],1)])],1)},staticRenderFns:[]}},599:function(t,d,n){var m=n(531);"string"==typeof m&&(m=[[t.i,m,""]]),m.locals&&(t.exports=m.locals);n(5)("3e21c4e6",m,!0)}}); |