improve chips theme

This commit is contained in:
Marcos Moura 2016-12-27 15:20:18 -02:00
parent 2c821cab0f
commit ff9dbb6c18
3 changed files with 9 additions and 28 deletions

View file

@ -2,7 +2,7 @@
&.md-chip {
background-color: #{'BACKGROUND-CONTRAST-0.12'};
&:not(.md-disabled) {
&.md-deletable {
&:hover,
&:focus {
background-color: #{'BACKGROUND-CONTRAST-0.54'};
@ -22,22 +22,4 @@
}
}
}
.md-chips.md-static {
.md-chip:not(.md-disabled) {
&:active {
box-shadow: none !important;
}
&:hover,
&:focus {
background-color: #{'BACKGROUND-CONTRAST-0.12'};
color: #{'BACKGROUND-CONTRAST-0.87'};
.md-delete {
color: #{'BACKGROUND-CONTRAST-0.87'};
}
}
}
}
}

View file

@ -17,9 +17,9 @@
:id="inputId"
:name="mdInputName"
:disabled="disabled"
@keyup.native.delete="deleteLastChip"
@keyup.native.enter="selectChip"
@keyup.native.186="selectChip"
@keydown.native.delete="deleteLastChip"
@keydown.native.enter="selectChip"
@keydown.native.186="selectChip"
tabindex="0"
ref="input">
</md-input>

View file

@ -68,7 +68,10 @@
},
methods: {
removeElement() {
this.rootElement.removeChild(this.snackbarElement);
if (this.rootElement.contains(this.snackbarElement)) {
this.snackbarElement.querySelector('.md-ripple').classList.remove('md-active');
this.rootElement.removeChild(this.snackbarElement);
}
},
open() {
if (manager.current) {
@ -86,11 +89,7 @@
if (this.$refs.container) {
const removeElement = () => {
this.$refs.container.removeEventListener(transitionEndEventName, removeElement);
if (this.rootElement.contains(this.snackbarElement)) {
this.snackbarElement.querySelector('.md-ripple').classList.remove('md-active');
this.removeElement();
}
this.removeElement();
};
manager.current = null;