/
ehsizer
/
VUEblog
Обзор
Документация
Войти
/
ehsizer
/
VUEblog
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
src/Components/UI/MyDialog.vue
63 строки
1001 B
Admin
add modal
04 июн 2024, 23:42
04 июн 2024, 23:42
4245b89
Код
Авторство
О чём код?
<template> <div class="dialog" v-if="show" @click.stop = "hideDialog"> <div @click.stop class="dialog__content"> <slot></slot> </div> </div> </template> <script> export default { name: 'my-dialog', props:{ show:{ type: Boolean, default: false } }, methods:{ hideDialog(){ this.$emit('update:show',false) } } } </script> <style scoped> .dialog{ top:0; bottom: 0; right: 0; left: 0; background: rgba(0,0,0, 0.5); position: fixed; display: flex; } .dialog__content{ margin: auto; background: #fff; border-radius: 12px; min-height: 100px; min-width: 350px; padding: 20px; } @media(max-height: 900px){ .dialog{ top:0; bottom: 0; right: 0; left: 0; background: rgba(0,0,0, 0.5); position: fixed; display: flex; } .dialog__content{ margin: auto auto 90%; background: #fff; border-radius: 12px; min-height: 100px; min-width: 350px; padding: 20px; } } </style>