• This repository has been archived on 22/Jun/2022
  • Stars
    star
    181
  • Rank 207,855 (Top 5 %)
  • Language Vue
  • License
    MIT License
  • Created almost 6 years ago
  • Updated over 1 year ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

A Vue.js 2 UI component library.

atlas

Documentation and examples at https://vue-atlas.com

Installation and usage

$ yarn add vue-atlas
# or
$ npm install vue-atlas

Usage

Import everything

The minified stylesheet is roughly 200kb (~30kb gzipped). If this worries you, please see below how to import only the components you require for a smaller bundle.

// Wherever your Vue entrypoint is.
import Va from 'vue-atlas'
import 'vue-atlas/dist/vue-atlas.css'

Vue.use(Va, 'en') // or 'es', 'fr', 'ru'

Import something specific

// You will need sass-loader and node-sass for this.
import { VaDatepicker } from 'vue-atlas/src/Datepicker'

Vue.use(VaDatepicker)

// The Datepicker component will check for the presence
// of the VaLocale prototype to decide how to display content.
Vue.prototype.VaLocale = 'fr' // default 'en'

If you want to use the atlas color variables in your own project's components, modify your project's vue.config.js and point css.loaderOptions.sass.prependData to node_modules/vue-atlas/src/style/_colors.scss.

vue.config.js

module.exports = {
  css: {
    loaderOptions: {
      sass: {
        prependData: `@import "@/../node_modules/vue-atlas/src/style/_colors.scss";`
      }
    }
  }
}