One For All UI

🎉 React Binding Is Here

Note

• NPM project is moved from one-fro-all-ui to @one-for-all-ui/core.
• Bindings for angular and vue are coming soon for easy use.

Installation

NPM

• React (For more info look at examples)

  npm i @one-for-all-ui/react --save

• Other

  npm i @one-for-all-ui/core --save

JavaScript

<script src="https://cdn.jsdelivr.net/npm/@one-for-all-ui/core/dist/one-for-all-ui/one-for-all-ui.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@one-for-all-ui/core/dist/one-for-all-ui/one-for-all-ui.css">

Themeing

• Below css variables are provided for theming of all components

--color-primary: your_color;
--color-secondary: your_color;
--color-font: your_color;

Note: Replace your_color with your choice of color.

Example

Dark Shadow (Modal)

• JavaScript - Example Link
• React - Example Link

Special Card (Card)

• JavaScript - Example Link
• React - Example Link

Zero Gravity Button (Floating Action Button)

• JavaScript - Example Link

• React - Example Link

• Note: If you want to show button respective to any element then set position to relative for that element.

Quirk Boomerang (Carousel)

• JavaScript - Example Link
• React - Example Link

For Development

To start locally, run:

npm install
npm start

To build the component for production, run:

npm run build

To run the unit tests for the components, run:

npm test