{"size": 606, "ext": "js", "max_stars_repo_path": "src/components/card/index.js", "max_stars_repo_name": "shaho/gig-landing-page", "max_stars_repo_stars_event_min_datetime": "2021-03-25T15:16:22.000Z", "max_stars_repo_stars_event_max_datetime": "2021-03-25T15:16:22.000Z", "max_issues_repo_path": "src/components/card/index.js", "max_issues_repo_name": "shaho/gig-landing-page", "max_issues_repo_issues_event_min_datetime": null, "max_issues_repo_issues_event_max_datetime": null, "max_forks_repo_path": "src/components/card/index.js", "max_forks_repo_name": "shaho/gig-landing-page", "max_forks_repo_forks_event_min_datetime": null, "max_forks_repo_forks_event_max_datetime": null}
{"max_stars_count": 1, "max_issues_count": null, "max_forks_count": null, "avg_line_length": 18.9375, "max_line_length": 62, "alphanum_fraction": 0.6188118812}
import React from "react";
import PropTypes from "prop-types";

import "./styles.scss";

export default function Card({
  title,
  description,
  color = "color-1",
  rotate = false,
  monochrome = false,
}) {
  return (
    <div
      className={`card ${color} ${rotate ? "rotate" : null} ${
        monochrome ? "monochrome" : null
      }`}
    >
      <h2>{title}</h2>
      <p>{description}</p>
    </div>
  );
}

Card.propTypes = {
  title: PropTypes.string.isRequired,
  description: PropTypes.string.isRequired,
  color: PropTypes.string,
  rotate: PropTypes.bool,
  monochrome: PropTypes.bool,
};
