centering icons

This commit is contained in:
pablohpsilva 2017-05-28 21:49:55 -03:00
parent 4e22b4b4d0
commit d49b4530d2
2 changed files with 22 additions and 2 deletions

View file

@ -559,7 +559,10 @@
:mdItem="row"
md-selection>
<md-table-cell v-for="(column, columnIndex) in row" :key="columnIndex" :md-numeric="columnIndex !== 'dessert' && columnIndex !== 'comment' && columnIndex !== 'type'">
<span v-if="columnIndex === 'comment'">{{ column }}</span>
<template v-if="columnIndex === 'comment'">
<span>{{ column }}</span>
<md-icon>message</md-icon>
</template>
<md-button class="md-icon-button" v-if="columnIndex === 'comment'">
<md-icon>edit</md-icon>

View file

@ -151,8 +151,18 @@
&.md-numeric {
text-align: right;
.md-icon {
margin: 0;
}
.md-table-cell-container {
justify-content: flex-end;
display: flex;
justify-content: center;
align-items: center;
.md-icon {
margin: 0;
}
}
}
@ -182,6 +192,7 @@
.md-icon {
$size: 18px;
margin: auto;
width: $size;
min-width: $size;
@ -392,3 +403,9 @@
flex: 1;
}
}
.md-table .md-table-cell.md-has-action .md-table-cell-container {
display: flex;
justify-content: center;
align-items: center;
}