import { ExclamationTriangle } from "react-bootstrap-icons";
import howtohand from "../../Assets/Images/howtohand.png";
import "../../styles/howTo-page.scss";
export const Steps = () => (
  <div className="steps-wrapper">
    <div className="steps-text-wrapper">
      <h2 className="doc-header-text">Generate Discovery Responses</h2>
    </div>
    <div className="fooze">
      <div className="steps-upper-left">
        <div className="steps-text-wrapper">
          <span className="bold-span">CREATE THE CASE: </span> Click “Cases” in
          the top navigation bar to go to the Case View. Click “Create New Case”
          (lower right button) to surface the Create Case Modal. Follow prompts
          to enter relevant information. You will end with the Case's Details
          View. Click “Upload Document”.
        </div>
        <div className="steps-text-wrapper">
          <span className="bold-span">UPLOAD YOUR DOCUMENT: </span>You will now
          see the Document Upload Modal. Enter the discovery request's title,
          i.e. “Defendant’s Interrogatories,” and (optionally) the date served.
          Drag and drop, or click and select the .pdf from your files. {"  "}
          <div className="mini-break">
            Click <span className="bold-span"> “Upload”.</span>
          </div>
          <div className="mini-break">
            Parsing the document usually takes under 2 minutes, but be patient -
            it may take up to 5.
          </div>
        </div>
      </div>
      <div className="steps-upper-right">
        <div className="image-right-one">
          <div className="image-jhon"></div>
          <div className="image-moun">
            <img src={howtohand} className="howto-hand-img"></img>
          </div>
        </div>
      </div>
    </div>
    <div className="barzee">
      <div className="steps-text-wrapper">
        <span className="bold-span">GENERATE THE RESPONSE: </span>From the
        Document List View, click the “Generate Responses'' button. Novdraft’s
        Intellidraft AI will generate the response and automatically navigate to
        the interactive Document Editor. You can edit the responses and save
        progress any time by clicking the “Save Changes” button.
      </div>
      <div className="steps-text-wrapper">
        <span className="bold-span">DOWNLOAD YOUR RESPONSE DOCUMENT: </span>
        Click the “Create .Docx' button to download your fully-formatted,
        ready-to-serve response.
      </div>
      <ExclamationTriangle
        style={{ color: "red", marginRight: "6px", marginBottom: "2px" }}
      />
      <span className="bold-span">Pro tip:</span> Once you've created the case,
      you can skip step one. Simply search for the case by entering the case
      number in the search bar on your Dashboard, click "Express Document
      Upload" and follow the prompts.
    </div>
  </div>
);
