https://github.com/michitaro/vue-window

Window component for vue2
https://github.com/michitaro/vue-window

component pc-environment typescript vue window

Last synced: 19 days ago
JSON representation

Window component for vue2

• Host: GitHub
• URL: https://github.com/michitaro/vue-window
• Owner: michitaro
• License: mit
• Created: 2017-09-12T08:20:47.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2022-05-22T13:35:17.000Z (over 2 years ago)
• Last Synced: 2024-04-23T21:27:40.070Z (8 months ago)
• Topics: component, pc-environment, typescript, vue, window
• Language: TypeScript
• Homepage: https://github.com/michitaro/vue-window
• Size: 1.44 MB
• Stars: 296
• Watchers: 14
• Forks: 58
• Open Issues: 22
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesome-os - vue-window - window/?Sample31) | (<img src="media/icons8-windows-11-48.png" alt="logo" width="36"/> WINDOWS)

README

        
# vue-window

😣 This library is not compatible with Vue3! 😣

## Introduction

Recent web applications are mainly for mobile environments. Therefore window UI is no longer mainstream.

However, window UI is still useful for professional web applications for PC environments.

This package is an implementation of window UI for PC environment as a Vue Component.

### [Working Demo](https://michitaro.github.io/vue-window)

### Features

* Window component for vue2

* Windows are draggable

* Automatic z-index control

* Resizable

* z-index group

* Configurable color theme

* Built-in 3 color themes

* Open / Close animation

* Tested on Safari10, Chrome60, Firefox55, IE11, Edge38 For PCs 

* iOS Support 🎉

![Screenshot](./docs/screenshot.png)

# Usage

## Install

```sh

npm install --save @hscmap/vue-window

```

## Setup

### ES6 / TypeScript

```typescript

import Vue from 'vue'

import * as VueWindow from '@hscmap/vue-window'

Vue.use(VueWindow)

```

### CommonJS

```javascript

var Vue = require('vue')

Vue.use(require('@hscmap/vue-window'))

```

# Example

```html

    

        

            Parameters:

            

                α

                

            

            

                β

                

            

        

    

```

Other examples are available [here](http://michitaro.github.io/vue-window/).

see also [@hscmap/vue-menu](https://github.com/michitaro/vue-menu).

This is a menu UI component for vue2 with the same color themes.

# Contributing

Any comments, suggestions or PRs are welcome 😀