Skip to content

Latest commit

 

History

History
60 lines (46 loc) · 1.4 KB

README.md

File metadata and controls

60 lines (46 loc) · 1.4 KB
Raw

VueBottomDialog

Simple mobile customizable dialog.

DEMO

Sandbox: https://codesandbox.io/s/2h39y

Installation

1. Install

yarn add vue-bottom-dialog
# or
npm i vue-bottom-dialog --save

2. Plug-in

import VueBottomDialog from 'vue-bottom-dialog'

Vue.use(VueBottomDialog)

3. Use in your components

Component can be controlled with a v-model.

<template>
  <vue-bottom-dialog v-model="dialog" />
</template>

<script>
  export default {
    data: () => {
        return {
          dialog: true,
        };
      },
  };
</script>

Properties

Name Required Type Default Description
height false Number 100 Dialog have fixed height
backgroundColor false String #757575 Background color
overlayColor false String rgba(255, 255, 255, 0.5) Outside dialog background color
hideIndent false Boolean false If true, indent will be hidden
indentColor false String #FFF Color of indent
topRadius false String 20px Radius of top corners

License

MIT