OaPack

This is a comic style UI kit for React.js, which features satisfying mouse clicking experience. It was designed for desktop, yet compatible with mobile.

Github           Npm Package

It is reported that a person normally clicks the mouse over 5000 times a day. Among those clicks, many were devoted to GUI components like Button, Menu, etc.
The idea of this project is to create a playful UI kit that makes every mouse click delightful, and maybe a little bit addictive. Beside that, this UI kit is also designed to be minimal enough that won't distract the user from important content.

What I personally like the most is <DropDown>. There are two kinds of <Button>, the normal one and the toggle. All kind of widgets can be disabled by adding property: disabled.

A <Card> was usually used as a wrapper for a bunch of contents that were tightly related to each other.

We can make a pyramid by wrapping multiple<Card>s.

There is a easter egg called oa-secret, the content of anything that has this class will be hiddent by default

There is also a <FilterGroup> that contains multiple filters. To make it a single choice filter, just add property: single.

I'm a <Carousel> that can contain anything inside.

This is a <CubeMenu> that has 3 facets to contain any stuffs.

Front
🎉