Hopiu/vue-material
1
0
Fork 0
mirror of https://github.com/Hopiu/vue-material.git synced 2026-05-17 03:31:07 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

remove custom click bindings

Browse source
This commit is contained in:
Marcos Moura 2017-02-07 03:01:12 -02:00
parent 3056390935
commit 78e1c9e159
9 changed files with 49 additions and 49 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
docs/src/App.vue
View file

@ -1,6 +1,6 @@
<template>
<div class="container">
<md-sidenav class="main-sidebar md-left md-fixed" ref="main-sidebar">
<md-sidenav class="main-sidebar md-left md-fixed" md-swipeable ref="main-sidebar">
<md-toolbar class="vue-material-logo" md-theme="white">
<router-link exact to="/">
<img :src="logo" alt="Vue">

2
docs/src/components/ExampleBox.vue
View file

@ -17,7 +17,7 @@
</md-tabs>
</md-card-area>
<!-- <button type="button" class="md-codepen" @click="editOnCodepen">
<!-- <button type="button" class="md-codepen" @click.native="editOnCodepen">
<img src="assets/codepen.png" alt="Edit on Codepen">
<md-tooltip md-direction="left">Edit on codepen</md-tooltip>
</button> -->

2
docs/src/components/PageContent.vue
View file

@ -1,7 +1,7 @@
<template>
<div class="page-content">
<md-whiteframe md-tag="md-toolbar" md-elevation="1" class="main-header">
<md-button class="md-icon-button nav-trigger" @click="toggleSidenav">
<md-button class="md-icon-button nav-trigger" @click.native="toggleSidenav">
<md-icon>menu</md-icon>
</md-button>

40
docs/src/pages/components/Dialog.vue
View file

@ -286,8 +286,8 @@
<md-dialog-content>Nemo, nobis necessitatibus ut illo, ducimus ex.</md-dialog-content>
<md-dialog-actions>
<md-button class="md-primary" @click="closeDialog('dialog1')">Cancel</md-button>
<md-button class="md-primary" @click="closeDialog('dialog1')">Ok</md-button>
<md-button class="md-primary" @click.native="closeDialog('dialog1')">Cancel</md-button>
<md-button class="md-primary" @click.native="closeDialog('dialog1')">Ok</md-button>
</md-dialog-actions>
</md-dialog>
@ -304,13 +304,13 @@
</md-dialog-content>
<md-dialog-actions>
<md-button class="md-primary" @click="closeDialog('dialog2')">Cancel</md-button>
<md-button class="md-primary" @click="closeDialog('dialog2')">Create</md-button>
<md-button class="md-primary" @click.native="closeDialog('dialog2')">Cancel</md-button>
<md-button class="md-primary" @click.native="closeDialog('dialog2')">Create</md-button>
</md-dialog-actions>
</md-dialog>
<md-button class="md-primary md-raised" id="custom" @click="openDialog('dialog1')">Custom</md-button>
<md-button class="md-fab md-fab-bottom-right" id="fab" @click="openDialog('dialog2')">
<md-button class="md-primary md-raised" id="custom" @click.native="openDialog('dialog1')">Custom</md-button>
<md-button class="md-fab md-fab-bottom-right" id="fab" @click.native="openDialog('dialog2')">
<md-icon>add</md-icon>
</md-button>
</div>
@ -323,8 +323,8 @@
&lt;md-dialog-content&gt;Nemo, nobis necessitatibus ut illo, ducimus ex.&lt;/md-dialog-content&gt;
&lt;md-dialog-actions&gt;
&lt;md-button class=&quot;md-primary&quot; @click=&quot;closeDialog(&apos;dialog1&apos;)&quot;&gt;Cancel&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary&quot; @click=&quot;closeDialog(&apos;dialog1&apos;)&quot;&gt;Ok&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary&quot; @click.native=&quot;closeDialog(&apos;dialog1&apos;)&quot;&gt;Cancel&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary&quot; @click.native=&quot;closeDialog(&apos;dialog1&apos;)&quot;&gt;Ok&lt;/md-button&gt;
&lt;/md-dialog-actions&gt;
&lt;/md-dialog&gt;
@ -341,13 +341,13 @@
&lt;/md-dialog-content&gt;
&lt;md-dialog-actions&gt;
&lt;md-button class=&quot;md-primary&quot; @click=&quot;closeDialog(&apos;dialog2&apos;)&quot;&gt;Cancel&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary&quot; @click=&quot;closeDialog(&apos;dialog2&apos;)&quot;&gt;Create&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary&quot; @click.native=&quot;closeDialog(&apos;dialog2&apos;)&quot;&gt;Cancel&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary&quot; @click.native=&quot;closeDialog(&apos;dialog2&apos;)&quot;&gt;Create&lt;/md-button&gt;
&lt;/md-dialog-actions&gt;
&lt;/md-dialog&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; id=&quot;custom&quot; @click=&quot;openDialog(&apos;dialog1&apos;)&quot;&gt;Custom&lt;/md-button&gt;
&lt;md-button class=&quot;md-fab md-fab-bottom-right&quot; id=&quot;fab&quot; @click=&quot;openDialog(&apos;dialog2&apos;)&quot;&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; id=&quot;custom&quot; @click.native=&quot;openDialog(&apos;dialog1&apos;)&quot;&gt;Custom&lt;/md-button&gt;
&lt;md-button class=&quot;md-fab md-fab-bottom-right&quot; id=&quot;fab&quot; @click.native=&quot;openDialog(&apos;dialog2&apos;)&quot;&gt;
&lt;md-icon&gt;add&lt;/md-icon&gt;
&lt;/md-button&gt;
</code-block>
@ -391,8 +391,8 @@
ref="dialog4">
</md-dialog-alert>
<md-button class="md-primary md-raised" @click="openDialog('dialog3')">Alert</md-button>
<md-button class="md-primary md-raised" @click="openDialog('dialog4')">Alert with HTML</md-button>
<md-button class="md-primary md-raised" @click.native="openDialog('dialog3')">Alert</md-button>
<md-button class="md-primary md-raised" @click.native="openDialog('dialog4')">Alert with HTML</md-button>
</div>
<div slot="code">
@ -413,8 +413,8 @@
ref=&quot;dialog4&quot;&gt;
&lt;/md-dialog-alert&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click=&quot;openDialog(&apos;dialog3&apos;)&quot;&gt;Alert&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click=&quot;openDialog(&apos;dialog4&apos;)&quot;&gt;Alert with HTML&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click.native=&quot;openDialog(&apos;dialog3&apos;)&quot;&gt;Alert&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click.native=&quot;openDialog(&apos;dialog4&apos;)&quot;&gt;Alert with HTML&lt;/md-button&gt;
</code-block>
<code-block lang="javascript">
@ -460,7 +460,7 @@
ref="dialog5">
</md-dialog-confirm>
<md-button class="md-primary md-raised" @click="openDialog('dialog5')">Confirm</md-button>
<md-button class="md-primary md-raised" @click.native="openDialog('dialog5')">Confirm</md-button>
</div>
<div slot="code">
@ -475,7 +475,7 @@
ref=&quot;dialog5&quot;&gt;
&lt;/md-dialog-confirm&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click=&quot;openDialog(&apos;dialog5&apos;)&quot;&gt;Confirm&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click.native=&quot;openDialog(&apos;dialog5&apos;)&quot;&gt;Confirm&lt;/md-button&gt;
</code-block>
<code-block lang="javascript">
@ -523,7 +523,7 @@
ref="dialog6">
</md-dialog-prompt>
<md-button class="md-primary md-raised" @click="openDialog('dialog6')">Prompt</md-button>
<md-button class="md-primary md-raised" @click.native="openDialog('dialog6')">Prompt</md-button>
</div>
<div slot="code">
@ -537,7 +537,7 @@
ref=&quot;dialog6&quot;&gt;
&lt;/md-dialog-prompt&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click=&quot;openDialog(&apos;dialog6&apos;)&quot;&gt;Prompt&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click.native=&quot;openDialog(&apos;dialog6&apos;)&quot;&gt;Prompt&lt;/md-button&gt;
</code-block>
<code-block lang="javascript">

8
docs/src/pages/components/ImageLoader.vue
View file

@ -30,8 +30,8 @@
<div slot="example">
<example-box card-title="Default">
<div slot="demo">
<md-button class="md-primary md-raised" @click="loadImage">Load Image</md-button>
<md-button class="md-primary md-raised" @click="clearImage">Clear Image</md-button>
<md-button class="md-primary md-raised" @click.native="loadImage">Load Image</md-button>
<md-button class="md-primary md-raised" @click.native="clearImage">Clear Image</md-button>
<div>
<md-image :md-src="src"></md-image>
@ -40,8 +40,8 @@
<div slot="code">
<code-block lang="xml">
&lt;md-button class=&quot;md-primary md-raised&quot; @click=&quot;loadImage&quot;&gt;Load Image&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click=&quot;clearImage&quot;&gt;Clear Image&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click.native=&quot;loadImage&quot;&gt;Load Image&lt;/md-button&gt;
&lt;md-button class=&quot;md-primary md-raised&quot; @click.native=&quot;clearImage&quot;&gt;Clear Image&lt;/md-button&gt;
&lt;div&gt;
&lt;md-image :md-src=&quot;src&quot;&gt;&lt;/md-image&gt;

4
docs/src/pages/components/Select.vue
View file

@ -209,7 +209,7 @@
</md-input-container>
</div>
<md-button class="md-raised md-primary" @click="setPulpFiction">Set Pulp Fiction</md-button>
<md-button class="md-raised md-primary" @click.native="setPulpFiction">Set Pulp Fiction</md-button>
</div>
<div slot="code">
@ -279,7 +279,7 @@
&lt;/md-input-container&gt;
&lt;/div&gt;
&lt;md-button class=&quot;md-raised md-primary&quot; @click=&quot;setPulpFiction&quot;&gt;Set Pulp Fiction&lt;/md-button&gt;
&lt;md-button class=&quot;md-raised md-primary&quot; @click.native=&quot;setPulpFiction&quot;&gt;Set Pulp Fiction&lt;/md-button&gt;
</code-block>
<code-block lang="javascript">

12
docs/src/pages/components/Sidenav.vue
View file

@ -120,7 +120,7 @@
<div slot="demo">
<div class="phone-viewport">
<md-toolbar>
<md-button class="md-icon-button" @click="toggleLeftSidenav">
<md-button class="md-icon-button" @click.native="toggleLeftSidenav">
<md-icon>menu</md-icon>
</md-button>
@ -128,7 +128,7 @@
</md-toolbar>
<div>
<md-button class="md-raised md-accent" @click="toggleRightSidenav">Toggle right</md-button>
<md-button class="md-raised md-accent" @click.native="toggleRightSidenav">Toggle right</md-button>
<p>Open console to see the events</p>
</div>
@ -149,7 +149,7 @@
</div>
</md-toolbar>
<md-button class="md-raised md-accent" @click="closeRightSidenav">Close</md-button>
<md-button class="md-raised md-accent" @click.native="closeRightSidenav">Close</md-button>
</md-sidenav>
</div>
</div>
@ -158,7 +158,7 @@
<code-block lang="xml">
&lt;div class=&quot;phone-viewport&quot;&gt;
&lt;md-toolbar&gt;
&lt;md-button class=&quot;md-icon-button&quot; @click=&quot;toggleLeftSidenav&quot;&gt;
&lt;md-button class=&quot;md-icon-button&quot; @click.native=&quot;toggleLeftSidenav&quot;&gt;
&lt;md-icon&gt;menu&lt;/md-icon&gt;
&lt;/md-button&gt;
@ -166,7 +166,7 @@
&lt;/md-toolbar&gt;
&lt;div&gt;
&lt;md-button class=&quot;md-raised md-accent&quot; @click=&quot;toggleRightSidenav&quot;&gt;Toggle right&lt;/md-button&gt;
&lt;md-button class=&quot;md-raised md-accent&quot; @click.native=&quot;toggleRightSidenav&quot;&gt;Toggle right&lt;/md-button&gt;
&lt;p&gt;Open console to see the events&lt;/p&gt;
&lt;/div&gt;
@ -187,7 +187,7 @@
&lt;/div&gt;
&lt;/md-toolbar&gt;
&lt;md-button class=&quot;md-raised md-accent&quot; @click=&quot;closeRightSidenav&quot;&gt;Close&lt;/md-button&gt;
&lt;md-button class=&quot;md-raised md-accent&quot; @click.native=&quot;closeRightSidenav&quot;&gt;Close&lt;/md-button&gt;
&lt;/md-sidenav&gt;
&lt;/div&gt;
</code-block>

4
docs/src/pages/components/Snackbar.vue
View file

@ -107,7 +107,7 @@
<md-snackbar :md-position="vertical + ' ' + horizontal" ref="snackbar" :md-duration="duration">
<span>Connection timeout. Showing limited messages.</span>
<md-button class="md-accent" md-theme="light-blue" @click="$refs.snackbar.close()">Retry</md-button>
<md-button class="md-accent" md-theme="light-blue" @click.native="$refs.snackbar.close()">Retry</md-button>
</md-snackbar>
</form>
</div>
@ -140,7 +140,7 @@
&lt;md-snackbar :md-position=&quot;vertical + &#039; &#039; + horizontal&quot; ref=&quot;snackbar&quot; :md-duration=&quot;duration&quot;&gt;
&lt;span&gt;Connection timeout. Showing limited messages.&lt;/span&gt;
&lt;md-button class=&quot;md-accent&quot; md-theme=&quot;light-blue&quot; @click=&quot;$refs.snackbar.close()&quot;&gt;Retry&lt;/md-button&gt;
&lt;md-button class=&quot;md-accent&quot; md-theme=&quot;light-blue&quot; @click.native=&quot;$refs.snackbar.close()&quot;&gt;Retry&lt;/md-button&gt;
&lt;/md-snackbar&gt;
&lt;/form&gt;
</code-block>

24
docs/src/pages/components/Toolbar.vue
View file

@ -420,7 +420,7 @@
<div class="phone-viewport complete-example">
<md-whiteframe md-tag="md-toolbar" md-elevation="2" md-theme="light-blue" class="md-large">
<div class="md-toolbar-container">
<md-button class="md-icon-button" @click="$refs.sidenav.toggle()">
<md-button class="md-icon-button" @click.native="$refs.sidenav.toggle()">
<md-icon>menu</md-icon>
</md-button>
@ -590,23 +590,23 @@
</md-toolbar>
<md-list>
<md-list-item @click="$refs.sidenav.toggle()" class="md-primary">
<md-list-item @click.native="$refs.sidenav.toggle()" class="md-primary">
<md-icon>insert_drive_file</md-icon> <span>My files</span>
</md-list-item>
<md-list-item @click="$refs.sidenav.toggle()">
<md-list-item @click.native="$refs.sidenav.toggle()">
<md-icon>people</md-icon> <span>Shared with me</span>
</md-list-item>
<md-list-item @click="$refs.sidenav.toggle()">
<md-list-item @click.native="$refs.sidenav.toggle()">
<md-icon>access_time</md-icon> <span>Recent</span>
</md-list-item>
<md-list-item @click="$refs.sidenav.toggle()">
<md-list-item @click.native="$refs.sidenav.toggle()">
<md-icon>start</md-icon> <span>Starred</span>
</md-list-item>
<md-list-item @click="$refs.sidenav.toggle()">
<md-list-item @click.native="$refs.sidenav.toggle()">
<md-icon>delete</md-icon> <span>Trash</span>
</md-list-item>
</md-list>
@ -619,7 +619,7 @@
&lt;div class=&quot;phone-viewport complete-example&quot;&gt;
&lt;md-whiteframe md-tag=&quot;md-toolbar&quot; md-elevation=&quot;2&quot; md-theme=&quot;light-blue&quot; class=&quot;md-large&quot;&gt;
&lt;div class=&quot;md-toolbar-container&quot;&gt;
&lt;md-button class=&quot;md-icon-button&quot; @click=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-button class=&quot;md-icon-button&quot; @click.native=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-icon&gt;menu&lt;/md-icon&gt;
&lt;/md-button&gt;
@ -789,23 +789,23 @@
&lt;/md-toolbar&gt;
&lt;md-list&gt;
&lt;md-list-item @click=&quot;$refs.sidenav.toggle()&quot; class=&quot;md-primary&quot;&gt;
&lt;md-list-item @click.native=&quot;$refs.sidenav.toggle()&quot; class=&quot;md-primary&quot;&gt;
&lt;md-icon&gt;insert_drive_file&lt;/md-icon&gt; &lt;span&gt;My files&lt;/span&gt;
&lt;/md-list-item&gt;
&lt;md-list-item @click=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-list-item @click.native=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-icon&gt;people&lt;/md-icon&gt; &lt;span&gt;Shared with me&lt;/span&gt;
&lt;/md-list-item&gt;
&lt;md-list-item @click=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-list-item @click.native=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-icon&gt;access_time&lt;/md-icon&gt; &lt;span&gt;Recent&lt;/span&gt;
&lt;/md-list-item&gt;
&lt;md-list-item @click=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-list-item @click.native=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-icon&gt;start&lt;/md-icon&gt; &lt;span&gt;Starred&lt;/span&gt;
&lt;/md-list-item&gt;
&lt;md-list-item @click=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-list-item @click.native=&quot;$refs.sidenav.toggle()&quot;&gt;
&lt;md-icon&gt;delete&lt;/md-icon&gt; &lt;span&gt;Trash&lt;/span&gt;
&lt;/md-list-item&gt;
&lt;/md-list&gt;