tabler / tabler-vue

Vue.js components and demo for the Tabler UI theme.

tabler-vue

tabler-vue is a collection of Vue.js components for implementing Tabler themed elements in your project. Tabler is a free and open-source HTML Dashboard UI Kit built on Bootstrap 4.

Installation

TODO: Describe the installation process

Usage

TODO: Write usage instructions

Contributing

Contributions are welcome. See CONTRIBUTING.md.

The package is made up of 2 main folders:

• /src
• /example is a vue-cli webpack based demo website

To setup and run a local copy:

1. Clone this repo with git clone https://github.com/tabler/tabler-vue.git
2. Run yarn install in root folder
3. Run yarn dev

You should now be up and running with live browser reloading of the example website while you work on Tabler Vue components in the /src folder.

When you're done working on your changes, submit a PR with the details and include a screenshot if you've changed anything visually.

History

TODO: Write history

Credits

TODO: Write credits

License

Released under the MIT License. See LICENSE

tabler-vue's Issues

Implement Avatar component

Implement Progress component

Implement Form component

Is is production ready?

hi there,

can we use this in production or not advisable yet?

if yes, where do I get the npm version please?

Implement AccountDropdown component

Implement Stamp component

Implement Table component

Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Table

Implement Carousel component

Project todo list

Hi there, this is a non-exhaustive, inaccurate and messy list that might be useful for a roadmap.
Thanks to @isneezy we already have a project base looking like this :

Components

• Alert
• Card
  • Progress Card
  • Stamp Card
  • Stats Card
• Dropdown
• Nav
• Page
• Site
• Account dropdown
• Notification
• Table
• Icon
• Loader
• Pricing Card
• Tag
• Stamp
• Progress
• Form
  • Checkbox
  • ColorCheck
  • DatePicker
  • Input
  • Switch
• Avatar
• Chart (don't know if we should do this may be there are some vue implementations that we should recommend)
• Maps
• Store
• Blog
• Carousel
• Gallery

Readme

• Installation
• Usage
• Contributing
• History
• Credits
• License

Project related

• code linting, code style & editorconfig
• github page configuration (part of it is already been done - assets are being loaded from wrong url/path)
• unit tests (don't know if it is really necessary)

I will keep this list up to date with everything you suggest.
(Btw this issue could be moved in GitHub Projects)

Implement Alert component

Read https://tabler.github.io/tabler/docs/alerts.html
Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Alert

Implement Page component

Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Page

Implement Chart component

Register to npm registry

Hello, I think we should register this package to the npm registry, this will help us to mark this package as dependency of our main project, and we can link with npm o yarn to develop in parallel!
For now we could change the version to lets say 1.0.0-alpha so people will now that it is not production ready

Implement Notification component

Implement Card component

Read https://tabler.github.io/tabler/docs/cards.html
Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Card

Implement Tag component

Update structure for project

Hey tabler admin, please up structure for project, my team want to contribute.

Implement Icon component

Implement Loader component

Implement Store component

(!) The 'extends' Babel helper is used more than once in your code.

This message is appearing whenever i try to build or run the dev server
(!) The 'extends' Babel helper is used more than once in your code. It's strongly recommended that you use the "external-helpers" plugin or the "es2015-rollup" preset. See https://github.com/rollup/rollup-plugin-babel#configuring-babel for more information

Implement PricingCard component

Implement Dropdown component

Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Dropdown

Implement Map component

How should we handle CSS styling

How would you like to handle styling? The "Vue way" to do this is to take all of the styles necessary for a particular component and place it in with that component. Alternatively, we could keep all styles in a central stylesheet or some mix of both.

I would suggest that resets and page-wide styles are in a central stylesheet and component-specific styles remain with those components.

Implement Site component

Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Site

Implement Nav component

Existing code https://github.com/tabler/tabler-vue/tree/master/src/components/Nav

Implement Blog component

Implement Gallery component

When is the first version released?

Hi,
Is there any release plan for this project?