0.5.5 • Published 6 years ago
vue-device v0.5.5
vue-device
Display your app in a device sized window. Perfect for sharing with clients.
The window is ignored on mobile and tablet devices, including Chrome/Safari Developer Tools
Demo
https://normally.github.io/vue-device/
Install
yarn add vue-device
Usage
import device from 'vue-device'
export default {
components: {
device
},
...
}
After that, wrap your app in the device tag:
<device>
<app/>
</device>
Options
Property | Default | Description |
---|---|---|
type | iPhone8 | Can be any of the available devices |
background | #FFF | Background color |
landscape | false | Display the window in landscape mode |
picker | false | Show device picker above frame |
autoscale | true | Always fit the device in the browser window and scale the content |
border | false | Show a black border around the device |
disabled | false | Disable altogether just as a desktop view |
Example:
<device type='iPhone8' background='#444' autoscale='false' landscape picker border> ... </device>
Authors
- Nic Mulvaney - Normally