Skip to content

Latest commit

 

History

History
70 lines (50 loc) · 2.1 KB

PateryButton.mdx

File metadata and controls

70 lines (50 loc) · 2.1 KB

PateryButton

Infomation

A simple patery ui button components

Why use PateryButton?

The PateryButton already has ready-made styles. You just add it and some functions. So it is possible to have a simple button but still keep a modern look. You can add icons and different components. Let's experience with PateryButton.

Usage

<PateryButton>Hello</PateryButton>

Ouput

Here is the output of the sample code. It is similar to what PateryButton can support.

hello

Styles

<PateryButton style={{ backgroundColor: "#4542f5", color: "#ffffff"}}>Hello</PateryButton>
<PateryButton style={{ backgroundColor: "#00ff4c", color: "#ffffff"}}>Hello</PateryButton>
<PateryButton style={{ backgroundColor: "#fc3826", color: "#ffffff"}}>Hello</PateryButton>

🗳 Warning

You cannot custom style by adding a className. Because unfortunately in v1 this function is not available.

Ouput

Here is the output of the sample code. It is similar to what PateryButton can support.

hello hello hello

Add icon

<PateryButton icon={"🧐"}>Hello</PateryButton>

Ouput

Here is the output of the sample code. It is similar to what PateryButton can support.

hello

NOTES: Icons can be icon components of other libraries you can add.

Example

<PateryButton icon={<Icon_Component/>}>Hello</PateryButton>


properties condition
icon String/Component