智慧物流>> Vootstrap>> 返回
项目作者： perfectly-simplified

项目描述 ：
Great combination of Vue and Bootstrap
高级语言： JavaScript
项目地址: git://github.com/perfectly-simplified/Vootstrap.git
创建时间： 2019-05-21T20:12:06Z
项目社区：https://github.com/perfectly-simplified/Vootstrap
开源协议：Apache License 2.0
下载


Vue + Bootstrap = Vootstrap








👓 At a Glance

Vootstrap is a collection of Vue.js components with Bootstrap under the hood.

While Vootstrap is a carefully thought-out combination of Vue and Bootstrap frameworks, it gives you an incredible simplicity and makes your frontend programming experience much more enjoyable 🎉

It works well for both websites and hybrid mobile apps. You can use popular components from Bootstrap filled with the power of reactive programming given by Vue.

The main advantage of Vootstrap is the syntax. The entire library is built with keeping in mind the idea of unbelievable flexibility. It’s easy enough for beginners and helpful for experienced developers.

🚀 How to Get Started

Copy vootstrap.js to your project.

✔ Requirements

⌨ Usage

Each Vootstrap component is actually an HTML tag that you can simply put into your layout.

For now, Button is the only component supported by Vootstrap. New components will be supported soon.

Also, take a look at demo app which gives the base understanding of amazing Vootstrap principles.

Buttons

Simple primary button:

  1. <vt-button-primary title="My button"></vt-button-primary>

The same button outlined:

  1. <vt-button-primary-outline title="My button"></vt-button-primary-outline>

You can also change the size:

  1. <vt-button-success-outline-small title="Small button"></vt-button-success-outline-small>
  2. <vt-button-warning-outline-large title="Large button"></vt-button-warning-outline-large>

One of the fundamental Vootstrap features is ability to swap tag name components. All the examples below are correct:

  1. <vt-button-primary-outline-large title="My button"></vt-button-primary-outline-large>
  2. <vt-button-primary-large-outline title="My button"></vt-button-primary-large-outline>
  3. <vt-button-outline-primary-large title="My button"></vt-button-outline-primary-large>
  4. <vt-button-primary-large title="My button"></vt-button-primary-large>
  5. <vt-button-large-primary title="My button"></vt-button-large-primary>

So you don’t need to use CSS classes like btn-primary, btn-lg, etc. Just put button’s style information into the tag and use it like a regular button.

⚖ License

Vootstrap is available under the Apache 2.0 license. See the LICENSE file for more info.