https://github.com/gritcode/gritcode-components

Custom components based on Vuestrap.
https://github.com/gritcode/gritcode-components

Last synced: 16 days ago
JSON representation

Custom components based on Vuestrap.

• Host: GitHub
• URL: https://github.com/gritcode/gritcode-components
• Owner: gritcode
• License: mit
• Created: 2015-12-25T23:15:48.000Z (almost 9 years ago)
• Default Branch: master
• Last Pushed: 2017-05-29T10:51:50.000Z (over 7 years ago)
• Last Synced: 2024-10-05T01:17:10.909Z (about 1 month ago)
• Language: JavaScript
• Homepage: http://gritcode.github.io/gritcode-components/#/toast
• Size: 938 KB
• Stars: 204
• Watchers: 15
• Forks: 9
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
Gritcode Components

=========

Gritcode Components extend Bootstrap 4 with [vuestrap](https://github.com/kzima/vuestrap/#readme) web components built with Vue.js and Webpack.

DEMO

=========

[Documentation](http://gritcode.github.io/gritcode-components/#/toast)

QUICK USE

=========

For compiled components, use it within your Vue instance like this:

```js

new Vue({

	el: '#app',

	components: { 'toast': gritcode.toast }

})

```

-- OR --

If you chosen to work with source components, just import* desired component like so:

```js

import toast from 'gritcode-components/src/components/toast'

```

and then load it in your Vue instance:

```js

new Vue({

	el: '#app',

	components: { 'vs-toast': toast }

})

```

*Note: You will need Babel Loader in your Webpack config file to support ES6 syntax.

You can then use icon component in your html, like so:

```html

```

THEMING

=========

To be able to use your app theme with component's scss variables, you will need to use [vuestrap-theme-loader](https://github.com/kzima/vueastrap-theme-loader) in your webpack config file.

```js

npm install vuestrap-theme-loader --save-dev

```

See [vuestrap-starter](https://github.com/kzima/vuestrap-starter) for a webpack config example with theme loader.

TODO

=========

- document events

- testing