import React from "react";

import { FaMapPin } from "react-icons/fa";
/**
 * Pass along styles.
 */
export interface InstructionsProps {
  /**
   * Style pass through to the form.
   */
  style?: React.CSSProperties;
}
/**
 * Some text describing what to do to submit a bug.
 */
export const Instructions: React.FC<InstructionsProps> = (props) => {
  return (
    <div style={props.style}>
      <h4>Submitting a Bug</h4>
      <ol>
        <li>Summarize the problem</li>
        <li>Tells us more about it</li>
        <li>
          Show us where the problem is by pinning <FaMapPin /> the screenshot
          below
        </li>
        <li>Comment on your pins</li>
      </ol>
    </div>
  );
};
