Hopiu/vue-material
1
0
Fork 0
mirror of https://github.com/Hopiu/vue-material.git synced 2026-03-16 22:10:27 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Merge remote-tracking branch 'origin/improvement/mdList' into develop

Browse source 
* origin/improvement/mdList:
  enable multiple expansions in mdList #442
This commit is contained in:
Marcos Moura 2017-02-07 16:36:34 -02:00
commit acc97d6c6c
3 changed files with 20 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
docs/src/pages/components/List.vue
View file

@ -70,6 +70,13 @@
<md-table-cell><code>Boolean</code></md-table-cell>
<md-table-cell>Disable the item and prevent his actions. Default <code>false</code></md-table-cell>
</md-table-row>
</md-table-row>
<md-table-row>
<md-table-cell>md-expand-multiple</md-table-cell>
<md-table-cell><code>Boolean</code></md-table-cell>
<md-table-cell>Allow multiple items be expanded in same time in md-list. Default <code>false</code></md-table-cell>
</md-table-row>
</md-table-body>
</md-table>
@ -845,7 +852,7 @@
<div slot="demo">
<div class="phone-viewport">
<md-list>
<md-list-item>
<md-list-item md-expand-multiple>
<md-icon>whatshot</md-icon>
<span>News</span>
@ -858,7 +865,7 @@
</md-list-expand>
</md-list-item>
<md-list-item>
<md-list-item md-expand-multiple>
<md-icon>videogame_asset</md-icon>
<span>Games</span>
@ -871,7 +878,7 @@
</md-list-expand>
</md-list-item>
<md-list-item>
<md-list-item md-expand-multiple>
<md-icon>video_library</md-icon>
<span>Video</span>

4
src/components/mdList/mdList.scss
View file

@ -288,6 +288,10 @@
}
}
&.md-active + .md-active:before {
background: none;
}
> .md-list-item-container .md-list-expand-indicator {
transform: rotateZ(180deg) translate3D(0, 0, 0);
}

8
src/components/mdList/mdListItemExpand.vue
View file

@ -20,7 +20,8 @@
export default {
name: 'md-list-item',
props: {
disabled: Boolean
disabled: Boolean,
mdExpandMultiple: Boolean
},
data() {
return {
@ -67,7 +68,10 @@
});
},
toggleExpandList() {
this.resetSiblings();
if (!this.mdExpandMultiple) {
this.resetSiblings();
}
this.calculatePadding();
this.active = !this.active;
},