Horizon UI

This is a front-end component library based on Vue, design by Eyepetizer

Documentation

We have written a Documentation to introduce Horizon UI to developers and UI designers.

If you have any questions, please create issues to contact us.

Have fun!

Examples

Here are some mobile phone examples

Install

yarn add horizon-ui

Quick Start

Import all components.

import Vue from 'vue'
import Horizon from 'horizon-ui'
import 'horizon-ui/static/theme.scss'

Vue.use(Horizon)

Or import specified component. (Use babel-plugin-component)

import Vue from 'vue'
import 'horizon-ui/static/theme.scss'
import {
  Feed,
  FeedCard,
  Loading,
  Toast
  // ...
} from 'horizon-ui'

Vue.use(Feed)
Vue.use(FeedCard)
Vue.use(Loading)
Vue.prototype.$toast = Toast

babel-plugin-component

• Auto import css file
• Modular import component

Installation

yarn add babel-plugin-component -D

Usage

.babelrc

{
  "plugins": [
    ["component",
      {
        "libraryName": "horizon-ui",
        "styleLibraryName": "~node_modules/horizon-ui/static"
      },
      "horizon-ui"
    ]
  ]
}

Homepage

• https://thefair-net.github.io/Horizon-docs

Repository

• https://github.com/thefair-net/Horizon-UI

LICENSE

MIT