https://github.com/nvms/vue-atlas

A Vue.js 2 UI component library.
https://github.com/nvms/vue-atlas

component-library javascript ui vue vue2 vuejs vuejs-components vuejs2

Last synced: about 2 months ago
JSON representation

A Vue.js 2 UI component library.

• Host: GitHub
• URL: https://github.com/nvms/vue-atlas
• Owner: nvms
• License: mit
• Archived: true
• Created: 2018-07-07T05:01:47.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2023-03-13T10:13:19.000Z (over 1 year ago)
• Last Synced: 2024-09-21T10:06:15.314Z (about 2 months ago)
• Topics: component-library, javascript, ui, vue, vue2, vuejs, vuejs-components, vuejs2
• Language: Vue
• Homepage:
• Size: 9.16 MB
• Stars: 180
• Watchers: 8
• Forks: 22
• Open Issues: 42
• Metadata Files:
  • Readme: README.md
  • Contributing: .github/CONTRIBUTING.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# atlas

![](https://img.shields.io/npm/v/vue-atlas.svg?colorA=57D9A3&colorB=666666)

Documentation and examples at [https://vue-atlas.com](https://vue-atlas.com)

## Installation and usage

```bash

$ 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.

```javascript

// 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

```javascript

// 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](https://github.com/nvms/vue-atlas/blob/master/src/style/_colors.scss)

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`

```javascript

module.exports = {

  css: {

    loaderOptions: {

      sass: {

        prependData: `@import "@/../node_modules/vue-atlas/src/style/_colors.scss";`

      }

    }

  }

}

```