Skip to content
🎨 Vue.js components implementing Microsoft Fluent Design
Branch: master
Clone or download
arturmiz feat(dialog): default button support (#56)
* feat(dialog): default button support

* test(dialog): fixed for cases without primary button

* test(dialog): covered default button focus behavior

* docs(dialog): default button examples
Latest commit 0036354 Feb 28, 2019
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github
.vscode chore: line endings consistency to be LF May 8, 2018
__tests__ feat(dialog): default button support (#56) Feb 28, 2019
docs feat(dialog): default button support (#56) Feb 28, 2019
src feat(dialog): default button support (#56) Feb 28, 2019
.babelrc build: babel bumped up to v7 (#31) Sep 19, 2018
.browserslistrc
.editorconfig chore: line endings consistency to be LF May 8, 2018
.eslintignore build: jest as testing framework Feb 7, 2018
.eslintrc.js
.gitattributes chore: line endings consistency to be LF May 8, 2018
.gitignore
.npmignore ci: appveyor integration May 19, 2018
.npmrc chore: prevent from generating package-lock file as yarn used Jan 5, 2019
.travis.yml
CHANGELOG.md chore: release v0.5.0 Jan 29, 2019
LICENSE
README.md
azure-pipelines.yml
commitlint.config.js feat(dialog): initial implementation (#45) Jan 15, 2019
jest.config.json test: general and single component installation covered (#8) Jun 4, 2018
package.json
postcss.config.js build: added PostCSS to transform styles (#28) Aug 31, 2018
rollup.config.js
yarn.lock build: eslint v5 upgrade (#52) Feb 5, 2019

README.md

Vuent

Vuent

Build Status Build Status codecov License Version Downloads in total

Vuent is a set of reusable UI components for Vue created according to Microsoft Fluent Design, in particular its official variation about building Universal Windows Platform (UWP) applications.

The project aims to help developers build web or UWP apps with Fluent's look'n'feel leveraging Vue as a framework for UI/view layer.

How to use

Quickstart

The following snippets can get you up and running with simple demo containing basic text field:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8" />

  <title>Vuent Demo</title>

  <link href="https://unpkg.com/vuent/dist/vuent.css" type="text/css" rel="stylesheet" media="screen" />

  <script src="https://unpkg.com/vue@2.5.13/dist/vue.js" defer></script>
  <script src="https://unpkg.com/vuent/dist/vuent.umd.js" defer></script>
  <script src="main.js" defer></script>
</head>
<body>
  <div id="app">
    <p>{{ message }}</p>

    <vnt-input v-model="message" label="Text field"></vnt-input>
  </div>
</body>
</html>
// main.js
var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vuent!'
  }
});

For more details visit the Vuent's website - https://vuentjs.org.

npm / Yarn

Go to your project's directory and run in terminal:

npm install vuent --save # OR yarn add vuent

Once Vuent is installed in your project, somewhere in your JavaScript code use it as follows:

import Vue from 'vue';
import Vuent from 'vuent';

Vue.use(Vuent);

Vue CLI 3

If you're using Vue CLI 3 in your project, simply run in terminal:

vue add vuent

Then in your project's main file tell Vue to use Vuent:

Vue.use(Vuent);

Documentation

Documentation and playground with live examples are available on the Vuent's website - https://vuentjs.org.

Changelog

Changes for released versions are documented in CHANGELOG file.

Contributing

Any contribution is more than welcome! More details can be found in CONTRIBUTING file.

License

Vuent is MIT licensed.

You can’t perform that action at this time.