Skip to content

Latest commit

 

History

History
98 lines (60 loc) · 1.57 KB

README.md

File metadata and controls

98 lines (60 loc) · 1.57 KB

Button

Simple button component

Usage

import React from "react";
import { Button } from "aloria-ui";

export default function App() {
  return <Button>Hello</Button>;
}

Props

The ComponentName component takes the following props:

  • btnColor: It specifies the background color of the button. Default value: #29313D .

  • btnHoverColor: It specifies the background color of the button on hover. Default value: #222322 .

  • btnShadow: It specifies the box shadow color of the button. Default value: #111111 .

  • borderRadius: It specifies the border radius of the button. Default value: 5px .

  • width: It specifies the width of the button. Default value: 150px .

  • textColor: It specifies the font color of the button. Default value: #ffffff .

  • onClick: It specifies the onClick function of the button.

Preview/Example

Here is an example of how to use the ComponentName component.

import React, { useState } from "react";
import { Button } from "aloria-ui";

export default function App() {
  const [value, setValue] = useState("Hello");
  const setChange = () => {
    setValue(value === "Hello" ? "Bye" : "Hello");
  };
  return (
    <>
      <Button>Hello</Button>
      <Button onClick={() => setChange()}>{value}</Button>
    </>
  );
}

The button on the right has been clicked.