Commit 9c5d96bb authored by Adrian's avatar Adrian

Optimizando el tamaño

parent 11ea6528
......@@ -10,11 +10,8 @@
>
{{ $store.state.snackbar.message }}
<template v-slot:action="{}">
<v-btn
icon
@click.native.prevent="remove"
>
<v-icon color="white">close</v-icon>
<v-btn icon @click.native.prevent="remove">
<v-icon color="white">{{ icons.mdiClose }}</v-icon>
</v-btn>
</template>
</v-snackbar>
......@@ -22,57 +19,64 @@
</template>
<script>
import { mdiClose } from '@mdi/js';
export default {
data: () => ({
icons: {
mdiClose
}
}),
methods: {
remove () {
remove() {
this.$store.commit('setSnackbar', false);
}
},
destroyed () {
destroyed() {
this.$store.commit('setSnackbar', false);
}
};
</script>
<style lang="scss">
@import '../../scss/variables.scss';
.snackbar--icon {
display: inline-flex;
@import '../../scss/variables.scss';
.snackbar--icon {
display: inline-flex;
color: $white !important;
i {
padding-left: 10px;
color: $white !important;
i {
padding-left: 10px;
color: $white !important;
}
}
.snackbar--success {
.v-snack__wrapper {
border-radius: 7px;
background: $success !important;
font-size: .8rem;
max-width: 400px;
}
}
.snackbar--success {
.v-snack__wrapper {
border-radius: 7px;
background: $success !important;
font-size: 0.8rem;
max-width: 400px;
}
.snackbar--info {
.v-snack__wrapper {
border-radius: 7px;
background: $info !important;
font-size: .8rem;
max-width: 400px;
}
}
.snackbar--info {
.v-snack__wrapper {
border-radius: 7px;
background: $info !important;
font-size: 0.8rem;
max-width: 400px;
}
.snackbar--error {
.v-snack__wrapper {
border-radius: 7px;
background: $error !important;
font-size: .8rem;
max-width: 400px;
}
}
.snackbar--error {
.v-snack__wrapper {
border-radius: 7px;
background: $error !important;
font-size: 0.8rem;
max-width: 400px;
}
.snackbar--warning {
.v-snack__wrapper {
border-radius: 7px;
background: $warning !important;
font-size: .8rem;
max-width: 400px;
}
}
.snackbar--warning {
.v-snack__wrapper {
border-radius: 7px;
background: $warning !important;
font-size: 0.8rem;
max-width: 400px;
}
}
</style>
<template>
<v-dialog v-model="show" persistent content-class="dialog--alert" :max-width="width">
<v-card>
<v-card-title class="title--dialog"><v-icon size="20" color="warning">warning</v-icon> Confirmar</v-card-title>
<v-card-title class="title--dialog"
><v-icon size="20" color="warning" class="mr-2">{{ icons.mdiAlertDecagram }}</v-icon>
Confirmar</v-card-title
>
<v-card-text v-html="text" class="pt-0"></v-card-text>
<v-card-actions>
<v-spacer></v-spacer>
<v-btn @click.native="cancel()" id="btn-confirm-selected-cancel">{{ textCancel }}</v-btn>
<v-btn color="primary" @click.native="ok()" id="btn-confirm-selected-ok">{{ textOk }}</v-btn>
<v-btn color="primary" @click.native="ok()" id="btn-confirm-selected-ok">{{
textOk
}}</v-btn>
</v-card-actions>
</v-card>
</v-dialog>
......@@ -14,16 +19,22 @@
<script>
import { mapState } from 'vuex';
import { mdiAlertDecagram } from '@mdi/js';
export default {
mounted () {
data: () => ({
icons: {
mdiAlertDecagram
}
}),
mounted() {
const el = document.querySelector('.dialog--alert');
if (el) {
el.parentNode.style.zIndex = 100;
}
},
methods: {
ok () {
ok() {
const { confirm } = this.$store.state;
confirm.show = false;
this.$store.commit('CLOSE_CONFIRM');
......@@ -32,7 +43,7 @@ export default {
confirm.callbackOk();
}
},
cancel () {
cancel() {
const { confirm } = this.$store.state;
confirm.show = false;
this.$store.commit('CLOSE_CONFIRM');
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment