https://github.com/snowdogapps/alpaca-ui
Components library of Alpaca design system crafted for ecommerce
https://github.com/snowdogapps/alpaca-ui
hacktoberfest
Last synced: 23 days ago
JSON representation
Components library of Alpaca design system crafted for ecommerce
- Host: GitHub
- URL: https://github.com/snowdogapps/alpaca-ui
- Owner: SnowdogApps
- License: mit
- Created: 2018-09-06T10:20:11.000Z (over 6 years ago)
- Default Branch: develop
- Last Pushed: 2022-08-01T08:12:06.000Z (over 2 years ago)
- Last Synced: 2024-10-29T08:28:26.144Z (6 months ago)
- Topics: hacktoberfest
- Language: JavaScript
- Homepage: https://alpaca-ui.now.sh
- Size: 6.83 MB
- Stars: 19
- Watchers: 16
- Forks: 7
- Open Issues: 36
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
## Alpaca UI
[](https://circleci.com/gh/SnowdogApps/alpaca-ui/tree/develop)
[](https://www.npmjs.com/package/@snowdog/alpaca-ui)
[](https://codecov.io/gh/SnowdogApps/alpaca-ui)
Highly customizable library of responsive UI components crafted for e-commerce. It is based on Vue.js and Alpaca design system.
> ⚠️ This library is currently in an early stage. Expect things to be broken or APIs to change as this project matures. DO NOT USE IT IN PRODUCTION!
## Features
- High customization and performance
- Possibility to override global variables
- Possibility to override components from partials (HTML/JS/SCSS)
- Semantic and accessible code output
- Ready to use with Vue CLI, Vue Storefornt and Nuxt.js
## Getting Started
### Installation
Add Alpaca UI to your project by using Yarn
```bash
yarn add @snowdog/alpaca-ui
```
or NPM
```bash
npm install @snowdog/alpaca-ui
```
### Usage
Import component in your app using named imports:
`import { AButton } from '@snowdog/alpaca-ui'`
```vue
Alpaca button
import { AButton } from '@snowdog/alpaca-ui'
export default {
name: 'MyComponent',
components: AButton
}
```
If you need more flexibility you can take the source:
```vue
import AButton from '@snowdog/alpaca-ui/src/atoms/button/Button.js'
export default {
mixins: [AButton]
}
```
For now, to see all possible cases/modifiers, you should clone and run repo as in Development point, or check .stories.js file in component.
## Browser support
Recent versions of Firefox, Chrome, Edge, Opera, Safari and IE11+.
## Contributing
Read our contributing guide and let's build a better components together.
We welcome all contributions. Please read our [CONTRIBUTING.md](https://github.com/SnowdogApps/alpaca-ui/blob/develop/CONTRIBUTING.md) first. You can submit any ideas as GitHub issues.
## Development
```bash
git clone [email protected]:SnowdogApps/alpaca-ui.git
cd alpaca-ui
yarn
yarn dev
```
Open your browser, visit http://127.0.0.1:6006 and have fun.
## License
Code released under MIT license.
Copyright (c), [SNOW.DOG](https://snow.dog).