Dat Library UI Elements

This is a work in progress.

To do:

• Progress Bar
• Simple buttons
• Dynamic Alerts
• Basic Menu (still needs css)
• Active state for buttons (for selected items)
• Global Loader
• Relative Loader
• Tags
• Form
• Text inputs
• Check lists (without style)
• Selection
• Code highlighting display element
• Badges (eg. for peer count etc)
• Style checkboxs
• Add button / hover style to inputs
• Radio Button
• Basic layout Components (eg sidebar, row, etc)
• Pagination elements
• Pop up modal
• Accordion Item (for library data)
• Table structure (for displaying book/author data)
• Grouped Lists
• Handle disabled and readonly styles for inputs
• ...

You can see all the available components here.

We are replacing the use of element-ui in dat library.

Install

npm install --save dat-library-ui

import Vue from 'vue'
import DatLibraryUI from 'dat-library-ui'
// import styles
import 'dat-library-ui/dist/styles.css'

// injects all components
Vue.use(DatLibraryUI);

Development

npm run dev

This will create two processes. Rollup which will watch and recompile the dat-library-ui bundle, and Webpack which launches a sample website at localhost:8080. All changes in the src directory will be hot loaded and visible there.

npm run build

This will rollup the library for production and build new docs representing the changes.