Button

Simple button component

Usage

<div className="d_f ai_c">
  <Button size="lg" className="mr_md">Large</Button>
  <Button size="md" className="mr_md">Medium</Button>
  <Button size="sm" className="mr_md">Small</Button>
</div>

Source

import cn from "classnames";

export default function Button({ children, size, className, onClick }) {
  const btn = cn({
    "cur_p bd_n bgc_black:h c_white:h": true,
    "px_lg py_sm bdrs_xs": size === "sm",
    "px_xl py_md bdrs_sm fz_md": size === "md",
    "px_xl py_md bdrs_sm fz_lg": size === "lg",
  }, className);

  return (
    <button className={btn} onClick={onClick}>
      {children}
    </button>
  );
}

Source

<button class="d_b cur_p px_lg py_sm bd_n bdrs_xs bgc_black:h c_white:h">
  Button
</button>