StarMC/Astral-nook
StarMC/Astral-nook
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Lets be smarter with modals here...

Browse source
This commit is contained in:
Dane Everitt 2019-02-16 17:15:56 -08:00
parent b6773b56c1
commit 767e466fd8
No known key found for this signature in database
GPG key ID: EEA66103B3D71F53
5 changed files with 54 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

9
resources/assets/scripts/components/core/Modal.vue
View file

@ -2,7 +2,7 @@
<transition name="modal">
<div class="modal-mask" v-show="show" v-on:click="close">
<div class="modal-container" @click.stop>
<div v-on:click="close">
<div v-on:click="close" v-if="dismissable">
<Icon name="x"
class="absolute pin-r pin-t m-2 text-neutral-500 cursor-pointer"
aria-label="Close modal"
@ -27,10 +27,11 @@
modalName: {type: String, default: 'modal'},
show: {type: Boolean, default: false},
closeOnEsc: {type: Boolean, default: true},
dismissable: {type: Boolean, default: true},
},
mounted: function () {
if (this.$props.closeOnEsc) {
if (this.$props.dismissable && this.$props.closeOnEsc) {
document.addEventListener('keydown', e => {
if (this.show && e.key === 'Escape') {
this.close();
@ -41,7 +42,9 @@
methods: {
close: function () {
this.$emit('close', this.$props.modalName);
if (this.$props.dismissable) {
this.$emit('close', this.$props.modalName);
}
}
},
});