Overview
The OlaReact is an implementation of the Ola design system created by marketgoo. It offers a wide range of components and utilities that can be used to build clean and modern user interfaces. The library has been tested and is compatible with various popular browsers.
Features
- Accordion: A component for displaying collapsible content sections.
- Button: A customizable button component with various design options.
- Button Group: A component for grouping multiple buttons together.
- Button Icon: A button component with an additional icon.
- Check: A checkbox component with customizable design options.
- CheckGroup: A group of checkboxes.
- Field: A form field component with customizable design options.
- Icon: A library of icons that can be used in conjunction with other components.
- Input: A text input field component with customizable design options.
- Level: A component for displaying hierarchical levels of content.
- Menu: A menu component for navigation purposes.
- Modal: A modal component for displaying content in a pop-up window.
- Page: A container component for organizing content sections.
- Panel: A collapsible panel component for displaying hidden content.
- ProgressBar: A component for visualizing progress.
- ProgressCircle: A circular progress component.
- SearchField: A component for search functionality.
- Select: A drop-down select component.
- Spinner: A loading spinner component.
- Switch: A toggle switch component.
- Table: A table component for displaying tabular data.
- Tag: A component for displaying tags or labels.
- Task: A component for tracking progress or a to-do list.
- TaskGroup: A group of task components.
- Tooltip: A component for displaying additional information on hover.
Installation
To install the OlaReact library, follow these steps:
- Import the Ola styles in your document.
<link href="path/to/ola-styles.css" rel="stylesheet">
- Add the “ola” class to the root element of your app (usually the html element).
<html class="ola">
...
</html>
- Import the desired Ola components in your app.
import { Button, Input, Modal } from 'ola-react';
Summary
The OlaReact library is a comprehensive implementation of the Ola design system. It provides a wide range of components and utilities that can be easily integrated into web applications. With compatibility across multiple browsers and a customizable design, OlaReact offers developers the flexibility to create clean and modern user interfaces.